VisualState.Storyboard 屬性

定義

命名空間:

Windows.UI.Xaml

取得或設定 Storyboard ，定義控制項使用此視覺狀態時的狀態特定屬性值和外觀。

public:
 property Storyboard ^ Storyboard { Storyboard ^ get(); void set(Storyboard ^ value); };

Storyboard Storyboard();

void Storyboard(Storyboard value);

public Storyboard Storyboard { get; set; }

var storyboard = visualState.storyboard;
visualState.storyboard = storyboard;

Public Property Storyboard As Storyboard

<VisualState>
  singleStoryboard
</VisualState>

屬性值

Storyboard

Storyboard，定義當這個VisualState做為目前視覺狀態時要套用至控制項的屬性變更。

範例

此範例會為包含一個Grid的Button建立簡單的ControlTemplate。 具有 「PointerOver」 x：Name 屬性值的VisualState具有分鏡腳本，會在使用者將指標放在 Button 上方時，將按鈕內容 (格線) 從綠色變更為紅色的分鏡腳本。 包含x：Name 屬性值為 「Normal」 的VisualState，因此當使用者將指標移離按鈕時，Grid背景會傳回綠色。

<ControlTemplate TargetType="Button">
  <Grid >
    <VisualStateManager.VisualStateGroups>
      <VisualStateGroup x:Name="CommonStates">

        <VisualStateGroup.Transitions>

          <!--Take one half second to transition to the PointerOver state.-->
          <VisualTransition To="PointerOver" 
                              GeneratedDuration="0:0:0.5"/>
        </VisualStateGroup.Transitions>
        
        <VisualState x:Name="Normal" />

        <!--Change the SolidColorBrush, ButtonBrush, to red when the
            Pointer is over the button.-->
        <VisualState x:Name="PointerOver">
          <Storyboard>
            <ColorAnimation Storyboard.TargetName="ButtonBrush" 
                            Storyboard.TargetProperty="Color" To="Red" />
          </Storyboard>
        </VisualState>
      </VisualStateGroup>
    </VisualStateManager.VisualStateGroups>
    <Grid.Background>
      <SolidColorBrush x:Name="ButtonBrush" Color="Green"/>
    </Grid.Background>
  </Grid>
</ControlTemplate>

備註

Storyboard屬性的值是Null或單一Storyboard物件。 分鏡腳本就像是動畫的容器;它可以包含一或多個動畫定義。 每個這類動畫都可以以特定具名目標的特定相依性屬性為目標。 具名目標必須是控制項範本中定義 Name 或 x：Name 屬性值 的專案。 相依性屬性必須是存在於該物件物件模型或附加屬性中的屬性。 若要以動畫為目標，您可以使用 Storyboard.TargetName 和 Storyboard.TargetProperty 附加屬性。 如需如何使用 XAML 語法定義動畫的詳細資訊，以及您可以使用的動畫類型，請參閱 腳本動畫。

影響版面配置的動畫可能是相依的動畫，當控制項載入 VisualState時，可能會對控制項的使用者造成效能後果。 如需詳細資訊，請參閱視覺狀態的腳本動畫。

另請參閱

• Storyboard
• 腳本動畫
• 視覺狀態的腳本動畫
• 快速入門：控制項範本
• XAML 控制項和應用程式樣式範例