美文网首页
VisualStateManager

VisualStateManager

作者: Lulus | 来源:发表于2017-12-31 16:51 被阅读0次

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

    <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">
    
                                    <!-- Here is where 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>
    
                                    <!-- Here is where the enabled animation 
                                    is defined -->
                                    <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来进行Disabled,Normal二者的切换-->
        <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

    相关文章

      网友评论

          本文标题:VisualStateManager

          本文链接:https://www.haomeiwen.com/subject/glkagxtx.html