🤖 Как использовать Compose, чтобы сделать анимированный Splash Screen

Разработчик создал библиотеку androidx-splashscreen-compose (не от Google решение), которая позволяет делать красивую анимацию как на анимашке.

Подробный разбор и реализация есть в статье (EN,6м, альт. ссылка) или 🐱 исходниках на GitHub

#android #compose

🤖 Для Compose Material3 Adaptive добавили поддержку каноничных layout на основе библиотеке Navigation 3. Пока вышла первая альфа версия, но уже можно начинать работать. Подробности в анонсе

#compose #navigation

🚀 Отказываюсь от Списков в пользу Сеток в UI

Раньше для списков в Compose я по привычке использовал LazyColumn. Но чем больше работаю с адаптивными интерфейсами, тем очевиднее: это никуда не годиться и надо использовать доступное пространство, а не тупо растягивать интерфейс. Перехожу на Grid компоновку ✔️

LazyVerticalGrid позволяет задать фиксированную ширину колонки, и система сама рассчитает, сколько их поместится на экране.
В результате:
1️⃣ адаптивность «из коробки» на телефонах, планшетах и больших экранах
2️⃣ минимум дополнительного кода,
3️⃣единый компонент вместо костылей для разных форм-факторов.

LazyVerticalGrid(
    columns = GridCells.Adaptive(minSize = 120.dp),
    modifier = Modifier.fillMaxSize(),
    contentPadding = PaddingValues(8.dp)
) {
    items(100) { Item(...) }
}

Определение количества колонок происходит на основе политики GridCell:

// всегда N колонок
GridCells.Fixed(N)

// автоматический расчет на основе минимальной ширины колонки
GridCells.Adaptive(minSize = 120.dp)

// каждая ячейка шириной 100dp
GridCells.FixedSize(100.dp)

📱 На маленьком экране это будет 2–3 колонки, а на планшете — уже 5–6, и всё это без ручной логики.

Есть еще более гибкий вариант если элементы строк должны быть разной высоты - LazyVerticalStaggeredGrid (стиль как в Pinterest)

LazyVerticalStaggeredGrid(
    columns = Adaptive(minSize = 150.dp),
    modifier = Modifier.fillMaxSize(),
    contentPadding = PaddingValues(8.dp)
) {
    items(100) { Item(...) }
}

❗️ Теперь я придерживаюсь строго правила:

Если не могу явно сформулировать почему интерфейс должен быть в одну колонку, то вертикальный список брать не стоит!

🔗 Очень хорошо построение списков осветили в документации по Lazy Layout

Аналогично можно проделать и с RecyclerView, использую вместо LinearLayoutManager вариант с сеткой - GridLayoutManager или StaggeredGridLayoutManager, только там не будет автоматического расчета колонок на основе доступного места. Это придется реализовывать самостоятельно.

✍️ Что думаете о таком подходе для UI? Ударит по производительности?

#ui #android #compose

📸 Вышла Jetpack CameraX 1.5.0 с новыми фичами и готовым UI для видоискателя камеры

Что нового
🤖 Camera Viewfinder - первый релиз стабильный релиз UI для показа камеры с простым встраиванием в UI (View и Compose)
⚙️ Первый релиз androidx.camera:camera-compose - работа с камерой в Compose UI
🛠 Исправление багов

// Пример View Finder в Compose
val currentSurfaceRequest: SurfaceRequest
    by viewModel.surfaceRequests.collectAsState()
val coordinateTransformer = remember { MutableCoordinateTransformer() }
CameraXViewfinder(
    surfaceRequest = surfaceRequest,
    // Can also use EMBEDDED
    implementationMode = ImplementationMode.EXTERNAL,
    modifier =
        modifier.pointerInput(Unit) {
            detectTapGestures {
                with(coordinateTransformer) {
                    val surfaceCoords = it.transform()
                    viewModel.focusOnPoint(
                        surfaceRequest.resolution,
                        surfaceCoords.x,
                        surfaceCoords.y
                    )
                }
            }
        },
    coordinateTransformer = coordinateTransformer
)

#android #камера #jetpack #compose

🤖 Адаптивность UI в Android-приложениях

