VisualTransition クラス

リファレンス

定義

名前空間:: Microsoft.UI.Xaml

重要

一部の情報は、リリース前に大きく変更される可能性があるプレリリースされた製品に関するものです。 Microsoft は、ここに記載されている情報について、明示または黙示を問わず、一切保証しません。

編集

コントロールが視覚的な状態から別の状態に遷移したときに発生する視覚的な動作を表します。

/// [Microsoft.UI.Xaml.Markup.ContentProperty(Name="Storyboard")]
/// [Windows.Foundation.Metadata.ContractVersion(Microsoft.UI.Xaml.WinUIContract, 65536)]
/// [Windows.Foundation.Metadata.MarshalingBehavior(Windows.Foundation.Metadata.MarshalingType.Agile)]
/// [Windows.Foundation.Metadata.Threading(Windows.Foundation.Metadata.ThreadingModel.Both)]
class VisualTransition : DependencyObject

[Microsoft.UI.Xaml.Markup.ContentProperty(Name="Storyboard")]
[Windows.Foundation.Metadata.ContractVersion(typeof(Microsoft.UI.Xaml.WinUIContract), 65536)]
[Windows.Foundation.Metadata.MarshalingBehavior(Windows.Foundation.Metadata.MarshalingType.Agile)]
[Windows.Foundation.Metadata.Threading(Windows.Foundation.Metadata.ThreadingModel.Both)]
public class VisualTransition : DependencyObject

Public Class VisualTransition
Inherits DependencyObject

<VisualStateGroup>
  <!--one or more Visual State elements in the implicit States collection property -->
  <VisualStateGroup.Transitions>
    <VisualTransition>
      singleStoryboard
    </VisualTransition>
    <!--more transitions as above-->
  </VisualStateGroup.Transitions>
</VisualStateGroup>

継承: Object IInspectable DependencyObject VisualTransition

属性: ContentPropertyAttribute ContractVersionAttribute MarshalingBehaviorAttribute ThreadingAttribute

例

次の使用例は、VisualTransition を作成し、ユーザーがマウスをコントロールから離すと、コントロールの境界線が青、黄色、1.5 秒で黒に変わります。

<!--Take one and a half seconds to transition from the
    PointerOver state to the Normal state. 
    Have the SolidColorBrush, BorderBrush, fade to blue, 
    then to yellow, and then to black in that time.-->
<VisualTransition From="PointerOver" To="Normal" 
                      GeneratedDuration="0:0:1.5">
  <Storyboard>
    <ColorAnimationUsingKeyFrames
      Storyboard.TargetProperty="Color"
      Storyboard.TargetName="BorderBrush"
      FillBehavior="HoldEnd" >

      <ColorAnimationUsingKeyFrames.KeyFrames>

        <LinearColorKeyFrame Value="Blue" 
                             KeyTime="0:0:0.5" />
        <LinearColorKeyFrame Value="Yellow" 
                             KeyTime="0:0:1" />
        <LinearColorKeyFrame Value="Black" 
                             KeyTime="0:0:1.5" />

      </ColorAnimationUsingKeyFrames.KeyFrames>
    </ColorAnimationUsingKeyFrames>
  </Storyboard>
</VisualTransition>

