9

I have some vector graphic files in XAML format and I would like to use them as icons/buttons in an Silverlight application. The approach I would have preferred is to use an Image control and set its source property to the .xaml file, much like I can use a regular bitmap image.

But its not that easy and I have tried to include them as ControlTemplates in resource dictionary's and I even tried to create a custom control that would load the Xaml dynamically but I wasn't really pleased with the result, since I needed to wrap them in ViewBox controls to allow dynamic size etc.

So my questions is if any one has any best practice advices how to best use my xaml icons? I could copy-paste the xaml when needed but I really dont like that approach.

Thanks in advance.

jmw
  • 2,864
  • 5
  • 27
  • 32

1 Answers1

6

JWendel,

You should post some examples of your XAML icons to clarify, but any content control, like Button's and ContentControl's, have both Content, and ContentTemplate properties. A shared ContentTemplate example is shown below:

<UserControl
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:sdk="http://schemas.microsoft.com/winfx/2006/xaml/presentation/sdk"
    xmlns:toolkit="http://schemas.microsoft.com/winfx/2006/xaml/presentation/toolkit"
>
    <UserControl.Resources>
        <Style x:Key="MyTriangleIcon" TargetType="ContentControl">
            <Setter Property="ContentTemplate">
                <Setter.Value>
                    <DataTemplate>
                        <Grid>
                            <Polygon Fill="Black" Stroke="Black">
                                <Polygon.Points>
                                    <Point X="0" Y="100"/>
                                    <Point X="100" Y="0"/>
                                    <Point X="100" Y="100"/>
                                </Polygon.Points>
                            </Polygon>
                            <Polygon Fill="Red" Stroke="Red">
                                <Polygon.Points>
                                    <Point X="100" Y="0"/>
                                    <Point X="0" Y="100"/>
                                    <Point X="0" Y="0"/>
                                </Polygon.Points>
                            </Polygon>
                        </Grid>
                    </DataTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </UserControl.Resources>

    <StackPanel Background="White">
        <Button Width="120" Height="120" Style="{StaticResource MyTriangleIcon}" />
        <Button Width="120" Height="120" Style="{StaticResource MyTriangleIcon}" />
    </StackPanel>

</UserControl>

You can paste the above content into my XamlViewer to quickly see the results.

Good luck,
Jim McCurdy

Jim McCurdy
  • 2,052
  • 14
  • 14
  • 1
    Thanks for your relpy Jim. But thats does not solve the "problem" of having to duplicate my XAML for all controls that uses an image or atleast make an one style/template for each control type. I would like to find a way that let me work with .xaml files in a similar way that I work with .png or .jpeg files. Its not a big deal but I felt like the copy-paste way of using them was not satisfying enough and you are correct in that I could use them with Content properties. – jmw Feb 02 '11 at 06:39
  • To avoid duplication, just instantiating your XAML "icons" as ContentControl resource templates, either at the Application level (Application.Resources) or at the UserControls level (UserControl.Resources). I modified my XAML above to show how this can be done, and how it allows for your XAML to be re-used. – Jim McCurdy Feb 02 '11 at 18:05