WPF可以由其他样式继承的泛型样式

时间:2016-03-23 09:59:41

标签: c# wpf wpf-style

我从这个问题开始说我没有太多使用WPF的经验,因为我刚开始使用它(我之前的所有C#体验都是使用Windows Forms和ASP.net)。

让我们说我在App.xaml中定义了两种样式,一种定义了一个蓝色按钮,另一种定义了一个红色按钮:

context.drawImage(cachedText, (d_canvas.width / 2) - (cachedText.width / 2), (d_canvas.height / 2) - (cachedText.width / 2), cachedText.width, cachedText.height);

如何合并这两种样式以制作一般"包含"?

的样式

编辑:

Dmitriy Polyanskiy的答案有效,但每次我想要创造一种新风格时,我仍然需要设置每个属性。有没有办法做这样的事情:<Style x:Key="BlueButton" TargetType="Button"> <Setter Property="Foreground" Value="White" /> <Setter Property="Background"> <Setter.Value> <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0"> <GradientStop Color="#FF50D0FF"/> <GradientStop Color="#FF0092C8" Offset="1"/> </LinearGradientBrush> </Setter.Value> </Setter> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="{x:Type Button}"> <Border CornerRadius="2" Background="{TemplateBinding Background}"> <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center"/> </Border> </ControlTemplate> </Setter.Value> </Setter> <Style.Triggers> <Trigger Property="IsPressed" Value="True"> <Setter Property="Background"> <Setter.Value> <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0"> <GradientStop Color="#FF0092C8"/> <GradientStop Color="#FF50D0FF" Offset="1"/> </LinearGradientBrush> </Setter.Value> </Setter> </Trigger> </Style.Triggers> </Style> <Style x:Key="RedButton" TargetType="Button"> <Setter Property="Foreground" Value="White" /> <Setter Property="Background"> <Setter.Value> <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0"> <GradientStop Color="#FFFFAE00" Offset="0"/> <GradientStop Color="Red" Offset="1"/> </LinearGradientBrush> </Setter.Value> </Setter> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="{x:Type Button}"> <Border CornerRadius="2" Background="{TemplateBinding Background}"> <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center"/> </Border> </ControlTemplate> </Setter.Value> </Setter> <Style.Triggers> <Trigger Property="IsPressed" Value="True"> <Setter Property="Background"> <Setter.Value> <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0"> <GradientStop Color="Red" Offset="0"/> <GradientStop Color="#FFFFAE00" Offset="1"/> </LinearGradientBrush> </Setter.Value> </Setter> </Trigger> </Style.Triggers> </Style>

<Style x:Key="RedButton" TargetType="Button" BasedOn="{StaticResource BaseButtonStyle}" Color1="#FFFFAE00" Color2="Red" />

然后自动设置两种渐变颜色?

3 个答案:

答案 0 :(得分:2)

基本上,您希望基于“参数化”样式创建样式。

您需要做的是使用DynamicResources为GradientStop的颜色创建基本样式。然后,在基于它的样式中,覆盖资源颜色。

BaseButtonStyle:

<Style x:Key="BaseButtonStyle" TargetType="Button">
    <Style.Resources>
        <Color x:Key="Color1">White</Color>
        <Color x:Key="Color2">Gray</Color>
    </Style.Resources>
    <Setter Property="Foreground" Value="White" />
    <Setter Property="Background">
        <Setter.Value>
            <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                <GradientStop Color="{DynamicResource Color1}"/>
                <GradientStop Color="{DynamicResource Color2}" Offset="1"/>
            </LinearGradientBrush>
        </Setter.Value>
    </Setter>
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type Button}">
                <Border CornerRadius="2" Background="{TemplateBinding Background}">
                    <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center"/>
                </Border>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
    <Style.Triggers>
        <Trigger Property="IsPressed" Value="True">
            <Setter Property="Background">
                <Setter.Value>
                    <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                        <GradientStop Color="{DynamicResource Color2}" />
                        <GradientStop Color="{DynamicResource Color1}" Offset="1" />
                    </LinearGradientBrush>
                </Setter.Value>
            </Setter>
        </Trigger>
    </Style.Triggers>
</Style>

基于样式:

<Style x:Key="RedButton" TargetType="Button" BasedOn="{StaticResource BaseButtonStyle}">
    <Style.Resources>
        <Color x:Key="Color1">#FFFFAE00</Color>
        <Color x:Key="Color2">Red</Color>
    </Style.Resources>
</Style>
<Style x:Key="BlueButton" TargetType="Button" BasedOn="{StaticResource BaseButtonStyle}">
    <Style.Resources>
        <Color x:Key="Color1">#FF50D0FF</Color>
        <Color x:Key="Color2">#FF0092C8</Color>
    </Style.Resources>