<VisualStateGroup x:Name="CommonStates">

  <!--Define the VisualTransitions that can be used when the control
      transitions between VisualStates that are defined in the
      VisualStatGroup.-->
  <VisualStateGroup.Transitions>

    <!--Take one hundredth of a second to transition to the
        Pressed state.-->
    <VisualTransition To="Pressed" 
                          GeneratedDuration="0:0:0.01" />
    
    <!--Take one half second to transition to the PointerOver state.-->
    <VisualTransition To="PointerOver" 
                          GeneratedDuration="0:0:0.5" />

    <!--Take one hundredth of a second to transition from the
        Pressed state to the PointerOver state.-->
    <VisualTransition From="Pressed" To="PointerOver" 
                          GeneratedDuration="0:0:0.01" />

    <!--Take one and a half seconds to transition from the
        PointerOver state to the Normal state. 
        Have the SolidColorBrush, BorderBrush, fade to blue, 
        then to yellow, and then to black in that time.-->
    <VisualTransition From="PointerOver" To="Normal" 
                          GeneratedDuration="0:0:1.5">
      <Storyboard>
        <ColorAnimationUsingKeyFrames
          Storyboard.TargetProperty="Color"
          Storyboard.TargetName="BorderBrush"
          FillBehavior="HoldEnd" >

          <ColorAnimationUsingKeyFrames.KeyFrames>

            <LinearColorKeyFrame Value="Blue" 
                               KeyTime="0:0:0.5" />
            <LinearColorKeyFrame Value="Yellow" 
                               KeyTime="0:0:1" />
            <LinearColorKeyFrame Value="Black" 
                               KeyTime="0:0:1.5" />

          </ColorAnimationUsingKeyFrames.KeyFrames>
        </ColorAnimationUsingKeyFrames>
      </Storyboard>
    </VisualTransition>
  </VisualStateGroup.Transitions>

  <!--The remainder of the VisualStateGroup is the
      same as the previous example.-->

  <VisualState x:Name="Normal" />

  <VisualState x:Name="PointerOver">
    <Storyboard>
      <ColorAnimation Storyboard.TargetName="BorderBrush" 
                    Storyboard.TargetProperty="Color" To="Red" />

    </Storyboard>
  </VisualState>

  <VisualState x:Name="Pressed">
    <Storyboard >
      <ColorAnimation Storyboard.TargetName="BorderBrush" 
                    Storyboard.TargetProperty="Color" To="Transparent"/>
    </Storyboard>
  </VisualState>

  <!--The Disabled state is omitted for brevity.-->

</VisualStateGroup>

注釈

VisualTransitionは、ストーリーボードを開始する動作です。このストーリーボードは、2 つのビジュアル状態間で切り替わるアニメーションが実行される期間を宣言するタイムラインです。遷移は、コントロールの一連のビジュアル状態によって定義される開始状態 ( From 状態) と終了状態 ( To 状態) の組み合わせごとに異なる方法で定義できます。遷移は VisualStateGroup の Transitions プロパティによって定義され、通常は XAML で定義されます。ほとんどの既定のコントロールテンプレートでは遷移は定義されません。この場合、状態間の遷移は瞬時に行われます。テンプレートに対する古い状態の変更が削除され、新しい状態の変更が適用されます。

は VisualTransition 、1 つまたは 2 つの名前付きビジュアル状態を参照します。 From 値は、現在の状態である状態の名前を参照します。 To 値は、GoToState 呼び出しによって要求された新しい状態である状態の名前を参照します。これらの名前は、同じ VisualStateGroup 内の定義の一部として VisualState に適用される x:Name 属性の文字列値から取得されます。 From または To は、有効な VisualTransition に必要な値です。これらの値のいずれかが不足しているか、既存の状態と一致しない値を使用する VisualTransition では何も行われません。

では VisualTransition 、 From 状態、 To 状態、または From 状態と To 状態の両方を参照できます。 [開始] または [To] を省略すると、任意の状態に相当します。 VisualStateManager では、ビジュアル状態が変化するたびに遷移を適用する優先順位ロジックが使用されます。

特に古い状態を VisualTransitionFrom として参照し、新しい状態を To として参照するが存在する場合は、その遷移を使用します。
それ以外の場合は、特に新しい状態を To として参照し、From を指定しないが存在する場合VisualTransitionは、その遷移を使用します。
最後に、古い状態を VisualTransition 特に From として参照し、 To を指定しないが存在する場合は、その遷移を使用します。

上記のいずれも適用されない場合、遷移は実行されません。

GoToState を呼び出してコントロールの表示状態を変更すると、VisualStateManager は次のアクションを実行します。

新しく要求されたビジュアル状態の前にコントロールが使用していた VisualState にストーリーボードがある場合、そのストーリーボードは停止します。
これらのアクションの間で、2 つのビジュアル状態を含む遷移が存在し、GoToState によって要求された名前付きビジュアル状態が有効であり、新しい状態である場合、実行のストーリーボードVisualTransition。
によって名前付けされた stateNameVisualState にストーリーボードがある場合は、ストーリーボードが開始されます。

にはVisualTransition、ストーリーボード値、GeneratedDuration 値、またはその両方を指定できます。ただし、 VisualTransition に値も値もないStoryboardGeneratedDuration場合、VisualTransitionFrom 値と To 値によって名前が付けられた状態が状態の変更に関係している場合でも、アニメーションの観点からは何も行いません。

暗黙の移行