Android-приложения запускаются на экранах с разными размерами и ориентацией. Чтобы интерфейс выглядел хорошо в любых условиях, стоит учитывать несколько простых правил, которые я выработал за годы опыта 👇

1️⃣ Не привязывайтесь к фиксированным размерам
Фиче может быть выделен весь экран, часть окна или вообще маленький контейнер. Пусть она сама решает: занять всё пространство или только необходимое. Остальное — задача хоста, который через параметры (например, Modifier в Compose) подстроит отображение или сама правильно разместит (например, по центру).

2️⃣ Используйте адаптивные компоненты
Вместо LazyColumn — лучше LazyVerticalGrid, а для RecyclerView — GridLayoutManager. Они умеют подстраивать сетку под свободное место на экране.

3️⃣ Закладывайтесь на увеличение текста и элементов
Пользователь может менять скейл интерфейса: Google позволяет масштабировать всё, увеличивая DP → PX. Поэтому всегда предусмотрите скролл, если контента может стать больше.

4️⃣ UI фичи не должен знать, где он окажется
Фича отвечает только за свой UI. А вот приложение решает, как её показать: в одну панель или, например, в связке через ListDetailPaneScaffold, где на экране могут быть сразу несколько экранов.

Даже если дизайнер подготовил макет только под смартфон в вертикали — попробуйте включить воображение. Немного гибкости и масштабирования дадут пользователям куда более удобный опыт без больших трудозатрат.

📚 Что почитать:
- Практики по построению адаптивных приложений
- Compose Material 3 Adaptive
- Jetpack WindowManager
- Как строить адаптивный UI через layout

💬 Делитесь в комментариях своими советами и болями адаптивности UI

#android #ui #compose #adaptive #ux #material3

📹 Собеседование на Kotlin Multiplatform разработчика
🎙 Проводит — Алексей Панов @kotlin_adept
🗓 Понедельник, 20 октября, 19:00 (GMT+3)

Kotlin Multiplatform (KMP) набирает всё большую популярность — растёт количество вакансий и интерес со стороны компаний.

Я давно хотел провести реальное собеседование, где Android-разработчика с опытом в KMP будут спрашивать на позицию, где придётся писать на KMP каждый день:
иногда с использованием Compose, а иногда — только шаря логику между платформами.

Будет жарко 🔥
Алексей — один из самых опытных разработчиков, кто давно пишет KMP в проде и отлично понимает экосистему.

Кстати, у него классный Telegram-канал @kotlin_adept — там много полезных инсайтов про KMP.

❗️Запись собеседования появится на канале после эфира.

#AndroidBroadcast #kmp #compose #собеседование #android

Вот реальная история, как знание механики работы ViewModel спасло мне вечер 👇

У меня приложение на Compose и Jetpack Navigation 3 (работает на основе состояния Back Stack). Экран «Навигатор файлов» открывает папки рекурсивно: по сути это тот же экран, но с другими данными. Все данные — из одной и той же ViewModel.❗️Баг: при переходе в папку навигация срабатывает, UI не меняется. Современные ИИ подсказали общие вещи, но не помогли — промты, видимо, подвели (тут мне ещё надо прокачать знания) 🙂

Вспомнил ключевой факт про архитектуру:
👉 Все ViewModel живут в ViewModelStore.
👉 В пределах одного ViewModelStoreOwner (Activity/Fragment/NavBackStackEntry) получение ViewModel по умолчанию идёт по типу.
👉 Если нужно несколько экземпляров одного типа на одном owner’е — используем key.

Решение в одну строку — привязать ключ к ViewModel, связанный с текущей папкой:

@Composable
fun FileNavigator(
    folderId: Id,
    modifier: Modifier = Modifier,
) {
    // новый folderId → новый экземпляр ViewModel → новый UI-стейт
    val viewModel: FileNavigatorViewModel = viewModel(
        key = "files(rootId='$folderId')"
    )
    // ...
}

Мини-чеклист, если ловите такой баг
👉 Один экран используется повторно с разными параметрами? → Нужен key.
👉 Меняется route, но owner тот же? → key обязателен.
👉 Используете Hilt/Koin? → У этих функций тоже есть параметр key (hiltViewModel(key=...), koinViewModel(key=...)).
👉 key должен детерминированно зависеть от входных данных (например, folderId).
👉 При навигации назад убедитесь, что ViewModel освобождается ожидаемо.

