🎨 Master Compose Shared Element Transitions: A Smooth UI Journey

В статье разобрана реализация Shared element transitions в Compose с использованием SharedTransitionScope и Modifier.sharedElement. Ключевое требование — согласованные и стабильные ключи на обоих экранах, иначе переход работать не будет.

Также рассмотрены типичные ошибки:
▫️нестабильные идентификаторы
▫️некорректная организация scope’ов
▫️порядок навигации

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

🌐 Читать статью

🎨 Mobile Compose 💬 Чат канала
♾

#Release #Compose #Changelog

😇 Релиз Compose библиотек (25.02.2026)

🔵 Animation 1.10.4/1.11.0-alpha06
🔵 Foundation 1.10.4/1.11.0-alpha06
🔵 Material 1.10.4/1.11.0-alpha06
🔵 Runtime 1.10.4/1.11.0-alpha06
🔵 UI 1.10.4/1.11.0-alpha06

▫️Remote 1.0.0-alpha05
▫️Material 3 1.5.0-alpha15
▫Material3 Adaptive 1.3.0-alpha09
▫️Wear Compose 1.6.0-beta01
▫Navigation3 1.1.0-alpha05
▫XR Compose 1.0.0-alpha11
▫XR Material3 Compose 1.0.0-alpha15

🎨 Список всех изменений

🎨 Mobile Compose 💬 Чат канала
♾

#Release #Compose #Changelog

😇 Релиз Compose библиотек (11.03.2026)

🔵 Animation 1.10.5/1.11.0-beta01
🔵 Foundation 1.10.5/1.11.0-beta01
🔵 Material 1.10.5/1.11.0-beta01
🔵 Runtime 1.10.5/1.11.0-beta01
🔵 UI 1.10.5/1.11.0-beta01

▫️Remote 1.0.0-alpha06
▫️Wear Compose 1.6.0-rc01
▫Navigation3 1.1.0-beta01

🎨 Список всех изменений

🎨 Mobile Compose 💬 Чат канала
♾

#Article #UI #Animation

😇 Two-dimensional scrolling: scrollable2D, draggable2D

В документации Android появились подробности про 2D-скроллинг в Jetpack Compose. Если раньше для перемещения контента по обеим осям приходилось комбинировать verticalScroll и horizontalScroll (что не всегда работало гладко), то теперь есть нативные модификаторы scrollable2D и draggable2D.

Если коротко:

▫️Modifier.scrollable2D: Идеален для контейнеров с контентом, который больше экрана (карты, таблицы, фото). Главная фишка — поддержка fling (инерции) и нативного вложенного скроллинга. То есть, если вы доскроллили до края карты, скролл может бесшовно передаться родителю.

▫️Modifier.draggable2D: Более легковесный вариант для перемещения конкретных UI-элементов. В отличие от первого, здесь нет инерции — элемент останавливается ровно там, где вы оторвали палец. Подойдет для кастомных drag-n-drop анимаций.

Важный нюанс: в отличие от высокоуровневых LazyColumn, эти модификаторы не двигают контент за вас «из коробки». Они лишь отдают дельту смещения, которую нужно вручную применять через graphicsLayer или offset.

😇 Читать статью

🎨 Mobile Compose 💬 Чат канала
♾

#Release #Compose #Changelog

😇 Релиз Compose библиотек (25.03.2026)

🔵 Animation 1.10.6/1.11.0-beta02
🔵 Foundation 1.10.6/1.11.0-beta02
🔵 Material 1.10.6/1.11.0-beta02
🔵 Runtime 1.10.6/1.11.0-beta02
🔵 UI 1.10.6/1.11.0-beta02

▫️Remote 1.0.0-alpha07
▫Material 3 1.5.0-alpha16
▫️Wear Compose 1.6.0
▫Navigation3 1.1.0-rc01
▫XR Compose 1.0.0-alpha12
▫XR Material3 Compose 1.0.0-alpha16

🎨 Список всех изменений

🎨 Mobile Compose 💬 Чат канала
♾

#Release #Compose #Changelog

😇 Релиз Compose библиотек (08.04.2026)

