wpf:将样式 DataTrigger 更改为 ControlTemplate DataTrigger
本文关键字:DataTrigger ControlTemplate wpf 样式 | 更新日期: 2023-09-27 18:37:08
我有一个用于切换按钮的大型控件模板。我正在尝试添加一个没有成功的数据触发器。
但是,我已设法使用样式添加它,如下所示:
<Window.Resources>
<Style x:Key="toggleBtnStyle" TargetType="{x:Type ToggleButton}">
<Style.Triggers>
<DataTrigger Binding="{Binding Path=myProperty}" Value="true">
<Setter Property="Content" Value="IS TRUE"/>
</DataTrigger>
<DataTrigger Binding="{Binding Path=myProperty}" Value="false">
<Setter Property="Content" Value="IS FALSE"/>
</DataTrigger>
</Style.Triggers>
</Style>
</Window.Resources>
<ToggleButton Height="34" HorizontalAlignment="Left" x:Name="toggleBroadcast" Click="Button_Click" VerticalAlignment="Top" Width="133" Margin="180,0,0,0" Style="{DynamicResource toggleBtnStyle}"/>
有没有办法将其添加到控件模板中?我有以下控件模板,该模板在切换按钮的 IsChecked 属性上触发,我正在尝试将其更改为上述样式中的数据触发器,但没有成功。
<ControlTemplate x:Key="ClipBoardButton1" TargetType="{x:Type ToggleButton}">
<Border BorderThickness="1,1,1,1" CornerRadius="1,1,1,1" BorderBrush="Black" Background="Black" >
<Grid>
<Border x:Name="BorderUp" BorderThickness="1,1,1,1" CornerRadius="1,1,1,1" Background="Blue"/>
<Border x:Name="BorderDown" BorderThickness="1,1,1,1" CornerRadius="1,1,1,1" Opacity="0" Background="Aqua"/>
<ContentPresenter x:Name="Contents" HorizontalAlignment="Center" VerticalAlignment="Center" Width="Auto" Margin="0,0,0,0"/>
</Grid>
</Border>
<ControlTemplate.Resources>
<Storyboard x:Key="ButtonDownTimeLine">
<DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="BorderDown" Storyboard.TargetProperty="Opacity">
<SplineDoubleKeyFrame KeyTime="00:00:00.05" Value="1"/>
</DoubleAnimationUsingKeyFrames>
<ThicknessAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="Contents" Storyboard.TargetProperty="Margin">
<SplineThicknessKeyFrame KeyTime="00:00:00.025" Value="0.5,0.5,0,0"/>
</ThicknessAnimationUsingKeyFrames>
</Storyboard>
<Storyboard x:Key="ButtonUpTimeLine">
<DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="BorderDown" Storyboard.TargetProperty="Opacity">
<SplineDoubleKeyFrame KeyTime="00:00:00.25" Value="0"/>
</DoubleAnimationUsingKeyFrames>
<ThicknessAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="Contents" Storyboard.TargetProperty="Margin">
<SplineThicknessKeyFrame KeyTime="00:00:00.25" Value="0,0,0,0"/>
</ThicknessAnimationUsingKeyFrames>
</Storyboard>
</ControlTemplate.Resources>
<ControlTemplate.Triggers>
<Trigger Property="IsChecked" Value="True">
<Trigger.EnterActions>
<BeginStoryboard Storyboard="{StaticResource ButtonDownTimeLine}"/>
</Trigger.EnterActions>
<Trigger.ExitActions>
<BeginStoryboard Storyboard="{StaticResource ButtonUpTimeLine}"/>
</Trigger.ExitActions>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
需要明确的是:
- 我想在 myProperty 上使用 DataTrigger
- 具有与当前 IsCheck 操作相同的触发器操作。(实现情节提要)
我尝试了很多不同的东西,搜索了很多帖子,但找不到我正在寻找的答案。
谁能告诉我我需要做什么?
我
猜,您正在使用一种样式将此Template
应用于ToggleButton
。如果没有,请为 ToggleButton
创建默认样式,并将Template
属性设置为ControlTemplate
<Style TargetType="ToggleButton">
<Setter Property="Template" Value="{StaticResource ClipBoardButton1}" />
</Style>
而且,谈到您使用 DataTrigger 的问题,我不会在 ControlTemplate
中添加DataTriggers
,因为,考虑这种情况,当您想在属性名称不同(不是myProperty
)的不同位置使用相同的模板时会发生什么?
要实现您正在尝试的操作,您可以将ControlTemplate
中的Trigger
更新为以下内容:
<Trigger Property="IsChecked" Value="True">
<Setter Property="Content" Value="IS TRUE" />
<Trigger.EnterActions>
<BeginStoryboard Storyboard="{StaticResource ButtonDownTimeLine}"/>
</Trigger.EnterActions>
<Trigger.ExitActions>
<BeginStoryboard Storyboard="{StaticResource ButtonUpTimeLine}"/>
</Trigger.ExitActions>
</Trigger>
<Trigger Property="IsChecked" Value="False">
<Setter Property="Content" Value="IS FALSE"></Setter>
</Trigger>
并将ToggleButton
的IsChecked
属性绑定到您的myProperty
<ToggleButton Height="34" HorizontalAlignment="Left"
x:Name="toggleBroadcast"
Click="Button_Click"
VerticalAlignment="Top"
Width="133" Margin="180,0,0,0"
IsChecked="{Binding myProperty}"/>
更新
将ControlTemplate
中的触发器替换为:
<DataTrigger Binding="{Binding myProperty}" Value="True">
<DataTrigger.EnterActions>
<BeginStoryboard Storyboard="{StaticResource ButtonDownTimeLine}"/>
</DataTrigger.EnterActions>
<DataTrigger.ExitActions>
<BeginStoryboard Storyboard="{StaticResource ButtonUpTimeLine}"/>
</DataTrigger.ExitActions>
</DataTrigger>
可以在样式中使用控件模板。 如下所示。我希望这有帮助
<Window.Resources>
<Style x:Key="toggleBtnStyle" TargetType="{x:Type ToggleButton}">
<Style.Triggers>
<DataTrigger Binding="{Binding Path=myProperty}" Value="true">
<Setter Property="Content" Value="IS TRUE"/>
</DataTrigger>
<DataTrigger Binding="{Binding Path=myProperty}" Value="false">
<Setter Property="Content" Value="IS FALSE"/>
</DataTrigger>
</Style.Triggers>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type ToggleButton}">
<Border BorderThickness="1,1,1,1" CornerRadius="1,1,1,1" BorderBrush="Black" Background="Black" >
<Grid>
<Border x:Name="BorderUp" BorderThickness="1,1,1,1" CornerRadius="1,1,1,1" Background="Blue"/>
<Border x:Name="BorderDown" BorderThickness="1,1,1,1" CornerRadius="1,1,1,1" Opacity="0" Background="Aqua"/>
<ContentPresenter x:Name="Contents" HorizontalAlignment="Center" VerticalAlignment="Center" Width="Auto" Margin="0,0,0,0"/>
</Grid>
</Border>
<ControlTemplate.Resources>
<Storyboard x:Key="ButtonDownTimeLine">
<DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="BorderDown" Storyboard.TargetProperty="Opacity">
<SplineDoubleKeyFrame KeyTime="00:00:00.05" Value="1"/>
</DoubleAnimationUsingKeyFrames>
<ThicknessAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="Contents" Storyboard.TargetProperty="Margin">
<SplineThicknessKeyFrame KeyTime="00:00:00.025" Value="0.5,0.5,0,0"/>
</ThicknessAnimationUsingKeyFrames>
</Storyboard>
<Storyboard x:Key="ButtonUpTimeLine">
<DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="BorderDown" Storyboard.TargetProperty="Opacity">
<SplineDoubleKeyFrame KeyTime="00:00:00.25" Value="0"/>
</DoubleAnimationUsingKeyFrames>
<ThicknessAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="Contents" Storyboard.TargetProperty="Margin">
<SplineThicknessKeyFrame KeyTime="00:00:00.25" Value="0,0,0,0"/>
</ThicknessAnimationUsingKeyFrames>
</Storyboard>
</ControlTemplate.Resources>
<ControlTemplate.Triggers>
<Trigger Property="IsChecked" Value="True">
<Trigger.EnterActions>
<BeginStoryboard Storyboard="{StaticResource ButtonDownTimeLine}"/>
</Trigger.EnterActions>
<Trigger.ExitActions>
<BeginStoryboard Storyboard="{StaticResource ButtonUpTimeLine}"/>
</Trigger.ExitActions>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</Window.Resources>