</Style>
<Style x:Key="GreenButton" TargetType="Button" BasedOn="{StaticResource BaseButtonStyle}">
    <Style.Resources>
        <Color x:Key="Color1">Green</Color>
        <Color x:Key="Color2">LightGreen</Color>
    </Style.Resources>
</Style>
<Style x:Key="PurpleYellowButton" TargetType="Button" BasedOn="{StaticResource BaseButtonStyle}">
    <Style.Resources>
        <Color x:Key="Color1">Purple</Color>
        <Color x:Key="Color2">Yellow</Color>
    </Style.Resources>
</Style>

按钮堆栈面板的屏幕截图: enter image description here

答案 1 :(得分:0)

我刚刚为您创建了一个快速示例,向您展示如何执行此操作。您应该描述具有公共属性的基本样式。然后只使用BaseOn = {StaticResource BaseStyle}

<Style x:Key="BaseButtonStyle" TargetType="Button">
    <Setter Property="Foreground" Value="White" />
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type Button}">
                <Border
                    CornerRadius="2"
                    Background="{TemplateBinding Background}">
                    <ContentPresenter
                        HorizontalAlignment="Center"
                        VerticalAlignment="Center"/>
                </Border>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>


<Style x:Key="RedButton" TargetType="Button"
       BasedOn="{StaticResource BaseButtonStyle}">
    <Setter Property="Background">
        <Setter.Value>
            <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                <GradientStop Color="#FFFFAE00" Offset="0"/>
                <GradientStop Color="Red" Offset="1"/>
            </LinearGradientBrush>
        </Setter.Value>
    </Setter>
    <Style.Triggers>
        <Trigger Property="IsPressed" Value="True">
            <Setter Property="Background">
                <Setter.Value>
                    <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                        <GradientStop Color="Red" Offset="0"/>
                        <GradientStop Color="#FFFFAE00" Offset="1"/>
                    </LinearGradientBrush>
                </Setter.Value>
            </Setter>
        </Trigger>
    </Style.Triggers>
</Style>

答案 2 :(得分:0)

实现这一目标的一种方法是定义样式,而不是在样式本身中给出渐变,您可以像下面一样使用DynamicResource。然后对于每个按钮,您可以定义它将使用的本地资源LinearGradientBrush并在那里设置您的颜色。

<Window x:Class=""
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="350" Width="525">
    <Window.Resources>
        <Style x:Key="BaseButtonStyle" TargetType="Button">
            <Setter Property="Foreground" Value="White" />
            <Setter Property="Background" Value="{DynamicResource GradientBrushNormal}">
            </Setter>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type Button}">
                        <Border CornerRadius="2" Background="{TemplateBinding Background}">
                            <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center"/>
                        </Border>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
            <Style.Triggers>
                <Trigger Property="IsPressed" Value="True">
                    <Setter Property="Background" Value="{DynamicResource GradientBrushPressed}">
                    </Setter>
                </Trigger>
            </Style.Triggers>
        </Style>
    </Window.Resources>
    <StackPanel>
       <Button Style="{StaticResource BaseButtonStyle}" Content="Blue Button">
            <Button.Resources>
                <LinearGradientBrush x:Key="GradientBrushPressed" EndPoint="0.5,1" StartPoint="0.5,0">
                    <GradientStop Color="#FF0092C8"/>
                    <GradientStop Color="#FF50D0FF" Offset="1"/>
                </LinearGradientBrush>
                <LinearGradientBrush x:Key="GradientBrushNormal" EndPoint="0.5,1" StartPoint="0.5,0">
                    <GradientStop Color="#FF50D0FF"/>
                    <GradientStop Color="#FF0092C8" Offset="1"/>
                </LinearGradientBrush>
            </Button.Resources>
       </Button>
        <Button Style="{StaticResource BaseButtonStyle}" Content="Red Button">
            <Button.Resources>
                <LinearGradientBrush x:Key="GradientBrushPressed" EndPoint="0.5,1" StartPoint="0.5,0">
                    <GradientStop Color="Red" Offset="0"/>
                    <GradientStop Color="#FFFFAE00" Offset="1"/>
                </LinearGradientBrush>
                <LinearGradientBrush x:Key="GradientBrushNormal" EndPoint="0.5,1" StartPoint="0.5,0">
                    <GradientStop Color="#FFFFAE00" Offset="0"/>
                    <GradientStop Color="Red" Offset="1"/>
                </LinearGradientBrush>
            </Button.Resources>
        </Button>
    </StackPanel>
</Window>