Nesta seção, você vai aprender a mudar um componente no Figma (neste caso, mudar a formatação do texto) e ver as mudanças propagadas para a base de código no Android Studio, com base no projeto anterior.
Mudanças no Figma
Vamos atualizar o componente do Figma. De volta ao arquivo do Figma:
Selecione a camada de texto Title e, na seção Text, mude o estilo para Bold.
Salvar versão nomeada
Agora vamos integrar o componente atualizado à base de código. Para garantir que os desenvolvedores usem a nova versão do componente, crie uma nova versão nomeada:
Acesse File > Save to Version History e insira um título e uma descrição para a nova versão.
Exemplo de título: Hello World Card V2
Exemplo de descrição: estilo do texto adicionado
Atualizar o código do componente
Agora vamos importar o componente novamente:
No Android Studio, verifique se a janela de ferramentas do Project está na visualização Android. Em seguida, clique com o botão direito do mouse em
app/ui-packages/hello_card/e selecione Update UI Package.
Aguarde a barra de carregamento no canto inferior direito terminar:
Clique em
para criar seu projeto e ver o componente atualizado na visualização de
app/java/com/example/hellofigma/MainActivity.kt. O texto agora está em negrito.
Execute o app para ver as mesmas atualizações no emulador.
Próxima etapa
Agora que atualizamos um design e vimos como o código resultante também é atualizado, podemos voltar nossa atenção para a anotação do design com parâmetros de conteúdo que permitam dados variáveis nos componentes.