Шаги для включения Jetpack Compose и создания первого экрана

В Android Studio включить Jetpack Compose можно в модуле app: в android { buildFeatures { compose = true } } добавить kotlinCompilerExtensionVersion, зависимости Compose и заменить Activity на ComponentActivity с setContent { ... } — ниже пошагово с кодом и советами.

Быстрая подготовка проекта

  1. Новый проект: File → New → New Project → Empty Compose Activity (если доступно).
  2. Для существующего проекта внесите изменения в модульный build.gradle(.kts):

Пример build.gradle.kts (Module: app):

android {
    compileSdk = 34

    defaultConfig {
        minSdk = 24
        targetSdk = 34
    }

    buildFeatures {
        compose = true
    }

    composeOptions {
        kotlinCompilerExtensionVersion = "1.5.17"
    }
}

dependencies {
    implementation("androidx.core:core-ktx:1.11.0")
    implementation("androidx.activity:activity-compose:1.9.2")
    implementation("androidx.compose.ui:ui:1.7.0")
    implementation("androidx.compose.ui:ui-tooling-preview:1.7.0")
    implementation("androidx.compose.material3:material3:1.3.0")
    // Добавьте navigation-compose при необходимости
}

Поставьте minSdk ≥24 для стабильной работы библиотек и ускоренной сборки. Синхронизируйте Gradle после изменений.

Создание и запуск первого экрана (MainActivity и Composable)

Замените Activity на ComponentActivity и используйте setContent. Простой рабочий пример:

import android.os.Bundle
import androidx.activity.ComponentActivity
import androidx.activity.compose.setContent
import androidx.compose.foundation.layout.*
import androidx.compose.material3.*
import androidx.compose.runtime.*
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.unit.dp

class MainActivity : ComponentActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContent {
            MaterialTheme {
                Surface(
                    modifier = Modifier.fillMaxSize(),
                    color = MaterialTheme.colorScheme.background
                ) {
                    FirstScreen()
                }
            }
        }
    }
}

@Composable
fun FirstScreen() {
    var count by remember { mutableStateOf(0) }
    Column(
        modifier = Modifier
            .fillMaxSize()
            .padding(16.dp),
        verticalArrangement = Arrangement.Center,
        horizontalAlignment = Alignment.CenterHorizontally
    ) {
        Text("Привет, Jetpack Compose!", style = MaterialTheme.typography.headlineMedium)
        Spacer(Modifier.height(16.dp))
        Button(onClick = { count++ }) {
            Text("Нажали: $count")
        }
    }
}

Добавьте превью для быстрой проверки в Android Studio:

@Preview(showBackground = true)
@Composable
fun FirstScreenPreview() {
    FirstScreen()
}

Запустите на эмуляторе API 34+ или реальном устройстве — экран отрисуется мгновенно.

Проверка, сборка и полезные расширения

  • Preview: откройте вкладку Design → Preview; редактор покажет @Preview автоматически.
  • Hot Reload / Apply Changes: используйте для быстрых правок UI без полной сборки.
  • Навигация: добавьте dependency "androidx.navigation:navigation-compose:2.8.0" для мульти-экранного приложения.
  • Сборка релиза: Build → Build Bundle(s) / APK(s) → Build APK(s).

Compose требует Kotlin. Если проект на Java — переведите модуль на Kotlin или создайте новый Kotlin-модуль; Compose не поддерживает Java напрямую.

Частые ошибки

  • buildFeatures { compose = true } не добавлен — компиляция падает с ошибками про неизвестные аннотации.
  • Неверная версия kotlinCompilerExtensionVersion — проверьте совместимость с версиями Compose.
  • Использование Android View-специфичных API внутри @Composable без адаптации — UI не будет реактировать.
  • Отсутствует activity-compose в зависимостях — setContent не доступен.

FAQ

  • Нужно ли отключать XML? Нет — можно сочетать Compose и XML через ComposeView или AndroidView, но для новых экранов предпочтителен Compose.
  • Как отлаживать состояние? Используйте remember/rememberSaveable и инструменты Layout Inspector.
  • Как добавить Material 3? Подключите material3 в зависимостях и оберните UI в MaterialTheme (как в примере).

Теперь у вас есть готовая рабочая конфигурация и минимальный экран. Экспериментируйте с состоянием, навигацией и анимациями — Compose позволяет быстро прототипировать и улучшать интерфейсы.