🔵 Animation 1.11.0-rc01
🔵 Foundation 1.11.0-rc01
🔵 Material 1.11.0-rc01
🔵 Runtime 1.11.0-rc01
🔵 UI 1.11.0-rc01

▫Remote 1.0.0-alpha08
▫Material 3 1.5.0-alpha17
▫Material3 Adaptive 1.3.0-alpha10
▫Wear Compose 1.6.1/1.7.0-alpha01
▫Navigation3 1.1.0/1.2.0-alpha01

🎨 Список всех изменений

🎨 Mobile Compose 💬 Чат канала
♾

#Release #Compose #Changelog

😇 Релиз Compose библиотек (22.04.2026)

🔵 Animation 1.11.0/1.12.0-alpha01
🔵 Foundation 1.11.0/1.12.0-alpha01
🔵 Material 1.11.0/1.12.0-alpha01
🔵 Runtime 1.11.0/1.12.0-alpha01
🔵 UI 1.11.0/1.12.0-alpha01

▫Remote 1.0.0-alpha09
▫Material 3 1.5.0-alpha18
▫Navigation3 1.1.1/1.2.0-alpha02

🎨 Список всех изменений

🎨 Mobile Compose 💬 Чат канала
♾

#Compose #UI #Animation #Debugging

🎨 Compose 1.11.0 — Визуальная отладка анимаций

Shared Elements анимации и работа с Modifier.animatedBounds стали прозрачнее благодаря инструменту LookaheadAnimationVisualDebugging.

Ключевые возможности:

▫️Прямо в Runtime можно увидеть траектории движения объектов и их целевые границы (target bounds).
▫️Визуализация помогает понять, почему элемент «прыгает» или обрезается при переходе между экранами.

Инструмент полезен в первую очередь для сложных UI-переходов, где раньше приходилось полагаться только на логи и интуицию.

🎨 Mobile Compose 💬 Чат канала
♾

#Compose #UI #Tooling

🎨 Compose 1.11.0 — Preview wrappers

Compose 1.11.0 делает шаг навстречу ментальному здоровью разработчиков и добавляет PreviewWrappers. В чем суть: раньше для каждого превью приходилось вручную писать обертку вроде AppTheme { ... }. Теперь можно создать один универсальный класс-обертку.

Как это работает:
▫️Реализуете интерфейс PreviewWrapper, где в методе Wrap описываете нужный контекст (тему, CompositionLocals и т.д.).
▫️Вешаете аннотацию PreviewWrapperProvider на функцию превью.

class ThemeWrapper: PreviewWrapper {
    @Composable
    override fun Wrap(content: @Composable (() -> Unit)) {
        JetsnackTheme {
            content()
        }
    }
}

@PreviewWrapperProvider(ThemeWrapper::class)
@Preview
@Composable
private fun ButtonPreview() {
    Button(onClick = {}) {
        Text(text = "Demo")
    }
}

Плюсы:
▫️Чистый код: Превью-функции содержат только код самого компонента.
▫️Масштабируемость: Отлично работает с MultiPreview. Можно один раз настроить обертку для темной/светлой темы или разных локалей.
▫️Единообразие: Весь дизайн-код превью теперь живет в одном месте, а не размазан по проекту.

Важно — чтобы это заработало, помимо версии Compose, необходимо обновить и Android Studio до актуальной версии.

🎨 Mobile Compose 💬 Чат канала
♾

📣 Розыгрыш 2 билетов на Mobius 🎨

😀 До старта весеннего Mobius 2026 осталось совсем немного, а значит пришло время по традиции разыграть 2 билета на конференцию.

Условия просты — необходимо быть подписанным на @mobile_compose и @grigorievdy_blog

Результаты подведем 8 мая в 10:00 (GMT+3)

#Compose #Performance #Recomposition

🎨 Compose 1.11.0 — Новая реализация SlotTable

В Runtime Compose завезли новую экспериментальную реализацию SlotTable на базе LinkBuffer. Новая реализация теперь эффективнее обрабатывает точечные правки в дереве компонентов (random edits). Как итог — более шустрый динамический UI и меньший расход ресурсов памяти

Как потестить?

