Question

我在互联网上找到了一个漂亮的玻璃按钮的以下模板。正如您所看到的，它具有按钮背景的属性设置，

<Setter TargetName="border" Property="Background" Value="#FF000000" />

但如果我在Blend中将其更改为任何其他值，则按钮的背景不会改变.. 我必须直接在Setter标签中更改值，这将影响使用此模板的表单中的所有按钮... 如何更改代码以使用此模板为不同的按钮提供不同的背景？

<ControlTemplate x:Key="GlassButton" TargetType="{x:Type Button}">
        <ControlTemplate.Resources>
            <Storyboard x:Key="Timeline1">
                <DoubleAnimationUsingKeyFrames BeginTime="00:00:00"
                                               Storyboard.TargetName="glow"
                                               Storyboard.TargetProperty="(UIElement.Opacity)">
                    <SplineDoubleKeyFrame KeyTime="00:00:00.3000000" Value="1" />
                </DoubleAnimationUsingKeyFrames>
            </Storyboard>
            <Storyboard x:Key="Timeline2">
                <DoubleAnimationUsingKeyFrames BeginTime="00:00:00"
                                               Storyboard.TargetName="glow"
                                               Storyboard.TargetProperty="(UIElement.Opacity)">
                    <SplineDoubleKeyFrame KeyTime="00:00:00.3000000" Value="0" />
                </DoubleAnimationUsingKeyFrames>
            </Storyboard>
        </ControlTemplate.Resources>
        <Border BorderBrush="#FFFFFFFF"
                BorderThickness="0"
                CornerRadius="4,4,4,4">
            <Border x:Name="border"
                    Background="#7F000000"
                    BorderBrush="#FF000000"
                    BorderThickness="1"
                    CornerRadius="4,4,4,4">
                <Grid>
                    <Grid.RowDefinitions>
                        <RowDefinition Height="0.507*" />
                        <RowDefinition Height="0.493*" />
                    </Grid.RowDefinitions>
                    <Border x:Name="glow"
                            Grid.RowSpan="2"
                            Width="Auto"
                            HorizontalAlignment="Stretch"
                            CornerRadius="4,4,4,4"
                            Opacity="0">
                        <Border.Background>
                            <RadialGradientBrush>
                                <RadialGradientBrush.RelativeTransform>
                                    <TransformGroup>
                                        <ScaleTransform ScaleX="1.702" ScaleY="2.243" />
                                        <SkewTransform AngleX="0" AngleY="0" />
                                        <RotateTransform Angle="0" />
                                        <TranslateTransform X="-0.368" Y="-0.152" />
                                    </TransformGroup>
                                </RadialGradientBrush.RelativeTransform>
                                <GradientStop Offset="0" Color="#B28DBDFF" />
                                <GradientStop Offset="1" Color="#008DBDFF" />
                            </RadialGradientBrush>
                        </Border.Background>
                    </Border>
                    <ContentPresenter Grid.RowSpan="2"
                                      Width="Auto"
                                      HorizontalAlignment="Center"
                                      VerticalAlignment="Center" />
                    <Border x:Name="shine"
                            Width="Auto"
                            Margin="0,0,0,0"
                            HorizontalAlignment="Stretch"
                            CornerRadius="4,4,0,0">
                        <Border.Background>
                            <LinearGradientBrush StartPoint="0.494,0.028" EndPoint="0.494,0.889">
                                <GradientStop Offset="0" Color="#99FFFFFF" />
                                <GradientStop Offset="1" Color="#33FFFFFF" />
                            </LinearGradientBrush>
                        </Border.Background>
                    </Border>
                </Grid>
            </Border>
        </Border>
        <ControlTemplate.Triggers>
            <Trigger Property="IsPressed" Value="True">
                <Setter TargetName="shine" Property="Opacity" Value="0.4" />
                <Setter TargetName="border" Property="Background" Value="#FF000000" />
                <Setter TargetName="border" Property="BorderBrush" Value="#FF000000" />
                <Setter TargetName="glow" Property="Visibility" Value="Hidden" />
            </Trigger>
            <Trigger Property="IsMouseOver" Value="True">
                <Trigger.EnterActions>
                    <BeginStoryboard Storyboard="{StaticResource Timeline1}" />
                </Trigger.EnterActions>
                <Trigger.ExitActions>
                    <BeginStoryboard x:Name="Timeline2_BeginStoryboard" Storyboard="{StaticResource Timeline2}" />
                </Trigger.ExitActions>
            </Trigger>
        </ControlTemplate.Triggers>
    </ControlTemplate>

Answer 1

您可以使用绑定：

<Setter TargetName="border" Property="Background"
        Value="{Binding RelativeSource={RelativeSource Mode=TemplatedParent}, Path=Background}" />

这样，您可以单独为每个按钮设置背景，并且setter使用的背景将绑定到按钮的Background属性。

<Button Background="Red"  Content="First" />
<Button Background="Blue" Context="Second" />

在wpf中更改按钮模板的背景颜色

1 个答案: