C# 样式之间的淡入淡出过渡
我有一个label控件，其中我使用转换器根据我的viewmodel上的bool属性IsCheckedOut切换其样式，如下所示：C# 样式之间的淡入淡出过渡,c#,wpf,silverlight,C#,Wpf,Silverlight,我有一个label控件，其中我使用转换器根据我的viewmodel上的bool属性IsCheckedOut切换其样式，如下所示： <UserControl.Resources> <Converters:BooleanStyleConverter x:Key="BooleanStyleConverter " StyleFalse="{StaticResource HeaderLabelStyle}" StyleT
<UserControl.Resources>
<Converters:BooleanStyleConverter
x:Key="BooleanStyleConverter "
StyleFalse="{StaticResource HeaderLabelStyle}"
StyleTrue="{StaticResource HeaderLabelHighlightedStyle}" />
</UserControl.Resources>
<Label Style="{Binding Path=IsCheckedOut,
Converter={StaticResource BooleanStyleConverter}}">
some content here
</Label>
<Style x:Key="HeaderLabelHighlightedStyle" TargetType="{x:Type Label}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="Label">
<Border Background="{StaticResource RedGradient}">
<ContentPresenter />
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<Style x:Key="HeaderLabelHighlightedStyle" TargetType="{x:Type Label}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="Label">
<Border Background="{StaticResource BlueGradient}">
<ContentPresenter />
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
有人知道我怎样才能做到这一点吗 对不起，你做错了 您在解决方案中极具创造性和雄心勃勃，因此可以获得额外的分数。但你已经把众所周知的5公斤重的锤子用图钉钉了下来 在这种情况下，正确的解决方案是使用嵌套在VSM状态中的故事板。 看起来UI基本上有两种状态：一种是某些业务逻辑值为true，另一种是false。请注意，上述区别是100%独立于技术的。在任何技术中，无论您试图实现什么，您的UI都将被视为两种状态 在Silverlight/WPF中，您可以创建VisualStateManager状态，而不是将模拟UI状态的东西拼凑在一起 从技术上讲，它的工作方式如下：
1.您的UserControl将有1个VisualState组，其中有2个VisualState（一个表示true，另一个表示false）。
2.这些VSM状态各代表一个故事板。
3.该情节提要将更改模板或您认为合适的任何其他属性 要了解VSM的基本知识，我强烈建议您在接下来的30分钟内观看以下VSM视频：（在“我该怎么做？”）下
说真的，这些视频在解释VSM方面取得了惊人的成功。与您的困境最相关的一个是“向控件添加状态”，但我建议您查看所有状态
在WPF中，可以从中使用VisualStateManager 对不起，你做错了 您在解决方案中极具创造性和雄心勃勃，因此可以获得额外的分数。但你已经把众所周知的5公斤重的锤子用图钉钉了下来 在这种情况下，正确的解决方案是使用嵌套在VSM状态中的故事板。 看起来UI基本上有两种状态：一种是某些业务逻辑值为true，另一种是false。请注意，上述区别是100%独立于技术的。在任何技术中，无论您试图实现什么，您的UI都将被视为两种状态 在Silverlight/WPF中，您可以创建VisualStateManager状态，而不是将模拟UI状态的东西拼凑在一起 从技术上讲，它的工作方式如下：
1.您的UserControl将有1个VisualState组，其中有2个VisualState（一个表示true，另一个表示false）。
2.这些VSM状态各代表一个故事板。
3.该情节提要将更改模板或您认为合适的任何其他属性 要了解VSM的基本知识，我强烈建议您在接下来的30分钟内观看以下VSM视频：（在“我该怎么做？”）下
说真的，这些视频在解释VSM方面取得了惊人的成功。与您的困境最相关的一个是“向控件添加状态”，但我建议您查看所有状态
在WPF中，可以从中使用VisualStateManager 正如贾斯汀所说，你做错了什么，你可能想后退五步，重新考虑你的方法 但我真的很喜欢这个拼图：）。我在没有VSM的情况下解决了这个问题，只是为了演示WPF的灵活性。这里的基本原则是使用依赖属性值强制。我们跟踪所有样式更改，但在完成过渡动画之前，我们不会让新值从强制（）函数中消失 为了简化测试，只需复制/粘贴以下代码并检查它是否适合您：）。如果你想了解更多细节，请随时提出其他问题 XAML:
<Window x:Class="WpfApplication5.Window1"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:loc="clr-namespace:WpfApplication5"
Title="Fade Styles"
Width="320"
Height="240">
<Window.Resources>
<SolidColorBrush x:Key="RedGradient" Color="Red" />
<SolidColorBrush x:Key="BlueGradient" Color="Blue" />
<Style x:Key="HeaderLabelStyle" TargetType="{x:Type Label}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="Label">
<Border Background="{StaticResource RedGradient}">
<ContentPresenter />
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<Style x:Key="HeaderLabelHighlightedStyle" TargetType="{x:Type Label}">
<Setter Property="Foreground" Value="White" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="Label">
<Border Background="{StaticResource BlueGradient}">
<ContentPresenter />
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<loc:BooleanStyleConverter x:Key="BooleanStyleConverter"
StyleFalse="{StaticResource HeaderLabelStyle}"
StyleTrue="{StaticResource HeaderLabelHighlightedStyle}" />
</Window.Resources>
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="*" />
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<Label Style="{Binding IsChecked, ElementName=chkToggle, Converter={StaticResource BooleanStyleConverter}}"
loc:StyleAnimation.IsActive="True"
Content="Some content here" />
<CheckBox Grid.Row="1" Name="chkToggle" Content="Use Blue" />
</Grid>
</Window>
干杯：）正如贾斯汀所说，你做错了什么，你可能想后退五步，重新考虑你的方法 但我真的很喜欢这个拼图：）。我在没有VSM的情况下解决了这个问题，只是为了演示WPF的灵活性。这里的基本原则是使用依赖属性值强制。我们跟踪所有样式更改，但在完成过渡动画之前，我们不会让新值从强制（）函数中消失 为了简化测试，只需复制/粘贴以下代码并检查它是否适合您：）。如果你想了解更多细节，请随时提出其他问题 XAML:
<Window x:Class="WpfApplication5.Window1"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:loc="clr-namespace:WpfApplication5"
Title="Fade Styles"
Width="320"
Height="240">
<Window.Resources>
<SolidColorBrush x:Key="RedGradient" Color="Red" />
<SolidColorBrush x:Key="BlueGradient" Color="Blue" />
<Style x:Key="HeaderLabelStyle" TargetType="{x:Type Label}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="Label">
<Border Background="{StaticResource RedGradient}">
<ContentPresenter />
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<Style x:Key="HeaderLabelHighlightedStyle" TargetType="{x:Type Label}">
<Setter Property="Foreground" Value="White" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="Label">
<Border Background="{StaticResource BlueGradient}">
<ContentPresenter />
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<loc:BooleanStyleConverter x:Key="BooleanStyleConverter"
StyleFalse="{StaticResource HeaderLabelStyle}"
StyleTrue="{StaticResource HeaderLabelHighlightedStyle}" />
</Window.Resources>
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="*" />
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<Label Style="{Binding IsChecked, ElementName=chkToggle, Converter={StaticResource BooleanStyleConverter}}"
loc:StyleAnimation.IsActive="True"
Content="Some content here" />
<CheckBox Grid.Row="1" Name="chkToggle" Content="Use Blue" />
</Grid>
</Window>
干杯：）我也找到了解决办法，因为我很喜欢你的问题：） 我用渐变上的
彩色动画<Window x:Class="WpfTest___App.DoEvents.Window1"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="Window1" MinHeight="300" MinWidth="300"
Name="Window">
<Grid DataContext="{Binding ElementName=Window}">
<Grid.RowDefinitions>
<RowDefinition Height="*"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<Label Content="Some content here" Grid.Row="0" VerticalAlignment="Stretch" HorizontalAlignment="Stretch">
<Label.Background>
<LinearGradientBrush StartPoint="0,0" EndPoint="0,1">
<GradientStop Color="Blue" Offset="0"/>
<GradientStop Color="LightBlue" Offset="0.4"/>
<GradientStop Color="White" Offset="1"/>
</LinearGradientBrush>
</Label.Background>
<Label.Style>
<Style>
<Style.Triggers>
<DataTrigger Binding="{Binding IsCheckedOut}" Value="True">
<DataTrigger.EnterActions>
<BeginStoryboard>
<Storyboard>
<ColorAnimation Storyboard.TargetProperty="Background.GradientStops[0].Color"
To="Red" Duration="0:0:5"/>
<ColorAnimation Storyboard.TargetProperty="Background.GradientStops[1].Color"
To="Orange" Duration="0:0:5"/>
</Storyboard>
</BeginStoryboard>
</DataTrigger.EnterActions>
<DataTrigger.ExitActions>
<BeginStoryboard>
<Storyboard>
<ColorAnimation Storyboard.TargetProperty="Background.GradientStops[0].Color"
To="Blue" Duration="0:0:5"/>
<ColorAnimation Storyboard.TargetProperty="Background.GradientStops[1].Color"
To="LightBlue" Duration="0:0:5"/>
</Storyboard>
</BeginStoryboard>
</DataTrigger.ExitActions>
</DataTrigger>
</Style.Triggers>
</Style>
</Label.Style>
</Label>
<Button Content="Change IsCheckedOut" Click="Button_Click" Grid.Row="1"/>
</Grid>
这应该也能解决你的问题：）我也找到了解决办法，因为我很喜欢你的问题：） 我用渐变上的
彩色动画<Window x:Class="WpfTest___App.DoEvents.Window1"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="Window1" MinHeight="300" MinWidth="300"
Name="Window">
<Grid DataContext="{Binding ElementName=Window}">
<Grid.RowDefinitions>
<RowDefinition Height="*"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<Label Content="Some content here" Grid.Row="0" VerticalAlignment="Stretch" HorizontalAlignment="Stretch">
<Label.Background>
<LinearGradientBrush StartPoint="0,0" EndPoint="0,1">
<GradientStop Color="Blue" Offset="0"/>
<GradientStop Color="LightBlue" Offset="0.4"/>
<GradientStop Color="White" Offset="1"/>
</LinearGradientBrush>
</Label.Background>
<Label.Style>
<Style>
<Style.Triggers>
<DataTrigger Binding="{Binding IsCheckedOut}" Value="True">
<DataTrigger.EnterActions>
<BeginStoryboard>
<Storyboard>
<ColorAnimation Storyboard.TargetProperty="Background.GradientStops[0].Color"
To="Red" Duration="0:0:5"/>
<ColorAnimation Storyboard.TargetProperty="Background.GradientStops[1].Color"
To="Orange" Duration="0:0:5"/>
</Storyboard>
</BeginStoryboard>
</DataTrigger.EnterActions>
<DataTrigger.ExitActions>
<BeginStoryboard>
<Storyboard>
<ColorAnimation Storyboard.TargetProperty="Background.GradientStops[0].Color"
To="Blue" Duration="0:0:5"/>
<ColorAnimation Storyboard.TargetProperty="Background.GradientStops[1].Color"
To="LightBlue" Duration="0:0:5"/>
</Storyboard>
</BeginStoryboard>
</DataTrigger.ExitActions>
</DataTrigger>
</Style.Triggers>
</Style>
</Label.Style>
</Label>
<Button Content="Change IsCheckedOut" Click="Button_Click" Grid.Row="1"/>
</Grid>
这也可以解决您的问题：）您真的需要样式吗？因为你可以使用带有彩色动画的故事板来改变标签的背景。你真的需要样式吗？因为你可以使用带有彩色动画的故事板来改变标签的背景。这正是我需要的，或者至少是我认为我需要的。然而，贾斯汀让我看到了我真正想做的事情——改变状态——所以我同意他的建议。。非常感谢你的帮助！这正是我需要的，或者至少是我认为我需要的。然而，贾斯汀让我看到了我真正想做的事情——改变状态——所以我同意他的建议。。非常感谢你的帮助
public partial class Window1 : Window
{
public bool IsCheckedOut
{
get { return (bool)GetValue(IsCheckedOutProperty); }
set { SetValue(IsCheckedOutProperty, value); }
}
public static readonly DependencyProperty IsCheckedOutProperty = DependencyProperty.Register("IsCheckedOut", typeof(bool), typeof(Window1), new PropertyMetadata(false));
public Window1()
{
InitializeComponent();
}
private void Button_Click(object sender, RoutedEventArgs e)
{
IsCheckedOut = !IsCheckedOut;
}
}