На данный момент новая реализация выключена по умолчанию. Если вы готовы к экспериментам и хотите проверить профит на своем проекте, её можно активировать вручную через специальный флаг:

ComposeRuntimeFlags.isLinkBufferComposerEnabled = true

🎨 Mobile Compose 💬 Чат канала
♾

#Compose #Performance #UI

🎨 Compose 1.11.0 — MediaQuery API

Представлен новый экспериментальный MediaQuery API. Это попытка стандартизировать адаптивную верстку без нагромождения проверок WindowSizeClass.

Ключевые фичи:
▫️Отслеживание не только размера окна, но и типа клавиатуры, точности указателя (перо vs палец) и положения складных устройств.
▫️derivedMediaQuery: Специальный механизм для оптимизации обновлений при высокой частоте изменения сигналов.

До MediaQuery API:

@Composable
fun isTabletopPosture(
    context: Context = LocalContext.current
): Boolean {
    val windowLayoutInfo by
        WindowInfoTracker
            .getOrCreate(context)
            .windowLayoutInfo(context)
            .collectAsStateWithLifecycle(null)

    return windowLayoutInfo.displayFeatures.any { displayFeature ->
        displayFeature is FoldingFeature &&
            displayFeature.state == FoldingFeature.State.HALF_OPENED &&
            displayFeature.orientation == FoldingFeature.Orientation.HORIZONTAL
    }
}

@Composable
fun VideoPlayer() {
    if(isTabletopPosture()) {
        TabletopLayout()
    } else {
        FlatLayout()
    }
}

С MediaQuery API:

@OptIn(ExperimentalMediaQueryApi::class)
@Composable
fun VideoPlayer() {
    if (mediaQuery { windowPosture == UiMediaScope.Posture.Tabletop }) {
        TabletopLayout()
    } else {
        FlatLayout()
    }
}

🎨 Mobile Compose 💬 Чат канала
♾

😀 🔠🔠🔠🔠➖🔠🔠🔠🔠 ☝

🎉 Результаты розыгрыша:

🏆 Победители:
1. Mikhail (@zykloned)
2. Олег (@manwoodt)

✔️Проверить результаты

#Article #Medium #Internals #Performance #Compose

🎨 Mission Impossible: How to Achieve 0 Recompositions in a Complex Custom UI

Статья разбирает способ достижения "нулевой" рекомпозиции в сложных кастомных компонентах. Обычных аннотаций Stable и Immutable для таких экстремальных задач часто оказывается недостаточно.

Решение кроется в отложенном чтении состояния через лямбды и переносе логики напрямую в фазы Layout или Draw. Это полностью исключает лишние циклы композиции, гарантируя идеальную плавность даже в нагруженном UI.

Спасибо подписчику канала @ShamilRtc за статью 👍

📖 Читать статью

🎨 Mobile Compose 💬 Чат канала
♾

🎨 Король умер — да здравствует король!

Google официально объявила о переходе к стратегии "Compose-first", а Android View при этом переводится в режим поддержки без дальнейшего активного развития.

Помимо Views, изменения коснулись и некоторых Jetpack-библиотек — их развитие также переводится в maintenance mode.

😇 Подробнее об изменениях

🎨 Mobile Compose 💬 Чат канала
♾

#Release #Compose #Changelog

😇 Релиз Compose библиотек (19.05.2026)

🔵 Animation 1.11.2/1.12.0-alpha03
🔵 Foundation 1.11.2/1.12.0-alpha03
🔵 Material 1.11.2/1.12.0-alpha03
🔵 Runtime 1.11.2/1.12.0-alpha03
🔵 UI 1.11.2/1.12.0-alpha03

▫Remote 1.0.0-alpha11
▫Material 3 1.5.0-alpha20
▫Material3 Adaptive 1.3.0-beta02
▫Navigation3 1.1.2/1.2.0-alpha03
▫Wear Compose 1.6.2/1.7.0-alpha03
▫Wear Compose Remote 1.0.0-alpha04
▫XR Compose 1.0.0-alpha14
▫XR Material3 Compose 1.0.0-alpha17

🎨 Список всех изменений

🎨 Mobile Compose 💬 Чат канала
♾