Edward Tanguay
Edward Tanguay

Reputation: 193302

What are your strategies for putting XAML into styles?

When I create WPF applications, very quickly my XAML starts to bloat.

I then approach the XAML/style issue in a HTML/CSS way, looking for repetitive code and packing it into styles which I put into my Window.Resources section.

Is this the way others are doing it or is there some better way now in XAML? It just seems that the two blocks below only differ on two little words, it seems that I could put it in some kind of functional user control (this is a left-side menu) so that when I have 25 elements in my menu I could just have 25 lines of same with the names and perhaps the Click targets.

Or perhaps when I move this to MVVM this issue will take care of itself with DataBinding (it is currrently just a hard-coded prototype), so I can keep the names of the menu items in a collection in my ViewModel and it then creates the menu dynamically in an ItemsControl?

Or are bloated XAML files just a fact of life with WPF applications?

What kind of XAML styling strategies do you have when you create WPF applications?

Window.Resources (top of file):

<Window.Resources>
    <Style x:Key="Link" TargetType="Button">
        <Setter Property="Cursor" Value="Hand"/>
        <Setter Property="Foreground" Value="#555"/>
        <Setter Property="Background" Value="Transparent"/>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="Button">
                    <TextBlock TextDecorations="Underline" 
                Text="{TemplateBinding Content}"
                Background="{TemplateBinding Background}"/>
                    <ControlTemplate.Triggers>
                        <Trigger Property="IsPressed" Value="True">
                            <Setter Property="Foreground" Value="Red"/>
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
</Window.Resources>

Current XAML:

<Expander HorizontalAlignment="Left" Header="File" VerticalAlignment="Top" ExpandDirection="Down" Width="200" Padding="2">
    <Expander.Background>
        <LinearGradientBrush>
            <GradientStop Color="#bbb" Offset="0"/>
            <GradientStop Color="#ccc" Offset="1"/>
        </LinearGradientBrush>
    </Expander.Background>
    <Border CornerRadius="5">
        <Border.Background>
            <LinearGradientBrush>
                <GradientStop Color="#ccc" Offset="0"/>
                <GradientStop Color="#bbb" Offset="1"/>
            </LinearGradientBrush>
        </Border.Background>
        <StackPanel HorizontalAlignment="Stretch" VerticalAlignment="Top">
            <Button Click="buttonClose_Click" 
                Style="{StaticResource Link}" 
                Margin="10 3 3 3"
                Content="Close">
            </Button>
        </StackPanel>
    </Border>
</Expander>

<Expander HorizontalAlignment="Left" Header="Customers" VerticalAlignment="Top" ExpandDirection="Down" Width="200" Padding="2">
    <Expander.Background>
        <LinearGradientBrush>
            <GradientStop Color="#bbb" Offset="0"/>
            <GradientStop Color="#ccc" Offset="1"/>
        </LinearGradientBrush>
    </Expander.Background>
    <Border CornerRadius="5">
        <Border.Background>
            <LinearGradientBrush>
                <GradientStop Color="#ccc" Offset="0"/>
                <GradientStop Color="#bbb" Offset="1"/>
            </LinearGradientBrush>
        </Border.Background>
        <StackPanel HorizontalAlignment="Left" VerticalAlignment="Top">
            <Button Click="btnAppPage_Click" 
                Tag="CustomerAdd"
                Style="{StaticResource Link}" 
                Margin="10 3 3 3"
                Content="Create Customer"/>
        </StackPanel>
    </Border>
</Expander>

Upvotes: 2

Views: 452

Answers (2)

Kent Boogaart
Kent Boogaart

Reputation: 178660

Simple: identify repetition and move it into a control. The control can have whatever properties necessary to compose the required variations at runtime. And it can be re-templated by virtue of being a control.

Upvotes: 1

Sergey Aldoukhov
Sergey Aldoukhov

Reputation: 22744

Also, you can identify repetitions and move them into resources. One resource can easily reference another.

Upvotes: 0

Related Questions