GeneratedDuration を含むが、特定の依存関係プロパティが対象とアニメーション化されないように定義VisualTransitionできます。これにより、暗黙的な遷移が作成されます。 From または To のいずれかのビジュアル状態でアニメーションを対象としているため、状態の変化に応じて異なる値を持つ依存関係プロパティは、生成された遷移アニメーションを使用します。この生成されたアニメーションは、補間を使用して、このようなプロパティの From 状態値と To 状態値の間で遷移します。暗黙的な切り替えアニメーションは、 GeneratedDuration によって示された時間の間続きます。

暗黙的な遷移は、 Double、 Color 、または Point の値であるプロパティにのみ適用されます。つまり、DoubleAnimation、PointAnimation、ColorAnimation を使用して暗黙的にアニメーション化するには、プロパティを使用できる必要があります。他の値 ( ObjectAnimationUsingKeyFrames を必要とする値など) に切り替えアニメーションを作成する場合は、そのアニメーションをストーリーボードに配置し、アニメーションに実行する期間を指定します。

既定では、暗黙的な遷移アニメーションは線形補間を使用して GeneratedDuration を介して値をアニメーション化します。 GeneratedEasingFunctionGeneratedDuration とをに設定することで、線形補間を任意の補間動作にVisualTransition変更できます。

画面切り替えアニメーション

C++ または C# を使用してアプリの視覚的な画面切り替えを表示するためのもう 1 つの設計パターンと API があります。この概念は 切り替えアニメーション と呼ばれ、動作を実装するクラスは テーマの切り替え または テーマアニメーションです。同じコントロールのビジュアル状態間の遷移を宣言し、ビジュアル状態と同様にコントロールパーツのプロパティに変更を適用するのではなく、遷移アニメーションは、完全な UI 要素とアプリと UI 全体の関係の変化を表します。たとえば、レイアウトコンテナーの UI 座標空間で UI 要素が移動されるたびに適用できる、RepositionThemeTransition があります。画面切り替えアニメーションの多くは、ユーザーアクションによって開始されます。切り替えアニメーションは、VisualStateGroup ではなく、UIElement および特定の派生クラスのさまざまな Transition プロパティに適用されます。画面切り替えアニメーションとテーマアニメーションは、多くの場合、コントロールの既定の動作に組み込まれています。

コンストラクター

VisualTransition()

VisualTransition クラスの新しいインスタンスを初期化します。

プロパティ

Dispatcher	常に Windows アプリ SDK アプリでを返します`null`。代わりに DispatcherQueue を使用してください。 (継承元 DependencyObject)
DispatcherQueue	このオブジェクトが `DispatcherQueue` 関連付けられているを取得します。は `DispatcherQueue` 、コードが UI 以外のスレッドによって開始された場合でも、UI スレッド上のにアクセス `DependencyObject` できる機能を表します。 (継承元 DependencyObject)
From	移行元の VisualState の名前を取得または設定します。
GeneratedDuration	ある状態から別の状態に移動するのにかかる時間と、遷移動作の一部として暗黙的な遷移アニメーションを実行する必要がある時間を取得または設定します。
GeneratedEasingFunction	生成されたアニメーションに適用されるイージング関数を取得または設定します。
Storyboard	遷移が発生したときに実行されるストーリーボードを取得または設定します。
To	移行先の VisualState の名前を取得または設定します。

メソッド

ClearValue(DependencyProperty)	依存関係プロパティのローカル値をクリアします。 (継承元 DependencyObject)
GetAnimationBaseValue(DependencyProperty)	依存関係プロパティに対して確立された基本値を返します。これは、アニメーションがアクティブでない場合に適用されます。 (継承元 DependencyObject)
GetValue(DependencyProperty)	DependencyObject から依存関係プロパティの現在の有効な値を返します。 (継承元 DependencyObject)
ReadLocalValue(DependencyProperty)	ローカル値が設定されている場合は、依存関係プロパティのローカル値を返します。 (継承元 DependencyObject)
RegisterPropertyChangedCallback(DependencyProperty, DependencyPropertyChangedCallback)	この DependencyObject インスタンスの特定の DependencyProperty に対する変更をリッスンするための通知関数を登録します。 (継承元 DependencyObject)
SetValue(DependencyProperty, Object)	DependencyObject の依存関係プロパティのローカル値を設定します。 (継承元 DependencyObject)
UnregisterPropertyChangedCallback(DependencyProperty, Int64)	RegisterPropertyChangedCallback を呼び出して以前に登録した変更通知を取り消します。 (継承元 DependencyObject)

適用対象