1

I would like to know how to set style targetting child controls on the UWP within a style definition.

WPF seems to have 'Style.Resources' to define sub-styles but this doesn't seem the case for UWP

example in wpf : WPF - How to create a style that applies styles to child types

1
  • You can throw them in Whatever.Resources and they'll be inherited. Commented Apr 8, 2016 at 15:58

2 Answers 2

1

If you want the styles in separate sheets ( which you should. I showed the Styles in the control itself because I misread and thought that's what you wanted ) you can create a Resources folder and add different ResourceDictionaries. Personally I usually create a separate dictionary for Brushes, Styles, Templates, and Converters. Then you declare them in the ResourceDictionary.MergedDictionaries in App.xaml

  <Application
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
RequestedTheme="Light">
<Application.Resources>
    <ResourceDictionary>
        <ResourceDictionary.MergedDictionaries>
          <ResourceDictionary Source="/Resources/Brushes.xaml" />
          <ResourceDictionary Source="/Resources/Styles.xaml" />
            <ResourceDictionary Source="/Resources/Converters.xaml" />
            <ResourceDictionary Source="/Resources/Templates.xaml"/>
        </ResourceDictionary.MergedDictionaries>
    </ResourceDictionary>
</Application.Resources>

Sign up to request clarification or add additional context in comments.

1 Comment

Sorry for being unclear i'm new to xaml , that part I understand. Let's take your Styles.xaml in MergedDictionaries , how would I define styles for a custom control and it's subcontrols. Taking your earlier example with the StackPanel, i imagine you would have a Style with StackPanel as TargetType and then set the Style on the StackPanel as StaticResource but what about the rectangles defined inside it ? With Style.Resources it seems I would be able to get a style hierarchy for a custom control in my Styles.xaml, but there is none in UWP and that's what i want. Thanks for your time.
0

You can define Styles in the ResourceDictionary of the parent control. The Style defined in Window.Resources applies to all Rectangles because it doesn't specify a Key, so the Rectangle in the first StackPanel is yellow and small. The second StackPanel defines it's own Resources, which its children use, and they end up different colors and a larger size. There's also Style inheritance in there using BasedOn

<Window x:Class="GBTest.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:local="clr-GBTest"
    mc:Ignorable="d"
    Title="MainWindow"
    Height="350"
    Width="525">
<!--Default style defined in the Window Resources-->
<Window.Resources>
    <Style TargetType="Rectangle">
        <Setter Property="Width"
                Value="100" />
        <Setter Property="Height" Value="100" />
        <Setter Property="Fill"
                Value="Yellow" />
    </Style>
</Window.Resources>
<StackPanel>
    <Rectangle />
    <StackPanel>
        <!--The styles defined in the resources of this StckPanel will apply to its children, overriding the default style defined in the Window Resources-->
        <StackPanel.Resources>
            <Style TargetType="Rectangle"
                   x:Key="BigStyle">
                <Setter Property="Height"
                        Value="200" />
                <Setter Property="Width"
                        Value="200" />
            </Style>
            <Style TargetType="Rectangle"
                   x:Key="RedStyle"
                   BasedOn="{StaticResource BigStyle}">
                <Setter Property="Fill"
                        Value="Red" />
            </Style>
            <Style TargetType="Rectangle"
                   BasedOn="{StaticResource BigStyle}"
                   x:Key="BlueStyle">
                <Setter Property="Fill"
                        Value="Blue" />
            </Style>
        </StackPanel.Resources>

        <Rectangle Style="{StaticResource RedStyle}" />
        <Rectangle Style="{StaticResource BlueStyle}" />
    </StackPanel>
</StackPanel>

1 Comment

Thanks for your replay, while this would do the job, this still means i'm defining styles in the control itself. What I want is to have completely separated styles and controls. A bit like CSS where i define everything in an apart file. That's why i thought the Style.Resources was nice to have

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.