Windows Phone (13) style inheritance

In the previous article, we have introduced the ability to define styles in the resources set. We can also reference other styles in one style. This is the concept of inheritance, the reference style is placed in the baseon attribute of the style. Here, the XAML markup extension is used for setting. For example, the three styles defined here:

 <phone:PhoneApplicationPage.Resources>        <Style x:Key="tbStyle" TargetType="TextBlock">            <Setter Property="HorizontalAlignment" Value="Center"></Setter>            <Setter Property="HorizontalAlignment" Value="Center"></Setter>            <Setter Property="Foreground">                <Setter.Value>                    <LinearGradientBrush>                        <GradientStop Offset="0.2" Color="Brown"></GradientStop>                        <GradientStop Offset="0.7" Color="DarkBlue"></GradientStop>                    </LinearGradientBrush>                </Setter.Value>            </Setter>        </Style>        <Style x:Key="fStyle" TargetType="TextBlock">            <Setter Property="VerticalAlignment" Value="Bottom"></Setter>        </Style>        <Style x:Key="tStyle" TargetType="TextBlock" BasedOn="{StaticResource tbStyle}">            <Setter Property="VerticalAlignment" Value="Top"></Setter>        </Style>    </phone:PhoneApplicationPage.Resources>

From the code above, we can see that the third style inherits the first style, then the vertical position defined in the first style, and the third also defines the vertical position, then we use the third style from textblock.

<Textblock X: Name = "tbcontent" text = "display style" style = "{staticresource tstyle}"/>

The effect is as follows:

 

This indicates that the attributes in the third style overwrite the same attributes in the first style. Note that the preceding three styles are sequential, that is, the following can inherit the preceding attributes, however, the system will prompt a warning that the style you want to inherit cannot be found. What will happen if the styles in these three styles are cascade inherited: the Code is as follows:

 

<phone:PhoneApplicationPage.Resources>        <Style x:Key="tbStyle" TargetType="TextBlock">            <Setter Property="HorizontalAlignment" Value="Center"></Setter>            <Setter Property="HorizontalAlignment" Value="Center"></Setter>            <Setter Property="Foreground">                <Setter.Value>                    <LinearGradientBrush>                        <GradientStop Offset="0.2" Color="Brown"></GradientStop>                        <GradientStop Offset="0.7" Color="DarkBlue"></GradientStop>                    </LinearGradientBrush>                </Setter.Value>            </Setter>        </Style>        <Style x:Key="tStyle" TargetType="TextBlock" BasedOn="{StaticResource tbStyle}">            <Setter Property="VerticalAlignment" Value="Top"></Setter>            <Setter Property="HorizontalAlignment" Value="Left"></Setter>        </Style>        <Style x:Key="fStyle" TargetType="TextBlock" BasedOn="{StaticResource tStyle}">            <Setter Property="VerticalAlignment" Value="Bottom"></Setter>        </Style>           </phone:PhoneApplicationPage.Resources>

Then textblock uses the third Style

<Textblock X: Name = "tbcontent" text = "display style" style = "{staticresource fstyle}"/>

The effect is like this.

 

So we can sum up and define three or more styles, such as A, B, and C. If B inherits a and c inherits B, the priority is C> B>, it can also be said that the inheritance of style is higher and the priority is lower;

I will share with you the following link:

 

WP7 development and learning (4): Four styles ---- Summary of styles in WP

 

Dependency properties in WPF-dependency properties are finally understood