XAML in WP8.1: Child Element Styles

Question

I have a Grid and TextBlocks. I want to style all TextBlocks within the Grid. So I do this:

<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="1*" />
        <ColumnDefinition Width="1*" />
    </Grid.ColumnDefinitions>
    <Grid.Resources>
        <Style TargetType="TextBlock">
            <Setter Property="Margin" Value="0,0,0,15" />
        </Style>
    </Grid.Resources>

    <StackPanel Grid.Column="0">
        <TextBlock Text="myText" Style="{StaticResource TitleTextBlockStyle}" />
        <TextBlock Text="myText" Style="{StaticResource TitleTextBlockStyle}" />
    </StackPanel>

    <StackPanel Grid.Column="1">
        <TextBlock Text="123456" Style="{StaticResource TitleTextBlockStyle}" Foreground="{ThemeResource PhoneAccentBrush}" />
        <TextBlock Text="123456" Style="{StaticResource TitleTextBlockStyle}" Foreground="{ThemeResource PhoneAccentBrush}" />
    </StackPanel>

</Grid>

1) It's not working. TextBlocks don't get any Margins. Why?

2) How can I set the Style and Foreground properties of TextBlocks in the <Grid.Resources> tag?

Answer 1

1) It's not working. TextBlocks don't get any Margins. Why?

It's not working because you're assigning the style "TitleTextBlockStyle" to the TextBlocks. So the implicit style you defined in Grid.Resources doesn't come in to play. Remove the Style="{StaticResource TitleTextBlockStyle}" parts from the TextBlocks, and your margins will appear.

2) How can I set the Style and Foreground properties of TextBlocks in the <Grid.Resources> tag?

The same as you set everything else:

<Setter Property="Foreground" Value="AliceBlue"/>

or if you have a more elaborate brush:

    <Setter Property="Foreground">
       <Setter.Value>
        <!-- Whatever brush you want -->
       <Setter.Value/>
    </Setter>

I assume that with "Set the style property of TextBlocks", you actually want your new style to inherit from an already defined style. In that case you can base your new style on an already existing style:

        <Style TargetType="TextBlock"
               BasedOn="{StaticResource StyleToInheritFrom}">

or, in your case, presumably:

    <Style TargetType="TextBlock" BasedOn="{StaticResource TitleTextBlockStyle}">
        <Setter Property="Margin" Value="0,0,0,15" />
    </Style>

The full thing would look something like:

<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="1*" />
        <ColumnDefinition Width="1*" />
    </Grid.ColumnDefinitions>
    <Grid.Resources>
        <Style TargetType="TextBlock" BasedOn="{StaticResource TitleTextBlockStyle}">
            <Setter Property="Margin" Value="0,0,0,15" />
            <Setter Property="Foreground" Value="{ThemeResource PhoneAccentBrush}"/>
        </Style>
    </Grid.Resources>

    <StackPanel Grid.Column="0">
        <TextBlock Text="myText" />
        <TextBlock Text="myText" />
    </StackPanel>

    <StackPanel Grid.Column="1">
        <TextBlock Text="123456" />
        <TextBlock Text="123456" />
    </StackPanel>

</Grid