Ещё нюанс - если у вас сложная иерархия графов, проверьте, к какому ViewModelStoreOwner вы реально привязаны.

Рекомендую посмотреть мои видео по теме:
📹 Разбор Jetpack Navigation 3
🪙 Полный разбор Jetpack ViewModel в Android и Kotlin Multiplatform

#android #compose #androidjetpack #viewmodel #архитектура

🚀 Вышел Jetpack Compose Material3 Adaptive 1.2.0

Если коротко про изменения — Material3 Adaptive всё ближе к полноценному “Responsive Compose”. Теперь можно писать интерфейсы, которые одинаково естественно ведут себя на телефоне, планшете и десктопе.

Главное:
🪶 Levitate-стратегия для ThreePaneScaffold — превращает панель в плавающее окно (popup).
↔️ Reflow-стратегия для ThreePaneScaffold — позволяет при узком экране уводить одну панель под другую, сохраняя UX.
👉 PaneScaffoldScope.saveableStateHolder — сохраняет состояние между разными конфигурациями экрана.
👉 Modifier.preferredHeight() — теперь можно задать предпочтительную высоту панели.
📏 Новые WindowSizeClasses: API currentWindowAdaptiveInfo() теперь распознаёт Large и ExtraLarge окна — важный шаг к поддержке планшетов и десктопов.
👉 Drag-to-resize получил настройку пользовательского поведения и поддержку a11y (accessibility).
🏝 Плюс: обновлён Kotlin 2.0, переработано API стратегий, исправлены ошибки с анимациями и рендерингом при адаптации.

#compose #material3 #adaptive #android #jetpack

📦 Не храните всю графику в приложении

Одна из лучших практик — храните в приложении только простые иконки в векторном формате, а всю растровую графику держите в облаке. Особенно это важно для приложений, которые не могут работать офлайн 🌐

Почему это стоит делать:
🚀 Меньше вес приложения → быстрее установка и обновления
📉 Не тянете лишние ресурсы, которые пользователь никогда не увидит (например, фичи под подпиской или в определённом регионе)
🌍 Можно адаптировать загрузку под регион, тариф или подписку
💰 Гибкость — обновляйте, отключайте или заменяйте контент без релиза

Как хранить изображения правильно:
- Векторные иконки → храним в ресурсах приложения
- Баннеры, иллюстрации, фото → CDN или облако (Firebase Storage, CloudFront, S3 и др.) Для загрузки используйте image loader: Coil, Glide, Picasso и т.д.

Чтобы грузить локальные ресурсы в Android через URL можно использовать адреса (примеры для приложения с именем пакета com.example.myapp):
- По имени ресурса android.resource://com.example.myapp/drawable/my_image
- По числовому ID android.resource://com.example.myapp/2130837504

⚙️ Для Compose Multiplatform пока нет прямой поддержки таких ссылок, но можно расширить любой image loader и добавить обработку собственных URL или типов данных

#android #оптимизация #compose #coil

🚀 Вышла стабильная версия Jetpack Navigation 3 - бибилотека для UI навигации, заооченная под Compose

Стал доступен первый стабильный релиз навигации, разработанной специально для Compose. Библиотека предоставляет больше гибкости и контроля разработчикам, позволяя реализовать различные подходы. Google выложила свои примеры реализации популярных задач в репозитории на 🐱GitHub

Nav3 имеет поддержку Compose Multiplatform, а также JetBrains выпустила версию артефактов

👉 Документация по библиотеке

Всем кто использует Jetpack Navigation 2 с Compose нааооятельно рекомендуется миграция.
🔨Руководство по миграции
⭐️ Также Google сделала файл с контекстом для AI агента при миграции

Про возможности бибилотеки я рассказал в 📹 отдельном видео

#android #compose #kmp #cmp #jetpack #ui #nav3

🚀 Lifecycle 2.10.0 вышел в стабильной версии!

Google выпустила мажорное обновление библиотек Lifecycle. Этот релиз сфокусирован на улучшении интеграции с Compose.

⚙️ rememberLifecycleOwner для Compose
Новый композабл позволяет создавать изолированные LifecycleOwner внутри UI. Идеально для компонентов, которым нужно независимое управление состоянием — например, для HorizontalPager, где только активная страница должна быть в состоянии RESUMED.

