Mettre à jour une conception et propager les modifications

Restez organisé à l'aide des collections Enregistrez et classez les contenus selon vos préférences.

Dans cette section, vous allez apprendre à modifier un composant dans Figma (ici, la mise en forme du texte) et à voir les modifications se propager au codebase dans Android Studio, en s'appuyant sur votre projet précédent.

Modifications apportées à Figma

Faisons une mise à jour dans le composant Figma. Retournez dans votre fichier Figma :

1. Sélectionnez la couche de texte Title (Titre). Dans la section Texte, définissez le style sur Gras.

   

Enregistrer la version nommée

Intégrez maintenant le composant mis à jour dans votre codebase. Pour vous assurer que les développeurs utilisent la nouvelle version de votre composant, répétez la procédure d'enregistrement d'une version.

1. Ouvrez le plug-in Figma Relay s'il n'est pas déjà ouvert.

2. Cliquez sur Partager avec le développeur.

   

3. Sur l'écran Partager avec le développeur, vous pouvez saisir un nouveau nom et une nouvelle description pour la version dans la section Enregistrer l'historique des versions.

   

4. Appuyez sur les touches CMD-L sur un Mac ou CTRL+L sous Windows pour copier le nouveau lien dans le presse-papiers.

Mettre à jour le code du composant

Réimportons le composant :

1. Dans Android Studio, assurez-vous que la fenêtre d'outil Projet se trouve dans la vue Android. Ensuite, effectuez un clic droit sur app/ui-packages/hello_card/, puis sélectionnez Mettre à jour le package UI.

   

   Attendez la fin du chargement dans la barre en bas à droite :

   

2. Cliquez sur pour créer votre projet. Le composant mis à jour s'affiche dans l'aperçu de app/java/com/example/hellofigma/MainActivity.kt. Notez que le texte est désormais en gras.

   

   

3. Exécutez l'application pour afficher les mêmes mises à jour dans l'émulateur.

   

   

Étape suivante

Maintenant que nous avons mis à jour une conception et vu la mise à jour du code ainsi obtenue, nous pouvons nous concentrer sur l'annotation de notre conception avec des paramètres de contenu permettant des données variables dans nos composants.