Skip to content

VisualStateManager

L edited this page Dec 31, 2017 · 3 revisions

管理控件状态和管理控件状态的转换逻辑

<Window.Resources><Style TargetType="Button" x:Key="AnimatedStyle" ><Setter Property="Template"><Setter.Value><ControlTemplate TargetType="Button"><!--Define our button's border. Note that
the text color is inherited by child elements, that is we give it a name, so we can target it with the animation --><Border BorderBrush="Black" BorderThickness="1"CornerRadius="2" TextBlock.Foreground="WhiteSmoke"Name="theBorder"><Grid><Grid.RowDefinitions><RowDefinition/><RowDefinition/></Grid.RowDefinitions><!--To match the appearance of a typical button, we use two rectangles --><Rectangle Name="topBackground"Fill="DarkGray"/><Rectangle Grid.Row="1"Name="bottomBackground"Fill="Black"/><!--The content presenter shows the button's text --><ContentPresenter Grid.RowSpan="2"VerticalAlignment="Center"HorizontalAlignment="Center"/></Grid><VisualStateManager.VisualStateGroups><VisualStateGroup Name="CommonStates"><!--Hereiswhere we define the disable animation--><!--控件有状态Disabled,Normal等等--><VisualState Name="Disabled"><Storyboard><ColorAnimation Storyboard.TargetName="topBackground"
Storyboard.TargetProperty="(Rectangle.Fill).(Color)"To="White"Duration="0:0:.5"/><ColorAnimation Storyboard.TargetName="bottomBackground"
Storyboard.TargetProperty="(Rectangle.Fill).(Color)"To="WhiteSmoke"Duration="0:0:0.5"/><ColorAnimation Storyboard.TargetName="theBorder"
Storyboard.TargetProperty="(TextBlock.Foreground).(Color)"To="Gray"Duration="0:0:0.5"/></Storyboard></VisualState><!--Hereiswhere the enabled animationisdefined--><VisualState Name="Normal"><Storyboard><ColorAnimation Storyboard.TargetName="topBackground"
Storyboard.TargetProperty="(Rectangle.Fill).Color"To="DarkGray"Duration="0:0:0.5"/><ColorAnimation Storyboard.TargetName="bottomBackground"
Storyboard.TargetProperty="(Rectangle.Fill).(Color)"To="Black"Duration="0:0:0.5"/><ColorAnimation Storyboard.TargetName="theBorder"
Storyboard.TargetProperty="(TextBlock.Foreground).Color"To="WhiteSmoke"Duration="0:0:0.5"/></Storyboard></VisualState></VisualStateGroup></VisualStateManager.VisualStateGroups></Border></ControlTemplate></Setter.Value></Setter></Style></Window.Resources><Grid><Grid.RowDefinitions><RowDefinition Height="*"></RowDefinition><RowDefinition Height="*"></RowDefinition></Grid.RowDefinitions><CheckBox Grid.Row="0"Content="Enable Button"Name="chkEnabled"IsChecked="True"VerticalAlignment="Center"/><!--此处通过IsEnabled来进行DisabledNormal二者的切换--><Button Grid.Row="1"Content="Test Button"Name="btnTest"IsEnabled="{Binding ElementName=chkEnabled,Path=IsChecked}"Style="{StaticResource AnimatedStyle}"Click="ButtonClick"/></Grid>

示例代码

https://github.com/zLulus/NotePractice/tree/dev3/WPF/WpfDemo/VisualStateManager

Clone this wiki locally