@Composable
fun MyComposable() {
    val lifecycleOwner = rememberLifecycleOwner(
        maxLifecycle = Lifecycle.State.RESUMED,
        parentLifecycleOwner = LocalLifecycleOwner.current,
    )
    
    CompositionLocalProvider(
        LocalLifecycleOwner provides lifecycleOwner
    ) {
        // Дочерние композаблы теперь имеют собственный жизненный цикл
    }
}

🚀 Интеграция с Navigation 3
Новый артефакт lifecycle-viewmodel-navigation3 предоставляет готовый декоратор для автоматической привязки ViewModel к отдельным экранам в Navigation 3.

NavDisplay(
    backStack = backStack,
    entryDecorators = listOf(
        rememberSaveableStateHolderNavEntryDecorator(),
        rememberViewModelStoreNavEntryDecorator(), // Добавляем эту строку
    ),
    entryProvider = entryProvider { /* ... */ }
)

Удобства для разработчиков:
👉 Идиоматичный Kotlin API для создания кастомных CreationExtras

    CreationExtras {
        this[MY_CUSTOM_KEY] = "myValue"
    }
    

👉 Метод savedStateHandle.saved() теперь нативно поддерживает nullable типы
👉 Конструкторы SavedStateHandle помечены как @VisibleForTesting

⚠️ Важное изменение
Повышение minSdk с API 21 до API 23 — убедитесь, что ваше приложение соответствует новым требованиям.

#Jetpack #Lifecycle #Compose #Navigation #ViewModel #Kotlin

🚀 Navigation Event 1.0.0 — новая KMP-библиотека для обработки навигации на разных платформах

Что дает библиотека
👉 Единый кроссплатформенный API для замены разрозненных решений
👉 Централизованная система управления всей навигацией в приложении
👉 Базовый слой для будущих навигационных решений Android

Пример использования:

val myHandler = object : NavigationEventHandler<NavigationEventInfo>(
    initialInfo = CurrentInfo,
    isBackEnabled = true
) {
    override fun onBackStarted(event: NavigationEvent) {
        // Подготовка к навигации
    }
    
    override fun onBackProgressed(event: NavigationEvent) {
        // Анимации на основе event.progress
    }
    
    override fun onBackCompleted() {
        // Завершение навигации
    }
}

👉 Готовая интеграция с Compose

val navEventState = rememberNavigationEventState(
    currentInfo = CurrentInfo,
    backInfo = PreviousInfo
)

NavigationBackHandler(
    state = navEventState,
    isBackEnabled = true,
    onBackCompleted = { /* Действие при завершении */ }
)

👉 Диспетчеры могут образовывать родительско-дочерние цепочки:

// Compose
val childDispatcher = rememberNavigationEventDispatcher(
    parent = 
         LocalNavigationEventDispatcherOwner
           .current
           .navigationEventDispatcher
)

👉 Нативная поддержка Predictive Back из Android
👉 Библиотека уже используется в Activity 1.12.0 как базовый слой

#Jetpack #Navigation #Compose #KMP #PredictiveBack #Kotlin

⚙️ Команда Compose добилась плавности скрола как в View на Android. Источник тут

#compose

‼️ Google отменяет Compose Material Icons

С релизом Compose Material 3 — версии 1.4.0 Google сделала радикальный шаг: библиотека androidx.compose.material.icons исключена из Material3 и больше не рекомендуется к использованию.

Что произошло
👉 Material Icons удалены из актуального релиза Material3 1.4.0
👉 Поддержка библиотеки прекращена
👉 Можно подключить вручную, но это временная мера для тех, кто не успел мигрировать

❌ Основная причина отказа - негативное влияние на скорость сборки. Библиотека Material Icons тащит весь огромный набор иконок. Это ощутимо увеличивает build time крупных Android и Compose Multiplatform проектов.

Google предлагает переходить на Vector Drawable XML в Android или Compose Multiplatform ресурсах. Скачивайте иконки с вкладки Android на странице Material Symbols и храните в ресурсах проекта

Преимущества использования Material Symbole:
✔️ актуальный набор иконок
✔️ минимальный вес и отсутствие лишних зависимостей
✔️ предсказуемое время сборки
✔️ лучший контроль над ресурсами проекта

