共用方式為


使用主要畫面格建立字串的動畫

本範例說明如何使用主要畫面格將字串顯示為動畫,本範例的字串是 Button 控制項的 Content 屬性。

範例

下列範例會使用 StringAnimationUsingKeyFrames 類別將 ButtonContent 屬性顯示為動畫。

這個範例的所有主要畫面格都使用 DiscreteStringKeyFrame 類別的執行個體,因為使用主要畫面格建立的字串動畫只能使用不連續的主要畫面格。 不連續的主要畫面格 (例如 DiscreteStringKeyFrame) 會在值之間建立突然的跳躍點,也就是說,動畫的變更快速且明顯。

<!-- Demonstrates the StringAnimationUsingKeyFrames class. A StringAnimationUsingKeyFrames is used to
   animate the TextContent property of a Text element. -->
<Page xmlns="https://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x="https://schemas.microsoft.com/winfx/2006/xaml"
  x:Class="Microsoft.Samples.KeyFrameExamples.StringAnimationUsingKeyFramesExample"
  Name="myRootElement"
  WindowTitle="StringAnimationUsingKeyFrames Example">

  <StackPanel HorizontalAlignment="Center">
    <Button Name="myAnimatedButton" Margin="200"
      FontSize="16pt" FontFamily="Verdana">Some Text
      <Button.Triggers>
        <EventTrigger RoutedEvent="Button.Click">
          <BeginStoryboard>
            <Storyboard>
              <StringAnimationUsingKeyFrames 
                Storyboard.TargetName="myAnimatedButton" Storyboard.TargetProperty="(Button.Content)"
                Duration="0:0:8" FillBehavior="HoldEnd">

                <!-- All the key frames below are DiscreteStringKeyFrames. Discrete key frames create 
                sudden "jumps" between values (no interpolation). Only discrete key frames can be used 
                for String key frame animations. -->
                <DiscreteStringKeyFrame Value="" KeyTime="0:0:0" />
                <DiscreteStringKeyFrame Value="A" KeyTime="0:0:1" />
                <DiscreteStringKeyFrame Value="An" KeyTime="0:0:1.5" />
                <DiscreteStringKeyFrame Value="Ani" KeyTime="0:0:2" />
                <DiscreteStringKeyFrame Value="Anim" KeyTime="0:0:2.5" />
                <DiscreteStringKeyFrame Value="Anima" KeyTime="0:0:3" />
                <DiscreteStringKeyFrame Value="Animat" KeyTime="0:0:3.5" />
                <DiscreteStringKeyFrame Value="Animate" KeyTime="0:0:4" />
                <DiscreteStringKeyFrame Value="Animated" KeyTime="0:0:4.5" />
                <DiscreteStringKeyFrame Value="Animated " KeyTime="0:0:5" />
                <DiscreteStringKeyFrame Value="Animated T" KeyTime="0:0:5.5" />
                <DiscreteStringKeyFrame Value="Animated Te" KeyTime="0:0:6" />
                <DiscreteStringKeyFrame Value="Animated Tex" KeyTime="0:0:6.5" />
                <DiscreteStringKeyFrame Value="Animated Text" KeyTime="0:0:7" />
              </StringAnimationUsingKeyFrames>              
            </Storyboard>
          </BeginStoryboard>
        </EventTrigger> 
      </Button.Triggers>
    </Button>
  </StackPanel>
</Page>

如需完整範例,請參閱 KeyFrame 動畫範例 (英文)。

請參閱

參考

StringAnimationUsingKeyFrames

Content

Button

DiscreteStringKeyFrame

概念

主要畫面格動畫概觀

其他資源

主要畫面格動畫 HOW TO 主題