0

我创建了一个按钮控件模板,我想在其中更改 xaml 级别上按钮的发光颜色。这就是我的意思。

<Button x:Name="btnClose" Template="{DynamicResource GlassButton}" Width="32" Height="32" GlowStartColor="Red" GlowEndColor="DarkRed">Button1</Button>

GlowStartColor 和 GlowEndColor 是我要在控件模板上更改的属性。

这是我的控制模板

    <ControlTemplate x:Key="DefaultGlassButton" TargetType="{x:Type Button}">
    <!-- Internal Resources -->
    <ControlTemplate.Resources>
        <Storyboard x:Key="Storyboard1" RepeatBehavior="Forever" AutoReverse="True">
            <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="Glow" Storyboard.TargetProperty="(UIElement.Opacity)">
                <SplineDoubleKeyFrame KeyTime="00:00:00.3000000" Value="1"/>
                <SplineDoubleKeyFrame KeyTime="00:00:00.7000000" Value="1"/>
            </DoubleAnimationUsingKeyFrames>
            <ColorAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="Glow" Storyboard.TargetProperty="(Panel.Background).(GradientBrush.GradientStops)[1].(GradientStop.Color)">
                <SplineColorKeyFrame KeyTime="00:00:00.3000000" Value="#00C080FF"/>
                <SplineColorKeyFrame KeyTime="00:00:00.7000000" Value="#00C080FF"/>
            </ColorAnimationUsingKeyFrames>
        </Storyboard>
        <Storyboard x:Key="Storyboard2">
            <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="Glow" Storyboard.TargetProperty="(UIElement.Opacity)">
                <SplineDoubleKeyFrame KeyTime="00:00:00.3000000" Value="0.745"/>
            </DoubleAnimationUsingKeyFrames>
        </Storyboard>
    </ControlTemplate.Resources>

    <!-- Actual Control Template-->
    <Border x:Name="OuterBorder" BorderBrush="#FFFFFFFF" BorderThickness="1,1,1,1" CornerRadius="4,4,4,4">
        <Border x:Name="InnerBorder" Background="#7F000000" BorderBrush="#FF000000" BorderThickness="1,1,1,1" CornerRadius="4,4,4,4">
            <Grid x:Name="MainGrid">
                <Grid.RowDefinitions>
                    <RowDefinition Height="0.5*"/>
                    <RowDefinition Height="0.5*"/>
                </Grid.RowDefinitions>
                <Border x:Name="Glow" HorizontalAlignment="Stretch" Width="Auto" Opacity="0" Grid.RowSpan="2" CornerRadius="4,4,4,4">
                    <Border.Background>
                        <RadialGradientBrush>
                            <RadialGradientBrush.RelativeTransform>
                                <TransformGroup>
                                    <ScaleTransform CenterX="0.5" CenterY="0.5" ScaleX="1.852" ScaleY="2.281"/>
                                    <SkewTransform AngleX="0" AngleY="0" CenterX="0.5" CenterY="0.5"/>
                                    <RotateTransform Angle="0" CenterX="0.5" CenterY="0.5"/>
                                    <TranslateTransform X="0.014" Y="0.458"/>
                                </TransformGroup>
                            </RadialGradientBrush.RelativeTransform>
                            <GradientStop x:Name="GlowStartColor" Color="#B1FF80FF" Offset="0"/>
                            <GradientStop x:Name="GlowEndColor" Color="#00C080FF" Offset="1"/>
                        </RadialGradientBrush>
                    </Border.Background>
                </Border>
                <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center" Width="Auto" Grid.RowSpan="2"/>
                <Border x:Name="Shine" HorizontalAlignment="Stretch" Margin="0,0,0,0" CornerRadius="4,4,0,0">
                    <Border.Background>
                        <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                            <GradientStop x:Name="ShineStartColor" Color="#99FFFFFF" Offset="0"/>
                            <GradientStop x:Name="ShineEndColor" Color="#26FFFFFF" Offset="1"/>
                        </LinearGradientBrush>
                    </Border.Background>
                </Border>
            </Grid>
        </Border>
    </Border>

    <!-- Triggers -->
    <ControlTemplate.Triggers>
        <Trigger Property="IsMouseOver" Value="True">
        </Trigger>
        <Trigger Property="IsMouseOver" Value="True">
            <Trigger.EnterActions>
                <BeginStoryboard Storyboard="{StaticResource Storyboard1}"/>
            </Trigger.EnterActions>
            <Trigger.ExitActions>
                <BeginStoryboard x:Name="Storyboard2_BeginStoryboard" Storyboard="{StaticResource Storyboard2}"/>
            </Trigger.ExitActions>
        </Trigger>
        <Trigger Property="IsPressed" Value="True">
            <Setter Property="Opacity" TargetName="Shine" Value="0.4"/>
            <Setter Property="Background" TargetName="InnerBorder" Value="#CC000000"/>
        </Trigger>
    </ControlTemplate.Triggers>
</ControlTemplate>

这是执行此操作的正确方法,还是有更好的方法?对 WPF 和 XAML 来说还是相当新的,所以还有很多学习要做。

4

4 回答 4

2

您需要继承 Button 并添加这两个属性,或者将这两个属性添加为附加属性(通过创建一个具有两个附加依赖项属性的新类)。

于 2009-02-11T12:44:56.390 回答
2

我最近不得不做类似的事情。事实证明,您可以搭载已在控件上定义的其他属性。因此,如果您的新模板不使用TemplateBindings 表示,Foreground那么Background您可以在其中粘贴您的开始/停止发光颜色。所有控件上的Tag属性通常都是空的。

值得研究这些选项作为子类化控件的替代方法。在控件模板只有一个自定义参数的情况下,重用现有属性通常很简单,也很自然。

于 2009-02-18T08:33:33.720 回答
0

据我了解您希望将模板中的发光颜色绑定到控件上的发光属性的问题。你可以这样做:

<GradientStop x:Name="GlowStartColor" Color="{TemplateBinding GlowStartColor}" Offset="0"/>
<GradientStop x:Name="GlowEndColor" Color="{TemplateBinding GlowEndColor}" Offset="1"/>
于 2009-02-10T08:56:50.383 回答
0

我也无法使上述工作正常。虽然我认为它在正确的轨道上。我只是想在定义按钮时能够设置发光属性。唯一的另一种方法是对按钮进行自定义控件,但只是添加一些额外的属性似乎有点过分。

于 2009-02-10T11:45:55.743 回答