Android Studio include un editor di visual design per il tipo di layout MotionLayout, che semplifica la creazione e l'anteprima delle animazioni.
L'editor di movimenti offre un'interfaccia semplice per la modifica degli elementi della libreria MotionLayout, che funge da base per l'animazione nelle app per Android. Senza Android Studio, la creazione e la modifica di questi elementi richiede la modifica manuale dei vincoli nei file di risorse XML. L'Editor movimento, tuttavia, può generare questo XML per te, supportando gli stati di inizio e fine, i fotogrammi chiave, le transizioni e le sequenze temporali.
Per iniziare a utilizzare l'editor di movimento:
- Crea un ConstraintLayout.
- Fai clic con il tasto destro del mouse sull'anteprima nell'Editor di layout.
- Fai clic su Converti in MotionLayout, come mostrato di seguito.
Dopo che Android Studio ha convertito il tuo ConstraintLayout in MotionLayout, viene aggiunto anche un file di scene animate (un file .xml con _scene aggiunto al nome del file di layout) alla directory contenente il tuo XML.
L'elemento MotionLayout diventa quindi il layout principale e appare nell'interfaccia utente dell'editor di movimenti. Il layout include già un ConstraintSet iniziale, un ConstraintSet di fine e una transizione dall'inizio alla fine.
Puoi utilizzare l'immagine della panoramica per selezionare un elemento ConstraintSet o
Transition e i componenti nel riquadro di selezione.
Dopodiché puoi modificare i vincoli e gli attributi dell'elemento ConstraintSet iniziale o finale come faresti con una ConstraintLayout.
Se vuoi creare più elementi nel grafico, puoi utilizzare le icone di creazione per aggiungere rapidamente i gesti ConstraintSet, Transition o OnClick/OnSwipe.
Per aggiungere un fotogramma chiave, devi innanzitutto fare clic sulla freccia Transizione:
Quindi, nel riquadro della sequenza temporale Transizione, fai clic nell'angolo in alto a destra e seleziona KeyPosition:
Questa azione apre una finestra di dialogo in cui puoi impostare gli attributi per il fotogramma chiave.
Puoi anche aggiungere i gestori OnClick e OnSwipe alla sezione Transizione nel riquadro degli attributi.
Questa azione apre una finestra di dialogo in cui puoi impostare gli attributi del clic, come i componenti target e la direzione di trascinamento.
L'editor di movimento supporta l'anteprima delle animazioni sulla superficie di progettazione. Quando
è selezionata un'animazione, fai clic su Riproduci
sopra la sequenza temporale per visualizzarne l'anteprima.
