Desenvolvimento de código iterativo

Como desenvolvedor para dispositivos móveis, você tem o hábito de desenvolver a interface do seu app etapa por etapa e não de uma só vez. O Android Studio usa essa abordagem com o Jetpack Compose, fornecendo ferramentas que não exigem um build completo para inspecionar, modificar valores e verificar o resultado final.

Iteração da interface assistida por IA

Você pode usar o agente de IA no Android Studio para refinar e transformar de forma iterativa a interface do Compose diretamente na visualização de design. Clique com o botão direito do mouse em uma visualização do Compose e selecione uma das seguintes Ações de IA:

• Match UI to target image: selecione para fazer upload de um modelo de design de referência. Em seguida, o agente sugere mudanças de código para que sua implementação corresponda ao design o mais próximo possível.

• Transformar interface: use comandos de linguagem natural (por exemplo, "mude a cor do botão para azul") para descrever modificações específicas que você quer fazer na interface.

Edição em tempo real

A Edição em tempo real é um recurso que permite atualizar elementos combináveis em emuladores e dispositivos físicos em tempo real. Essa funcionalidade minimiza as mudanças de contexto entre a programação de código e o processo de build do app, permitindo que você se concentre na programação por mais tempo, sem interrupções.

A Edição em tempo real tem três modos:

• Manual: as mudanças de código são aplicadas quando são enviadas manualmente usando Control+' (Command+' no macOS).
• Manual ao salvar: as mudanças de código são aplicadas quando são salvas manualmente usando Control+S (Command+S no macOS).
• Automático: as mudanças são aplicadas no dispositivo ou emulador quando você atualiza uma função combinável.

O recurso de Edição em tempo real se concentra em mudanças no código relacionadas a IU e UX. Ele não oferece suporte a mudanças como atualizações de assinatura de método, adição de novos métodos ou mudanças na hierarquia de classes. Para saber mais, consulte a lista de Limitações do recurso Edição em tempo real.

Esse recurso não substitui a criação e execução do app ou o recurso Aplicar mudanças. Em vez disso, ele foi projetado para otimizar o fluxo de trabalho durante a criação, implantação e iteração para desenvolver a interface do Compose.

Confira as práticas recomendadas de fluxo de trabalho:

1. Configure o aplicativo para que ele possa ser executado.
2. Use a Edição em tempo real o máximo possível, até que seja necessário fazer uma mudança sem suporte desse recurso. Por exemplo: adicionar novos métodos enquanto o app estiver em execução.
3. Depois de fazer uma mudança sem suporte, clique em Run para reiniciar o app e retomar a Edição em tempo real.

Como fazer a Edição em tempo real

Siga estas etapas para criar uma atividade vazia do Compose, ativar o recurso Edição em tempo real no projeto e fazer mudanças.

Configurar o novo projeto

1. Antes de começar, confira se você tem o Android Studio Giraffe ou uma versão mais recente instalada e se o nível da API do dispositivo ou emulador físico é de pelo menos 30.

2. Abra o Android Studio e selecione New Project no pop-up Welcome to Android Studio. Se você já tem um projeto aberto, pode criar um novo em File > New > New Project.

3. Escolha o modelo Empty Compose Activity para Phone and Tablet e clique em Next.

   

4. Preencha a caixa de diálogo New Project com as informações necessárias: nome, nome do pacote, local para salvar, SDK mínimo e idioma de configuração do build.

   

5. Clique em Concluir.

Ativar o recurso Edição em tempo real

1. Acesse as configurações para ativar a Edição em tempo real.

   • No Windows ou no Linux, acesse File > Settings > Editor > Live Edit.
   • No macOS, acesse Android Studio > Settings > Editor > Live Edit.

2. Selecione a opção Edição em tempo real e o modo que você quer executar nas configurações.

   No modo manual, as mudanças de código são enviadas sempre que você pressiona Control+' (Command+' no macOS). No modo manual ao salvar, as mudanças de código são aplicadas sempre que você salva manualmente, usando Control+S (Command+S no macOS). No modo automático, as mudanças de código são aplicadas no dispositivo ou emulador conforme você faz as mudanças.

   

