次の方法で共有

VisualState.Storyboard プロパティ

  • リファレンス

定義

名前空間:
Microsoft.UI.Xaml
編集

このビジュアル状態を使用している場合に、コントロールの状態固有のプロパティ値と外観を定義する ストーリーボード を取得または設定します。

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

この VisualState が現在のビジュアル状態として使用されている場合に、コントロールに適用するプロパティの変更を定義するストーリーボード。

例

次の使用例は、1 つのグリッドを含む Button に対して単純な ControlTemplate を作成します。 x:Name 属性値が "PointerOver" の VisualState には、ユーザーが ポインターを の上Buttonに置いたときにボタン コンテンツ (aGrid) の色を緑から赤に変更するストーリーボードがあります。 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 プロパティの値は、 または 単一Storyboardの オブジェクトですnull。 Storyboardはアニメーションのコンテナーに似ています。1 つ以上のアニメーション定義を含めることができます。 このような各アニメーションは、特定の名前付きターゲットの特定の依存関係プロパティをターゲットにすることができます。 名前付きターゲットは、テンプレート自体で定義された Name または x:Name 属性値 を持つコントロール テンプレート内の要素である必要があります。 依存関係プロパティは、そのオブジェクトのオブジェクト モデルに存在するプロパティ、または添付プロパティである必要があります。 アニメーションをターゲットにするには、 Storyboard.TargetName および Storyboard.TargetProperty 添付プロパティを使用します。 XAML 構文を使用してアニメーションを定義する方法と、使用できるアニメーションの種類の詳細については、「 ストーリーボード化されたアニメーション」を参照してください。

レイアウトに影響を与えるアニメーションは依存する可能性のあるアニメーションであり、コントロールが VisualState を読み込むときに、コントロールのユーザーにパフォーマンスの影響を与える可能性があります。

適用対象

こちらもご覧ください