❗️ Обновлений библиотеки Material Icons не будет!

Источник - официальная документация Android Jepack

Благодарю подписчика Evgeny F. за то, что обратил внимание на изменение.

#Android #AndroidJetpack #Material3 #Compose #CMP

🤖 Jetpack Navigation 3: Полный гид по новой библиотеке навигации от Google

Гугл выпустил Navigation 3 — это новая глава в построении навигации для Android-приложений. Всё, что вы знали, теперь стало мощнее, гибче и композабльнее!

00:00 — Базовые принципы Navigation 3
02:09 — NavEntry и entryProvider
03:29 — Разбор API на практике
07:17 — Навигация в многомодульном приложении
11:27 — Модуляризация: пишем код
15:57 — Анимации экранов
16:15 — Погружаемся в анимации
19:44 — Адаптивные макеты (Scenes)
23:01 — Scenes в действии
24:39 — Краткий итог и выводы

🔗 Официальное руководство
🔗 Рецепты для работы с Nav3 (Code recipes)

Навигация больше не будет болью! Смотрите, внедряйте и делитесь впечатлениями в комментариях.

#Android #AndroidDev #Jetpack #Compose #KMP

🤖 Улучшаем работу со Stacktrace в Jetpack Compose (особенно в релизе)

Команда Compose представила opt-in API для улучшения читаемости стектрейсов во время разработки и для релизов.

Теперь становится возможным:
👉 Точно определять источник крешей в композиции, Side Effect (LaunchedEffect, DisposableEffect) и корутинах из rememberCoroutineScope.
👉 Изолировать падения для создания воспроизводимых примеров.
👉 Изучать креши, которые раньше показывали только внутренние фреймы Compose.

Достаточно добавить одну строку в точке входа в приложение (например, в Application.onCreate()):

// Включить stack trace только для минифицированных сборок (рекомендуемый способ)
Composer.setDiagnosticStackTraceMode(ComposeStackTraceMode.Auto)

// Или для локальной отладки (более точные, но тяжёлые трассировки)
Composer.setDiagnosticStackTraceMode(ComposeStackTraceMode.SourceInformation)

‼️ВАЖНО Требуется Kotlin 2.3.0, а для режимов `Auto` и `GroupKeys` - включённый R8 с минификацией.

Есть несколько режимов работы
✔️Auto (рекомендуется): использует GroupKeys для минифицированных сборок и None для отладочных.
👉 GroupKeys: для минифицированных приложений. Использует маппинг-файл от R8 для восстановления примерного местоположения.
👉 SourceInformation: для отладки. Даёт точные строки где произошел креш, но затратно по производительности. Стоит использовать только на этапе разработке.
❌ None: ничего не добавляет (поведение по умолчанию).

Под капотом любой креш в Compose коде оборачивается в DiagnosticComposeException, который добавляется в suppressed-исключения. В нём будет полная иерархия вызовов `@Composable` функций на момент падения!

java.lang.IllegalStateException: Test layout error
    at <original trace>
Suppressed: androidx.compose.runtime.DiagnosticComposeException:
Composition stack when thrown:
    at ReusableComposeNode(Composables.kt:<unknown line>)
    at Layout(Layout.kt:79)
    at <lambda>(TempErrorsTest.kt:164) <-- Ваша функция!
    ... и т.д.

⚠️ Известные ограничения:
👉 В режиме SourceInformation для первых фреймов могут не указываться номера строк (<unknown line>).
👉 GroupKeys указывает только на первую строку @Composable функции.
👉 Если сам сбор стектрейса упадёт, его исключение будет добавлено как suppressed.

Подробнее в официальной документации

💬 А вы уже пользовались этой фичей? Делитесь в комментариях! 👇

#AndroidDev #Kotlin #Compose #R8 #Android

🔨 Лучше поздно, чем никогда - Material Symbols из Google Fonts встроили в Android Studio. Пока только в Canary версии Panda.

Для тех кто не в курсе, Material Symbols пришли на замену Compose Material Icons, которые больше не рекомендуется к использованию (подробности тут)

Источник - Android Developers

#Android #AndroidDev #Compose #AndroidStudio