Getting Started with WPF Basics-Class2-Style

Getting Started with WPF Basics

Class2: style

1. Inline style:优先度最高

<Grid>
        <StackPanel>
            <!--内联样式优先度高-->
            <Button 
                Background="Red" 
                Height="10" 
                Width="100"
                FontSize="20"
                Content="SB">
            </Button>
        </StackPanel>
    </Grid>

2. Create public Style resources (eg. front-end css)

<Window.Resources>
        <!--创建资源-->
        <!--TargetType类型需要和使用的控件一致-->
        <Style x:Key="style_1" TargetType="Button">
            <Setter Property="FontSize" Value="18"></Setter>
            <Setter Property="Foreground" Value="Blue"></Setter>
            <Setter Property="Background" Value="DimGray"></Setter>
            <Setter Property="Height" Value="40"></Setter>
            <Setter Property="Content" Value="BaseBtn"></Setter>
        </Style>
</Window.Resources>
<Grid>
        <StackPanel>
            <Button Style="{ 
        StaticResource style_1}"></Button>
        </StackPanel>
</Grid>

3. Based on Style, inherit resources (Style2 inherits Style1)

    <Window.Resources>
        <!--创建资源-->
        <!--TargetType类型需要一致-->
        <Style x:Key="style_1" TargetType="Button">
            <Setter Property="FontSize" Value="18"></Setter>
            <Setter Property="Foreground" Value="Blue"></Setter>
            <Setter Property="Background" Value="DimGray"></Setter>
            <Setter Property="Height" Value="40"></Setter>
            <Setter Property="Content" Value="BaseBtn"></Setter>
        </Style>

        <Style x:Key="child" TargetType="Button" BasedOn="{StaticResource style_1}">
            <Setter Property="Content" Value="继承资源"></Setter>
        </Style>
    </Window.Resources>
    
    <Grid>
        <StackPanel>
            <Button Style="{ 
        StaticResource style_1}"></Button>
            <Button Style="{ 
        StaticResource child}"></Button>
        </StackPanel>
    </Grid>

Rendering: