VisualTransition Classe

Riferimento

Definizione

Spazio dei nomi:: Windows.UI.Xaml

Importante

Alcune informazioni sono relative alla release non definitiva del prodotto, che potrebbe subire modifiche significative prima della release definitiva. Microsoft non riconosce alcuna garanzia, espressa o implicita, in merito alle informazioni qui fornite.

Modifica

Rappresenta il comportamento visivo che si verifica quando il controllo passa da uno stato visivo a un altro.

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

[Windows.Foundation.Metadata.ContractVersion(typeof(Windows.Foundation.UniversalApiContract), 65536)]
[Windows.Foundation.Metadata.MarshalingBehavior(Windows.Foundation.Metadata.MarshalingType.Agile)]
[Windows.Foundation.Metadata.Threading(Windows.Foundation.Metadata.ThreadingModel.Both)]
[Windows.UI.Xaml.Markup.ContentProperty(Name="Storyboard")]
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>

Ereditarietà: Object IInspectable DependencyObject VisualTransition

Attributi: ContractVersionAttribute MarshalingBehaviorAttribute ThreadingAttribute ContentPropertyAttribute

Requisiti Windows

Famiglia di dispositivi	Windows 10 (è stato introdotto in 10.0.10240.0)
API contract	Windows.Foundation.UniversalApiContract (è stato introdotto in v1.0)

Esempio

In questo esempio viene creato un oggetto VisualTransition che specifica che quando l'utente sposta il mouse lontano dal controllo, il bordo del controllo cambia in blu, quindi in giallo, quindi nero in 1,5 secondi.

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

Commenti

VisualTransition è un comportamento che avvia un storyboard. Questo Storyboard è una sequenza temporale che dichiara la durata che le animazioni che passano tra due stati visivi verranno eseguite. La transizione può essere definita in modo diverso per ogni combinazione di stato iniziale (stato From ) e fine (stato To ) come definito dal set di stati visivi del controllo. Le transizioni vengono definite dalla proprietà Transizioni di VisualStateGroup e sono in genere definite in XAML. La maggior parte dei modelli di controllo predefiniti non definisce le transizioni e in questo caso le transizioni tra gli stati si verificano immediatamente. Le modifiche dello stato precedente al modello vengono rimosse e vengono applicate le modifiche del nuovo stato.

Un oggetto VisualTransition fa riferimento a uno o due stati visivi denominati. Il valore From fa riferimento al nome di uno stato che è lo stato corrente. Il valore To fa riferimento al nome di uno stato che è il nuovo stato richiesto da una chiamata GoToState . Questi nomi provengono da un valore stringa di attributo x:Name applicato a un oggetto VisualState come parte della relativa definizione nello stesso Oggetto VisualStateGroup. Da o A è un valore obbligatorio per un oggetto VisualTransition efficace, un oggetto VisualTransition che manca di questi valori o usa valori che non corrispondono agli stati esistenti non fa nulla.

Un oggetto VisualTransition può fare riferimento solo a uno stato From , solo uno stato To o da e a . Omettendo From o To equivale a qualsiasi stato. VisualStateManager usa una logica di precedenza per la quale la transizione viene applicata ogni volta che gli stati visivi cambiano:

Se un oggetto VisualTransition esiste che fa riferimento in modo specifico allo stato precedente come From e al nuovo stato di To, usare tale transizione.
In caso contrario, se un oggetto VisualTransition esiste che fa riferimento in modo specifico al nuovo stato a, ma non specifica From, usare tale transizione.
Infine, se un oggetto VisualTransition esiste che fa riferimento in modo specifico allo stato precedente come From ma non specifica To, usare tale transizione. Se nessuna delle versioni precedenti si applica, non viene eseguita alcuna transizione.

Quando si chiama GoToState per modificare lo stato visivo di un controllo, VisualStateManager esegue queste azioni:

Se VisualState usato dal controllo prima dello stato visivo appena richiesto ha uno storyboard, tale storyboard si arresta.
Tra queste azioni, lo storyboard per un oggetto VisualTransition viene eseguito, se esiste una transizione che coinvolge i due stati visivi e lo stato visivo denominato richiesto da GoToState è valido ed è un nuovo stato.
Se VisualState come denominato da stateName ha uno Storyboard, inizia lo storyboard.

Un oggetto VisualTransition può avere un valore Storyboard , un valore GeneratedDuration o entrambi. Tuttavia, se un oggetto VisualTransition non ha un valore Storyboard né un valore GeneratedDuration , visualTransition non fa nulla in termini di animazioni, anche se gli stati denominati dai valori From e To sono coinvolti in una modifica dello stato.

Transizioni implicite

È possibile definire un oggetto VisualTransition in modo che abbia un oggetto GeneratedDuration, ma non disponga di proprietà di dipendenza specifiche destinate e animate. In questo modo viene creata una transizione implicita. Qualsiasi proprietà di dipendenza specifica per l'animazione negli stati visivi From o To e quindi ha valori diversi tra le modifiche dello stato e quindi usa un'animazione di transizione generata. Questa animazione generata passa tra il valore From state e il valore To state di tale proprietà usando l'interpolazione. L'animazione di transizione implicita dura per il tempo indicato da GeneratedDuration.

Le transizioni implicite si applicano solo alle proprietà che sono un valore Double, Color o Point . In altre parole, la proprietà deve essere possibile animare in modo implicito usando doubleAnimation, PointAnimation o ColorAnimation. Se si vuole creare un'animazione di transizione su un altro valore, ad esempio un valore che richiede ObjectAnimationUsingKeyFrames, inserire tale animazione nello Storyboard e assegnare all'animazione una durata che si vuole eseguire.

