首页 > 学院 > 开发设计 > 正文

第15章 动画基础(2)——故事板、触发器

2019-11-10 18:58:06
字体:
来源:转载
供稿:网友

一、故事板

①故事板是增强型的时间线,可用来分组多个动画,而且具有动画播放的能力(暂停、停止以及改变播放位置)。

②一个故事面板中可以放置多个动画,并且每个动画可用于不同的元素和属性。

③故事面板的定义如下:

<Storyboard>    <DoubleAnimation         Storyboard.TargetName="cmdGrow"         Storyboard.TargetPRoperty="Width"        To="250"         Duration="0:0:5">    </DoubleAnimation></Storyboard>二、何处定义触发器可以在以下4个位置定义触发器:

在样式中(Styles.Triggers)在控件模版中(ControlTemplate.Triggers)在数据模版中(DataTemplate.Triggers)直接在元素中定义事件触发器(FrameworkElement.Triggers),仅支持事件触发器。三、直接在元素中定义事件触发器触发器实例

<Button Padding="10" Name="cmdGrow" Height="40" Width="160"        HorizontalAlignment="Center" VerticalAlignment="Center">    <Button.Triggers>        <EventTrigger>            <BeginStoryboard>                <Storyboard>                    <DoubleAnimation                         Storyboard.TargetProperty="Width"                        To="250"                         Duration="0:0:5">                    </DoubleAnimation>                </Storyboard>            </BeginStoryboard>        </EventTrigger>    </Button.Triggers>    <Button.Content>        Click and Make Me Grow    </Button.Content></Button>四、在样式中定义触发器实例

<Window x:Class="Animation.AnimationInStyle"    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"        Title="AnimationInStyle" Height="300" Width="300"    >    <Window.Resources>        <Style x:Key="GrowButtonStyle">            <Style.Triggers>                <Trigger Property="Button.IsPressed" Value="True">                    <Trigger.EnterActions>                        <BeginStoryboard>                            <Storyboard>                                <DoubleAnimation                                     Storyboard.TargetName="cmdGrow"                                     Storyboard.TargetProperty="Width"                                    To="250"                                     Duration="0:0:5">                                </DoubleAnimation>                            </Storyboard>                        </BeginStoryboard>                    </Trigger.EnterActions>                </Trigger>            </Style.Triggers>        </Style>    </Window.Resources>    <Button Padding="10" Name="cmdGrow" Height="40" Width="160" Style="{StaticResource GrowButtonStyle}"            HorizontalAlignment="Center" VerticalAlignment="Center">            Click and Make Me Grow        </Button></Window>


发表评论 共有条评论
用户名: 密码:
验证码: 匿名发表