Freigeben über


VisualTransition Klasse

Definition

Stellt das visuelle Verhalten dar, das auftritt, wenn das Steuerelement von einem visuellen Zustand in einen anderen wechselt.

/// [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>
Vererbung
Object IInspectable DependencyObject VisualTransition
Attribute

Beispiele

In diesem Beispiel wird eine VisualTransition erstellt, die angibt, dass der Rahmen des Steuerelements in blau und dann in gelb und dann in 1,5 Sekunden schwarz geändert wird, wenn der Benutzer die Maus vom Steuerelement weg bewegt.

<!--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>

Hinweise

Ein VisualTransition ist ein Verhalten, das ein Storyboard initiiert. Dieses Storyboard ist eine Zeitleiste, die die Dauer der Ausführung von Animationen deklariert, die zwischen zwei visuellen Zuständen wechseln. Der Übergang kann für jede Kombination aus Startzustand ( Vom-Zustand ) und Endzustand ( An-Zustand ) unterschiedlich definiert werden, wie durch den Satz visueller Zustände ihres Steuerelements definiert. Übergänge werden durch die Transitions-Eigenschaft von VisualStateGroup definiert und in der Regel in XAML definiert. Die meisten Standardsteuerelementvorlagen definieren keine Übergänge, und in diesem Fall erfolgen die Übergänge zwischen Zuständen sofort. Die Änderungen des alten Zustands an der Vorlage werden entfernt, und die Änderungen des neuen Zustands werden angewendet.

Ein VisualTransition verweist entweder auf einen oder zwei benannte visuelle Zustände. Der From-Wert verweist auf den Namen eines Zustands, der dem aktuellen Zustand entspricht. Der To-Wert verweist auf den Namen eines Zustands, der dem neuen Zustand entspricht, der von einem GoToState-Aufruf angefordert wird. Diese Namen stammen aus einem x:Name-Attributzeichenfolgenwert, der als Teil seiner Definition in derselben VisualStateGroup auf einen VisualState angewendet wird. From oderTo sind ein erforderlicher Wert für eine effektive VisualTransition, eine VisualTransition, die keinen dieser Werte enthält oder Werte verwendet, die nicht mit vorhandenen Zuständen übereinstimmen.

Ein VisualTransition kann nur auf einen Von-Zustand , nur auf einen An-Zustand oder auf einen Von - und einen An-Zustand verweisen. Das Auslassen von Von oder To entspricht einem beliebigen Zustand. VisualStateManager verwendet eine Rangfolgenlogik, für die der Übergang angewendet werden soll, wenn sich die visuellen Zustände ändern:

  1. Wenn ein VisualTransition vorhanden ist, der speziell auf den alten Zustand als From und den neuen Zustand als To verweist, verwenden Sie diesen Übergang.
  2. Andernfalls verwenden Sie diesen Übergang, wenn ein VisualTransition vorhanden ist, der speziell auf den neuen Zustand als An verweist, aber nicht Von angibt.
  3. Wenn ein VisualTransition vorhanden ist, der speziell auf den alten Zustand als From verweist, aber nicht An angibt, verwenden Sie diesen Übergang.

Wenn keine der oben genannten Punkte zutrifft, wird kein Übergang ausgeführt.

Wenn Sie GoToState aufrufen, um den visuellen Zustand eines Steuerelements zu ändern, führt VisualStateManager die folgenden Aktionen aus:

  • Wenn der VisualState , den das Steuerelement vor dem neu angeforderten visuellen Zustand verwendet hat, über ein Storyboard verfügt, wird dieses Storyboard beendet.
  • Zwischen diesen Aktionen wird das Storyboard für eine VisualTransition ausgeführt, wenn ein Übergang mit den beiden visuellen Zuständen vorhanden ist und der von GoToState angeforderte benannte visuelle Zustand gültig und ein neuer Zustand ist.
  • Wenn visualState wie benannt von stateName über ein Storyboard verfügt, beginnt das Storyboard.

Ein VisualTransition kann über einen Storyboardwert , einen GeneratedDuration-Wert oder beides verfügen. Wenn ein VisualTransition jedoch weder einen Storyboard Wert noch einen GeneratedDuration Wert hat, bewirkt dies VisualTransition nichts in Bezug auf Animationen, auch wenn Zustände, die von den Werten From und To benannt werden, an einer Zustandsänderung beteiligt sind.

Implizite Übergänge

Sie können eine VisualTransition -Klasse so definieren, dass sie über eine GeneratedDuration verfügt, aber keine spezifischen Abhängigkeitseigenschaften aufweist, die als Ziel verwendet und animiert werden. Dadurch wird ein impliziter Übergang erstellt. Jede Abhängigkeitseigenschaft, die speziell für animationen im visuellen Zustand "From " oder " To " bestimmt ist und daher unterschiedliche Werte für die Zustandsänderung aufweist, verwendet dann eine generierte Übergangsanimation. Diese generierte Animation übergibt zwischen dem Wert from state und dem To state-Wert einer solchen Eigenschaft mithilfe von Interpolation. Die Animation für den impliziten Übergang dauert für den von GeneratedDuration angegebenen Zeitraum.

