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
L'app Raccolta WinUI 3 include esempi interattivi della maggior parte dei controlli e delle funzionalità di WinUI 3. Scaricare l'app da Microsoft Store od ottenere il codice sorgente su GitHub
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.