3. No editor, abra o arquivo MainActivity, que é o ponto de entrada do app.

4. Clique em Run para implantar o app.

5. Depois de ativar a Edição em tempo real, a marca de seleção verde Up-to-date (atualizado) vai aparecer no canto superior direito da janela de ferramentas Running Devices:

   

Fazer e revisar mudanças

Quando você faz mudanças com suporte no editor, o dispositivo de teste virtual ou físico é atualizado automaticamente.

Por exemplo, edite o método Greeting atual em MainActivity para o seguinte:

@Composable
fun Greeting(name: String) {
    Text(
        text = "Hello $name!",
        Modifier
            .padding(80.dp) // Outer padding; outside background
            .background(color = Color.Cyan) // Solid element background color
            .padding(16.dp) // Inner padding; inside background, around text)
    )
}
IterativeDevelopmentSnippets.kt

As mudanças feitas aparecem instantaneamente no dispositivo de teste, conforme mostrado na Figura 6.

Resolver problemas do recurso Edição em tempo real

Se as mudanças não aparecerem no dispositivo de teste, é possível que o Android Studio não tenha atualizado as edições. Verifique se o indicador "Edição em tempo real" mostra Out Of Date (desatualizado), como na Figura 7, que indica um erro de compilação. Para saber mais sobre o erro e receber sugestões para resolvê-lo, clique no indicador.

Limitações do recurso Edição em tempo real

Veja abaixo uma lista das limitações atuais.

• [Aplicável apenas ao Android Studio Giraffe e versões mais recentes] A Edição em tempo real requer Compose Runtime 1.3.0 ou mais recente. Se o projeto usar uma versão mais antiga do Compose, a Edição em tempo real será desativada.

• [Aplicável apenas ao Android Studio Giraffe e versões mais recentes] A Edição em tempo real requer o AGP 8.1.0-alpha05 ou mais recente. Se o projeto usar uma versão mais antiga do AGP, a Edição em tempo real será desativada.

• A Edição em tempo real requer um dispositivo físico ou emulador com o nível 30 da API ou mais recente.

• A Edição em tempo real só oferece suporte à edição de um corpo de função, ou seja, não é possível mudar o nome ou a assinatura da função, adicionar ou remover uma função ou mudar campos que não sejam de função.

• A Edição em tempo real redefine o estado do app na primeira vez que você muda uma função do Compose em um arquivo. Isso só acontece após a primeira mudança de código. O estado do app não é redefinido por mudanças de código subsequentes feitas nas funções do Compose nesse arquivo.

• As classes modificadas na Edição em tempo real podem ter problemas de performance. Execute o app e use um build de lançamento limpo se estiver avaliando a performance dele.

• Faça uma execução completa para que o depurador funcione nas classes que você modificou com a Edição em tempo real.

• Um app em execução pode falhar quando você usa a Edição em tempo real. Se isso acontecer, você pode reimplantar o app com o botão Run .

• A Edição em tempo real não faz nenhuma manipulação de bytecode definida no arquivo de build do projeto. Por exemplo, as manipulações de bytecode que seriam aplicadas na criação do projeto usando as opções no menu Build ou clicando nos botões Build ou Run.

• As funções não combináveis são atualizadas em tempo real no dispositivo ou emulador, e uma recomposição completa é acionada. A recomposição completa pode não invocar a função atualizada. Para funções não combináveis, é necessário acionar as funções recém-atualizadas ou executar o app novamente.

• A Edição em tempo real não é retomada após a reinicialização do app. Execute o app novamente.

• A Edição em tempo real só oferece suporte a processos depuráveis.

• A Edição em tempo real não oferece suporte a projetos que usam valores personalizados para moduleName em kotlinOptions na configuração do build.

• A Edição em tempo real não funciona com implantações múltiplas. Isso significa que não é possível implantar em um dispositivo e depois em outro. A Edição em tempo real só fica ativa no último conjunto de dispositivos em que o app foi implantado.