Implizite Übergänge gelten nur für Eigenschaften, die ein Double-, Color- oder Point-Wert sind. Anders ausgedrückt: Die -Eigenschaft muss implizit mithilfe von DoubleAnimation, PointAnimation oder ColorAnimation animiert werden können. Wenn Sie eine Übergangsanimation für einen anderen Wert erstellen möchten, z. B. für einen Wert, der ObjectAnimationUsingKeyFrames erfordert, fügen Sie diese Animation in das Storyboard ein, und weisen Sie der Animation eine Dauer zu, die ausgeführt werden soll.

Standardmäßig verwendet eine implizite Übergangsanimation eine lineare Interpolation, um einen Wert über die GeneratedDuration zu animieren. Sie können die lineare Interpolation in ein Interpolationsverhalten Ihrer Wahl ändern, indem Sie GeneratedEasingFunction sowie GeneratedDuration auf einer VisualTransitionfestlegen.

Übergangsanimationen

Es gibt ein weiteres Entwurfsmuster und eine API zum Anzeigen visueller Übergänge für Apps mit C++ oder C#. Dieses Konzept wird als Übergangsanimationen bezeichnet, und die Klasse, die das Verhalten implementiert, ist ein Designübergang oder eine Designanimation. Anstatt Übergänge zwischen visuellen Zuständen desselben Steuerelements zu deklarieren und Änderungen auf Eigenschaften von Steuerelementteilen anzuwenden, wie bei visuellen Zuständen, stellt eine Übergangsanimation Änderungen in der Beziehung zwischen einem vollständigen UI-Element und der gesamten App und Ui dar. Beispielsweise gibt es eine RepositionThemeTransition , die angewendet werden kann, wenn ein UI-Element in den Ui-Koordinatenbereich seines Layoutcontainers verschoben wird. Viele der Übergangsanimationen werden von einer Benutzeraktion initiiert. Eine Übergangsanimation gilt für verschiedene Transition-Eigenschaften von UIElement und bestimmte abgeleitete Klassen, nicht für visualStateGroup. Übergangsanimationen und Designanimationen sind häufig in das Standardverhalten eines Steuerelements integriert.

Konstruktoren

VisualTransition()

Initialisiert eine neue instance der VisualTransition-Klasse.

Eigenschaften

Dispatcher

Gibt immer in einer Windows App SDK-App zurücknull. Verwenden Sie stattdessen DispatcherQueue .

(Geerbt von DependencyObject)
DispatcherQueue

Ruft den DispatcherQueue ab, dem dieses Objekt zugeordnet ist. Stellt DispatcherQueue eine Funktion dar, die auf den DependencyObject im UI-Thread zugreifen kann, auch wenn der Code von einem Nicht-UI-Thread initiiert wird.

(Geerbt von DependencyObject)
From

Ruft den Namen des VisualState ab, von dem übergehen soll, oder legt diesen fest.

GeneratedDuration

Ruft die Zeit ab, die benötigt wird, um von einem Zustand in einen anderen zu wechseln, und die Zeit, die implizite Übergangsanimationen als Teil des Übergangsverhaltens ausgeführt werden sollen, oder legt diese fest.

GeneratedEasingFunction

Ruft die Beschleunigungsfunktion ab, die auf die generierten Animationen angewendet wird, oder legt sie fest.

Storyboard

Ruft das Storyboard ab, das beim Übergang ausgeführt wird, oder legt es fest.

To

Ruft den Namen des VisualState-Elements ab, zu dem übergehen soll, oder legt diesen fest.

Methoden

ClearValue(DependencyProperty)

Löscht den lokalen Wert einer Abhängigkeitseigenschaft.

(Geerbt von DependencyObject)
GetAnimationBaseValue(DependencyProperty)

Gibt einen beliebigen Basiswert zurück, der für eine Abhängigkeitseigenschaft eingerichtet wurde, der in Fällen gilt, in denen eine Animation nicht aktiv ist.

(Geerbt von DependencyObject)
GetValue(DependencyProperty)

Gibt den aktuellen effektiven Wert einer Abhängigkeitseigenschaft aus einem DependencyObject zurück.

(Geerbt von DependencyObject)
ReadLocalValue(DependencyProperty)

Gibt den lokalen Wert einer Abhängigkeitseigenschaft zurück, wenn ein lokaler Wert festgelegt ist.

(Geerbt von DependencyObject)
RegisterPropertyChangedCallback(DependencyProperty, DependencyPropertyChangedCallback)

Registriert eine Benachrichtigungsfunktion zum Lauschen auf Änderungen an einer bestimmten DependencyProperty für dieses DependencyObject-instance.

(Geerbt von DependencyObject)
SetValue(DependencyProperty, Object)

Legt den lokalen Wert einer Abhängigkeitseigenschaft für ein DependencyObject fest.

(Geerbt von DependencyObject)
UnregisterPropertyChangedCallback(DependencyProperty, Int64)

Bricht eine Änderungsbenachrichtigung ab, die zuvor durch Aufrufen von RegisterPropertyChangedCallback registriert wurde.

(Geerbt von DependencyObject)

Gilt für:

Weitere Informationen