Per impostazione predefinita, un'animazione di transizione implicita usa l'interpolazione lineare per animare un valore tramite generatedDuration. È possibile modificare l'interpolazione lineare in un comportamento di interpolazione desiderato impostando GeneratedEasingFunction e GeneratedDuration in un oggetto VisualTransition.

Animazioni di transizione

Esiste un altro modello di progettazione e un'API per la visualizzazione delle transizioni visive per un'app UWP usando C++, C#o Visual Basic. Questo concetto è chiamato animazioni di transizione e la classe che implementa il comportamento è una transizionea tema o un'animazione a tema. Anziché dichiarare transizioni tra stati visivi dello stesso controllo e applicare modifiche alle proprietà delle parti di controllo, come gli stati visivi, un'animazione di transizione rappresenta le modifiche nella relazione tra un elemento dell'interfaccia utente completo e l'app e l'interfaccia utente complessiva. Ad esempio, è possibile applicare repositionThemeTransition ogni volta che un elemento dell'interfaccia utente viene spostato nello spazio delle coordinate dell'interfaccia utente del contenitore di layout. Molte delle animazioni di transizione vengono avviate da un'azione utente. Un'animazione di transizione si applica a varie proprietà di transizione di UIElement e a classi derivate specifiche, non a visualStateGroup. Le animazioni di transizione e le animazioni dei temi sono spesso predefinite per il comportamento predefinito di un controllo. Per altre info, vedi Animazioni con storyboard per stati di visualizzazione.

Note per le versioni precedenti

Windows 8.x

Per Windows 8, le transizioni dei temi XAML e vari altri comportamenti animati automatici nella libreria di animazioni non hanno rispettato un'impostazione particolare di Facilità di accesso di Microsoft Windows che consente agli utenti di disattivare "animazioni non necessarie".

A partire da Windows 8.1, transizioni di tema, animazioni tema e transizioni visive rispetta tutte le animazioni non necessarie (quando possibile) in Facilità di accesso. Le animazioni non verranno eseguite e lo stato del controllo cambia o le modifiche visive sono istantanee.

Se si esegue la migrazione del codice dell'app da Windows 8 a Windows 8.1, è possibile testare i comportamenti di animazione con Disattivare tutte le animazioni non necessarie (quando possibile) abilitate. Poiché alcune di queste animazioni sono controllate dagli storyboard e perché a volte si concatenano animazioni personalizzate da avviare dopo la transizione visiva o le animazioni tema sono complete, l'impostazione Disattiva tutte le animazioni non necessarie (quando possibile) potrebbe influire sui tempi delle animazioni. Inoltre, se è stato implementato qualcosa come VisualTransition in uno stato visivo anziché come animazione storyboard, potrebbe essere necessario passare a un'animazione personalizzata vera, in modo che l'impostazione Disattiva tutte le animazioni non necessarie (quando possibile) non la disabilita.

Le app compilate per Windows 8 ma in esecuzione in Windows 8.1 continuano a usare il comportamento di Windows 8 per animazioni tema e transizioni visive. Tuttavia, le transizioni dei temi vengono disabilitate dall'impostazione su Windows 8.1, anche se un'app non viene ricompilata.

Costruttori

VisualTransition()

Inizializza una nuova istanza della classe VisualTransition .

Proprietà

Dispatcher	Ottiene CoreDispatcher associato a questo oggetto. CoreDispatcher rappresenta una struttura che può accedere a DependencyObject nel thread dell'interfaccia utente anche se il codice viene avviato da un thread non interfaccia utente. (Ereditato da DependencyObject)
From	Ottiene o imposta il nome di VisualState da cui eseguire la transizione.
GeneratedDuration	Ottiene o imposta la quantità di tempo necessario per passare da uno stato a un altro e il tempo in cui le animazioni di transizione implicite devono essere eseguite come parte del comportamento di transizione.
GeneratedEasingFunction	Ottiene o imposta la funzione di interpolazione applicata alle animazioni generate.
Storyboard	Ottiene o imposta l'oggetto Storyboard eseguito quando si verifica la transizione.
To	Ottiene o imposta il nome di VisualState su cui passare.

Metodi

ClearValue(DependencyProperty)	Cancella il valore locale di una proprietà di dipendenza. (Ereditato da DependencyObject)
GetAnimationBaseValue(DependencyProperty)	Restituisce qualsiasi valore di base stabilito per una proprietà di dipendenza, che si applica nei casi in cui un'animazione non è attiva. (Ereditato da DependencyObject)
GetValue(DependencyProperty)	Restituisce il valore effettivo corrente di una proprietà di dipendenza da un oggetto DependencyObject. (Ereditato da DependencyObject)
ReadLocalValue(DependencyProperty)	Restituisce il valore locale di una proprietà di dipendenza, se viene impostato un valore locale. (Ereditato da DependencyObject)
RegisterPropertyChangedCallback(DependencyProperty, DependencyPropertyChangedCallback)	Registra una funzione di notifica per l'ascolto delle modifiche a un'istanza di DependencyObject specifica. (Ereditato da DependencyObject)
SetValue(DependencyProperty, Object)	Imposta il valore locale di una proprietà di dipendenza in un oggetto DependencyObject. (Ereditato da DependencyObject)
UnregisterPropertyChangedCallback(DependencyProperty, Int64)	Annulla una notifica di modifica registrata in precedenza chiamando RegisterPropertyChangedCallback. (Ereditato da DependencyObject)

Si applica a

Condividi tramite