• A Edição em tempo real funciona com implantações em vários dispositivos que foram criados com a opção Select multiple devices no menu suspenso do dispositivo de destino. No entanto, ela não tem suporte oficial e pode apresentar problemas. Se você tiver algum problema, informe aqui.

• Implementar mudanças/Aplicar mudanças de código não são compatíveis com a Edição em tempo real e exigem que o app em execução seja reiniciado.

• No momento, a Edição em tempo real não oferece suporte a projetos do Android Automotive.

Perguntas frequentes sobre o recurso Edição em tempo real

• Qual é o status atual da Edição em tempo real?

  A Edição em tempo real está disponível no Android Studio Giraffe. Para ativar esse recurso, acesse File > Settings > Editor > Edição em tempo real (Android Studio > Settings > Editor > Edição em tempo real no macOS).

• Quando posso usar a Edição em tempo real?

  Use a Edição em tempo real quando quiser ver rapidamente o efeito de atualizações de elementos de UX, como atualizações de modificadores e animações, na experiência geral do app.

• Quando devo evitar a Edição em tempo real?

  O recurso de Edição em tempo real se concentra em mudanças no código relacionadas a IU e UX. Ele não oferece suporte a mudanças como atualizações de assinatura de método, adição de novos métodos ou mudanças na hierarquia de classes. Para saber mais, consulte Limitações do recurso Edição em tempo real.

• Quando devo usar a Visualização do Compose?

  Use a Visualização do Compose ao desenvolver elementos combináveis. Ela apresenta os elementos do Compose e é atualizada automaticamente para mostrar o efeito das mudanças de código. A visualização também oferece suporte à exibição de elementos da interface em diferentes configurações e estados, como tema escuro, localidades e tamanho da fonte.

Desenvolvimento de código iterativo com o Compose

A Edição em tempo real e a Recarga instantânea para o Compose Multiplatform são recursos que podem economizar tempo e aumentar sua produtividade ao desenvolver com o Compose. No entanto, eles atendem às necessidades de diferentes tipos de desenvolvimento:

• A Edição em tempo real oferece suporte ao desenvolvimento iterativo com o Jetpack Compose para aplicativos Android. Ela permite atualizar elementos combináveis em emuladores e dispositivos físicos em tempo real. Essa funcionalidade minimiza as mudanças de contexto entre a programação de código e o processo de build do app, permitindo que você se concentre na programação por mais tempo, sem interrupções.

• A Recarga instantânea do Compose atende à mesma necessidade, mas oferece suporte a aplicativos para computador criados com o Compose Multiplatform. Ela permite fazer mudanças no código da interface em um aplicativo do Compose Multiplatform e conferir os resultados em tempo real, recarregando o código de forma inteligente sempre que ele for alterado.

Embora esses dois recursos compartilhem muitas tecnologias no mecanismo do Compose e ofereçam suporte a muitos casos de uso semelhantes, eles não têm os mesmos recursos porque se aplicam a diferentes tipos de desenvolvimento do Compose.

Se você estiver desenvolvendo um app Android, use a Edição em tempo real para acelerar o processo de desenvolvimento. Se você estiver desenvolvendo um aplicativo para computador usando o Compose Multiplatform, use a Recarga instantânea do Compose.

Edição em tempo real de literais (descontinuada)

O Android Studio pode atualizar, em tempo real, literais constantes usados em elementos combináveis nas visualizações, no emulador e no dispositivo físico. Veja alguns tipos compatíveis:

• Int
• String
• Color
• Dp
• Boolean

É possível ativar as decorações de literais no recurso "Edição em tempo real" do indicador de literais da interface para acessar literais constantes que acionam atualizações em tempo real, sem a etapa de compilação:

Apply Changes

Implementar mudanças permite atualizar o código e os recursos sem que seja necessário reimplantar o app em um emulador ou dispositivo físico (com algumas limitações).

Para atualizar sem precisar implantar seu app novamente sempre que você adicionar, modificar ou excluir elementos combináveis, clique no botão Apply Code Changes: