VisualTransition Classe
Definição
Importante
Algumas informações se referem a produtos de pré-lançamento que podem ser substancialmente modificados antes do lançamento. A Microsoft não oferece garantias, expressas ou implícitas, das informações aqui fornecidas.
Representa o comportamento visual que ocorre quando o controle faz a transição de um estado visual para outro.
/// [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 : DependencyObjectPublic 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>
- Herança
- Atributos
Exemplos
Este exemplo cria um VisualTransition que especifica que, quando o usuário move o mouse para longe do controle, a borda do controle muda para azul e, em seguida, para amarelo e, em seguida, para preto em 1,5 segundos.
<!--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>
Comentários
Um VisualTransition é um comportamento que inicia um Storyboard. Este Storyboard é um linha do tempo que declara a duração em que as animações que fazem a transição entre dois estados visuais serão executadas. A transição pode ser definida de forma diferente para cada combinação de estado inicial (o estado De ) e o estado final (o estado Para ), conforme definido pelo conjunto de estados visuais do controle. As transições são definidas pela propriedade Transitions de VisualStateGroup e geralmente são definidas em XAML. A maioria dos modelos de controle padrão não define transições e, nesse caso, as transições entre estados ocorrem instantaneamente. As modificações do estado antigo no modelo são removidas e as modificações do novo estado são aplicadas.
Um VisualTransition faz referência a um ou dois estados visuais nomeados. O valor De faz referência ao nome de um estado que é o estado atual. O valor To faz referência ao nome de um estado que é o novo estado solicitado por uma chamada GoToState . Esses nomes vêm de um valor de cadeia de caracteres de atributo x:Name que é aplicado a um VisualState como parte de sua definição no mesmo VisualStateGroup.
From ou To são um valor necessário para um VisualTransition eficaz, um VisualTransition que não tem nenhum desses valores ou usa valores que não correspondem aos estados existentes não faz nada.
Um VisualTransition pode referenciar apenas um estado De , apenas um estado Para ou um estado De e Para . Omitir De ou Para equivale a qualquer estado. O VisualStateManager usa uma lógica de precedência para a qual a transição será aplicada sempre que os estados visuais forem alterados:
- Se existir um
VisualTransitionque referencie especificamente o estado antigo como From e o novo estado como To, use essa transição. - Caso contrário, se existir um
VisualTransitionque referencie especificamente o novo estado como To , mas não especifique From, use essa transição. - Por fim, se existir um
VisualTransitionque referencie especificamente o estado antigo como De , mas não especifique Para, use essa transição.
Se nenhuma das opções acima se aplicar, nenhuma transição será executada.
Quando você chama GoToState para alterar o estado visual de um controle, o VisualStateManager executa estas ações:
- Se o VisualState que o controle estava usando antes do estado visual recém-solicitado tiver um Storyboard, esse storyboard será interrompido.
- Entre essas ações, o Storyboard para uma
VisualTransitionexecução, se houver uma transição que envolva os dois estados visuais e o estado visual nomeado solicitado por GoToState for válido e for um novo estado. - Se o VisualState como nomeado por
stateNametiver um Storyboard, o storyboard começará.
Um VisualTransition pode ter um valor storyboard , um valor GeneratedDuration ou ambos. Mas se um VisualTransition não tiver um Storyboard valor nem um GeneratedDuration valor, isso VisualTransition não fará nada em termos de animações, mesmo se os estados nomeados pelos valores De e Para estiverem envolvidos em uma alteração de estado.
Transições implícitas
Você pode definir um VisualTransition de modo que ele tenha uma GeneratedDuration, mas não tenha nenhuma propriedade de dependência específica sendo direcionada e animada. Isso cria uma transição implícita. Qualquer propriedade de dependência especificamente direcionada para animação nos estados visuais De ou Para e, portanto, tem valores diferentes em toda a alteração de estado, em seguida, usa uma animação de transição gerada. Essa animação gerada faz a transição entre o valor do estado De e o valor de estado Para dessa propriedade usando interpolação. A animação de transição implícita dura o tempo declarado por GeneratedDuration.
Transições implícitas se aplicam apenas a propriedades que são um valor Double, Color ou Point . Em outras palavras, a propriedade deve ser possível animar implicitamente usando um DoubleAnimation, PointAnimation ou ColorAnimation. Se você quiser criar uma animação de transição em algum outro valor, por exemplo, um valor que exija ObjectAnimationUsingKeyFrames, coloque essa animação no Storyboard e dê à animação uma Duração que você deseja que ela execute.
Por padrão, uma animação de transição implícita usa interpolação linear para animar um valor por meio de GeneratedDuration. Você pode alterar a interpolação linear para um comportamento de interpolação de sua escolha definindo GeneratedEasingFunction , bem como GeneratedDuration em um VisualTransition.
Animações de transição
Há outro padrão de design e uma API para exibir transições visuais para aplicativos usando C++ ou C#. Esse conceito é chamado de animações de transição e a classe que implementa o comportamento é uma transição de tema ou uma animação de tema. Em vez de declarar transições entre estados visuais do mesmo controle e aplicar alterações às propriedades de partes de controle como você faz com estados visuais, uma animação de transição representa alterações na relação entre um elemento de interface do usuário completo e o aplicativo e a interface do usuário gerais. Por exemplo, há um RepositionThemeTransition que pode ser aplicado sempre que um elemento de interface do usuário é movido no espaço de coordenadas da interface do usuário de seu contêiner de layout. Muitas das animações de transição são iniciadas por uma ação do usuário. Uma animação de transição se aplica a várias propriedades de Transição de UIElement e classes derivadas específicas, não a um VisualStateGroup. Animações de transição e animações de tema geralmente são internas para o comportamento padrão de um controle.
Construtores
| VisualTransition() |
Inicializa uma nova instância da classe VisualTransition . |
Propriedades
| Dispatcher |
Sempre retorna |
| DispatcherQueue |
Obtém o ao |
| From |
Obtém ou define o nome do VisualState do qual fazer a transição. |
| GeneratedDuration |
Obtém ou define o tempo necessário para mover de um estado para outro e o tempo que qualquer animação de transição implícita deve ser executada como parte do comportamento de transição. |
| GeneratedEasingFunction |
Obtém ou define a função de easing aplicada às animações geradas. |
| Storyboard |
Obtém ou define o Storyboard que é executado quando a transição ocorre. |
| To |
Obtém ou define o nome do VisualState para o qual fazer a transição. |
Métodos
| ClearValue(DependencyProperty) |
Limpa o valor local de uma propriedade de dependência. (Herdado de DependencyObject) |
| GetAnimationBaseValue(DependencyProperty) |
Retorna qualquer valor base estabelecido para uma propriedade de dependência, que se aplicaria nos casos em que uma animação não está ativa. (Herdado de DependencyObject) |
| GetValue(DependencyProperty) |
Retorna o valor efetivo atual de uma propriedade de dependência de um DependencyObject. (Herdado de DependencyObject) |
| ReadLocalValue(DependencyProperty) |
Retorna o valor local de uma propriedade de dependência, se um valor local for definido. (Herdado de DependencyObject) |
| RegisterPropertyChangedCallback(DependencyProperty, DependencyPropertyChangedCallback) |
Registra uma função de notificação para escutar alterações em uma DependencyProperty específica nessa instância dependencyObject . (Herdado de DependencyObject) |
| SetValue(DependencyProperty, Object) |
Define o valor local de uma propriedade de dependência em um DependencyObject. (Herdado de DependencyObject) |
| UnregisterPropertyChangedCallback(DependencyProperty, Int64) |
Cancela uma notificação de alteração que foi registrada anteriormente chamando RegisterPropertyChangedCallback. (Herdado de DependencyObject) |