次の方法で共有

VisualState.Storyboard プロパティ

  • リファレンス

定義

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

レイアウトに影響するアニメーションは依存する可能性のあるアニメーションであり、 コントロールが VisualState を読み込むと、コントロールのユーザーにパフォーマンスの影響を与える可能性があります。 詳しくは、「表示状態用にストーリーボードに設定されたアニメーション」をご覧ください。

適用対象

こちらもご覧ください