Compose Multiplatform para Kotlin: Guia Completo

Bem-vindo ao guia mais completo sobre Compose Multiplatform (CMP) — a tecnologia moderna da JetBrains que permite criar interfaces de usuário nativas para Android, iOS, Desktop (Windows, macOS, Linux) e Web, usando um único código em Kotlin. Neste artigo, vamos abordar tudo: desde a instalação até técnicas avançadas e melhores práticas.

1. O que é e por que usar?

Compose Multiplatform é um framework declarativo para construção de interfaces de usuário, baseado no Jetpack Compose do Google, mas estendido para funcionar em múltiplas plataformas. Diferente de abordagens tradicionais (como XML separado para Android e SwiftUI para iOS), o CMP permite escrever a lógica de UI uma única vez e compilá-la em código nativo para cada plataforma alvo.

Por que usar? Primeiro, redução drástica no tempo de desenvolvimento: em vez de manter duas ou mais bases de código, você trabalha com uma só. Segundo, consistência de UI: a lógica de negócios e a aparência do aplicativo são idênticas em todas as plataformas, simplificando testes e manutenção. Terceiro, acesso a APIs nativas: você pode usar código específico da plataforma (como câmera ou geolocalização) através do mecanismo expect/actual, sem sair do ecossistema Kotlin.

O Compose Multiplatform é ideal para startups, equipes de produto e desenvolvedores que desejam alcançar o máximo de público sem duplicar esforços. A biblioteca é ativamente mantida pela JetBrains e pela comunidade, sendo em 2025 uma das soluções mais promissoras no mundo do desenvolvimento multiplataforma.

2. Instalação

Como o Compose Multiplatform não é uma biblioteca no sentido tradicional (como um pacote pip), mas sim um conjunto de plugins e configurações para Gradle, a instalação é feita através do sistema de build do Kotlin Multiplatform. Veja o passo a passo para criar um novo projeto:

Passo 1: Criar projeto no IntelliJ IDEA (recomendado)

Abra o IntelliJ IDEA (Community ou Ultimate), vá em File → New → Project. No assistente, selecione o template Compose Multiplatform. Dê um nome ao projeto e clique em "Finish". A IDE gerará automaticamente a estrutura e todas as dependências necessárias.

Passo 2: Configuração manual (para projetos existentes)

Adicione o seguinte código ao arquivo build.gradle.kts raiz:

plugins {
    kotlin("multiplatform") version "2.0.21"
    id("org.jetbrains.compose") version "1.7.1"
    id("org.jetbrains.kotlin.plugin.compose") version "2.0.21"
}

kotlin {
    androidTarget()
    listOf(
        iosX64(),
        iosArm64(),
        iosSimulatorArm64()
    ).forEach { iosTarget ->
        iosTarget.binaries.framework {
            baseName = "ComposeApp"
            isStatic = true
        }
    }

    sourceSets {
        val commonMain by getting {
            dependencies {
                implementation(compose.runtime)
                implementation(compose.foundation)
                implementation(compose.material3)
                implementation(compose.ui)
            }
        }
        val androidMain by getting {
            dependencies {
                implementation("androidx.activity:activity-compose:1.9.3")
            }
        }
    }
}

Importante: As versões dos plugins e do Kotlin devem ser compatíveis. As versões atualizadas podem ser encontradas no repositório GitHub do Compose Multiplatform.

3. Início rápido — exemplo mínimo funcional

Após criar o projeto, abra o arquivo commonMain/kotlin/App.kt e substitua o conteúdo pelo código abaixo:

import androidx.compose.foundation.layout.*
import androidx.compose.material3.*
i