Tempistica e interpolazione
Mentre il movimento è basato sul mondo reale, siamo anche un mezzo digitale, che viene fornito con un'aspettativa di velocità e prestazioni.
Esempi
Se è installata l'app WinUI 2 Gallery, fare clic qui per aprire l'app e vedere il controllo Easing Functions in azione. |
Valori di durata dell'animazione standard
WinUI fornisce un set di durate di animazione standard usate in tutti i controlli della piattaforma. È possibile usare queste risorse denominate anche quando si creano animazioni storyboard personalizzate.
ThemeResource Name | Valore |
---|---|
ControlNormalAnimationDuration | 250ms |
ControlFastAnimationDuration | 167ms |
ControlFasterAnimationDuration | 83 ms |
Interpolazione nel movimento Fluent
L'interpolazione è un modo per manipolare la velocità di un oggetto mentre viaggia. È la colla che lega tutte le esperienze di movimento Fluent. Anche se estremo, l'interpolazione usata nel sistema aiuta a unificare l'aspetto fisico degli oggetti che si spostano in tutto il sistema. Questo è un modo per simulare il mondo reale e rendere gli oggetti in movimento sentirsi come appartengono nel loro ambiente.
Applicare l'interpolazione al movimento
Queste interpolazioni ti aiuteranno a ottenere un aspetto più naturale e sono la linea di base usata per il movimento Fluent.
Fast Out, lento in
cubic-bezier(0, 0, 0, 1)
Usare per gli oggetti o l'interfaccia utente che entra nella scena, spostandosi o generando.
Una volta sulla scena, l'oggetto viene incontrato con un'estrema attrito, che rallenta il riposo dell'oggetto. L'impressione risultante è che l'oggetto si è spostato da una lunga distanza ed è entrato a una velocità estrema, o sta tornando rapidamente a uno stato di riposo.
Anche se è preceduto da un momento di inattività, la velocità dell'oggetto in ingresso ha l'effetto di sentirsi veloce e reattivo.
Rallenta, entra velocemente
cubic-bezier(1 , 0 , 1 , 1)
Usare per l'interfaccia utente o gli oggetti che escono dalla scena.
Gli oggetti diventano alimentato e guadagnano slancio fino a raggiungere la velocità di fuga. L'impressione risultante è che l'oggetto sta tentando di uscire dal modo dell'utente e di liberare spazio per il nuovo contenuto.