Como um desenvolvedor Android pode se reinventar para usar o Jetpack Compose

Bruno Martho
Android Dev BR
Published in
5 min readMay 17, 2023
Jetpack Compose official logo

Benjamim Franklin certo dia disse: “Quando você parar de mudar, você está acabado”. Essa frase reflete a grande mudança que o Jetpack Compose trouxe ao desenvolvimento Android.

Um pouco sobre minha carreira de desenvolvedor Android: Comecei em 2012 e até hoje trabalho com Android. Já vi muitas mudanças na tecnologia, na forma de pensar no desenvolvimento dos aplicativos, na IDE (antes do Android Studio usávamos o Eclipse para desenvolvimento Android) e até da linguagem de programação padrão (de JAVA para Kotlin). Até 2022 sempre utilizei o XML para desenvolver a parte visual (sim, por 10 anos) e, querendo ou não, acabei ficando especialista nisso.

Já havia brincado um pouco com o Jetpack Compose mas nunca de fato havia trabalhado profissionalmente. Porém, no meio de 2022, surgiu um requisito novo no meu projeto que trouxe a ideia de fazer uma componentização da parte gráfica, e meu time ficou responsável por isso. Ou seja, criar formulários, botões, carrosséis, toolbars e vários outros componentes, para que todas as telas (e até outros apps) utilizem e mantenham um padrão.

Quando surgiu esse requisito, pensei que seria tranquilo, porque já mexi com componentização utilizando o XML. Porém, tinha um algo a mais: alguns componentes iriam receber uma parte da tela, que poderia ser qualquer coisa, por exemplo, algo assim:

“Um layout de tela qualquer” pode ser literalmente qualquer coisa: Um texto, várias imagens, links, uma imagem grande, uma descrição gigante, ou tudo isso combinado. Enfim, iria da criatividade e necessidade de quem utilizaria o componente.

Eu, pensando sempre com o XML na cabeça, rapidamente decidi criar um componente mais ou menos como esse:

<?xml version = "1.0" encoding = "utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="wrap_content">

<LinearLayout
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:orientation="vertical"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">

<ImageView
android:layout_width="@dimen/images_size"
android:layout_height="@dimen/images_size"
android:layout_gravity="center"
android:src="@drawable/image" />

<TextView
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:gravity="center"
android:text="@string/text"
android:textSize="@dimen/text_size" />
</LinearLayout>

<FrameLayout
android:layout_width="wrap_content"
android:layout_height="match_parent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent">
</FrameLayout>
</androidx.constraintlayout.widget.ConstraintLayout>

Aqui, o FrameLayout poderia fazer um addView() no Kotlin, passando uma View (também XML) que o componente iria receber e deveria funcionar perfeitamente. Mas tinha um algo a mais nesse requisito. Os desenvolvedores das novas telas e dos novos apps iriam utilizar o tão falado Jetpack Compose para desenvolver suas telas, logo o componente não deveria receber uma View e sim um Composable (parte da tela em compose).

Há formas de colocar um Composable no meu FrameLayout, ou mesmo usar um ComposeView dentro do XML, mas como estávamos fazendo do zero, concluímos que seria melhor fazermos todos os componentes usando o Jetpack Compose, e foi aí que começou minha transição para começar a pensar em Compose, e meio que abandonar o XML da minha cabeça, no qual eu havia trabalhado por tanto tempo.

Nessa hora, um dos principais e destrutivos pensamentos de desenvolvedores experientes passou pela minha cabeça: Poxa, trabalho com XML já fazem 10 anos, sou especialista nisso e, do nada, tenho que mudar completamente? Muitos desenvolvedores tem bastante resistência a mudanças, principalmente quando a ideia é abandonar o que você já conhece e partir para algo 100% novo, e na nossa área isso é muito errado.

A resposta é simples: Sim, você tem que mudar! Você deve ter foco na aprendizagem continua porque sempre vão aparecer coisas novas, e você vai ter que aprender, se quiser sobreviver nesse mundo. Prazer, área de desenvolvimento Android! A cada nova versão, novidades que podem fazer você mudar todo seu modo de pensar, não tem jeito. Com isso, encarei o desafio e bora aprender Compose.

No começo é tudo novidade, parecia que eu estava aprendendo uma nova linguagem de programação. O modo de pensar, a sintaxe, a dinâmica, tudo diferente do XML. Porém, com o tempo e muito estudo, fui pegando gosto pela coisa. Quase tudo que eu fazia me vinha a cabeça: mas realmente em XML seria muito mais trabalhoso fazer isso.

Até que chegou a hora de resolver o problema acima e, sério, no Compose é extremamente simples fazer isso. Inclusive, uma das características do Compose é justamente resolver problemas como este. Tudo vai se resumir a uma função bem pequena, que já faz tudo que você precisa, mais ou menos assim:

@Composable
fun Component(
anything : @Composable () -> Unit
) {
Row {
Column {
Image(
painter = painterResource(id = R.drawable.image),
contentDescription = "Image",
modifier = Modifier
.size(40.dp)
.clip(shape = CircleShape),
contentScale = ContentScale.Crop
)
Text(
modifier = Modifier.padding(top = 8.dp),
text = stringResource(id = R.id.text),
)
}

anything()
}
}

Uma das grandes vantagens do Compose é criar funções para receber o chamado slots, que nada mais são do que pedaços de telas Composable. Você pode criar funções que recebem vários slots, e posicioná-los e usá-los como bem quiser dentro do seu layout e, sério, para mim isso é incrível porque em XML dava muito trabalho e sempre surgiam bugs quando você tentava receber uma View qualquer numa função Kotlin e usar no layout.

Mas, resumindo esse artigo, o que eu queria dizer é o seguinte: você, desenvolvedor Android, deveria começar a estudar o Jetpack Compose o quanto antes. Não tenha medo da mudança, vá para cima! Você não vai se arrepender, é super legal (e divertido) utilizá-lo. Além disso, eu acredito firmemente que o XML lentamente vai cair em desuso. O Jetpack Compose, queira ou não queira, vai ser utilizado em todos os projetos novos, e também nos novos módulos dos projetos existentes.

Imagino que será muito parecido de quando foi introduzido o Kotlin no lugar do JAVA. No começo, o Google dava suporte para ambos, porém com o tempo vimos as novas features, bibliotecas e documentações serem desenvolvidas apenas em Kotlin (inclusive o próprio Jetpack Compose). Então, recomendo fortemente a todos os desenvolvedores Android, iniciantes ou experientes, que comecem o quanto antes a se especializarem no Jetpack Compose e abandonarem (com tristeza ou não) o XML.

Fontes que usei para estudo

1- Documentação oficial: Aqui tem tudo, literalmente. Existem tutoriais super legais para você começar. O primeiro que fiz, o famoso Hello World em Compose, foi esse.

2- Alura: Para quem gosta da Alura e está disposto a pagar um pouco pelo conhecimento, existe essa formação muito legal em Jetpack Compose. Eu, particularmente, gostei bastante e me fez entender conceitos mais avançados do Compose, como gerenciamento de estados, sobre os slots, elevação de estado, e como utilizar o Compose na arquitetura recomendada do Android.

3- Udemy: Existem diversos cursos de Compose. Eu realizei os módulos de Compose desse aqui. Achei bem interessante e ele explora bastante features da tecnologia.

E ae, topa o desafio? Bora aprender!

Never Stop Learning!

--

--

Bruno Martho
Android Dev BR

Master Software Engineer | Kotlin and JAVA developer