Compose Broadcast
5.81K subscribers
340 photos
88 videos
556 links
Все о Jetpack Compose и Compose Multiplatform

YouTubе канал: https://youtube.com/androidBroadcast
Android - @android_broadcast
iOS - @ios_broadcast
Kotlin - @kotlin_broadcast
Download Telegram
⚙️ Вышел Jetpack Compose 1.8.2 с исправлениями багов. Обновляйте Compose BOM до самой свежей версии
dependencies {
implementation(platform("androidx.compose:compose-bom:2025.05.01"))
}


#compose #android
Please open Telegram to view this post
VIEW IN TELEGRAM
👍25
⚙️ Material 3 Expressive уже доступен в Compose

В androidx.compose.material3:material3:1.4.0-alpha10 есть множество новых компонентов следующий дизайн системы Google. Помимо компонентов также доступна новая системная физика для движений компонентов

@Composable
fun AndroidifyTheme(
content: @Composable () -> Unit,
) {
val colorScheme = LightColorScheme


MaterialExpressiveTheme(
colorScheme = colorScheme,
typography = Typography,
shapes = shapes,
motionScheme = MotionScheme.expressive(), // задание схемы движений
content = {
SharedTransitionLayout {
CompositionLocalProvider(LocalSharedTransitionScope provides this) {
content()
}
}
},
)
}


Больше примеров найдете в статье, а также можно посмотреть в исходниках нового приложения примера Androidify

#compose #android
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥29🤯6🤔3
🐱 OpenAnimationApp - демо приложение с демонстрацией работы разных Lottie анимаций на Android, iOS, Desktop/JVM и Web с использованием Kotlin Multiplatform. Демо сделано на основе Compottie - Compose Multiplatform обертки Lottie

#compose #анимация #android #desktop #ios #wasm #js #web
Please open Telegram to view this post
VIEW IN TELEGRAM
31👍10🔥4
⚙️ Первая Beta Jetpack Compose 1.9.0 уже вышла

Самый простой способ попробовать новую версию - использовать BOM в Gradle
dependencies {
implementation(platform("androidx.compose:compose-bom-beta:2025.06.01")
}


#compose #android
Please open Telegram to view this post
VIEW IN TELEGRAM
👍121
⚙️ Compose 1.8.3 с исправлением багов в UI артефакте

Самый простой способ попробовать новую версию - использовать BOM в Gradle
dependencies {
implementation(platform("androidx.compose:compose-bom:2025.06.01")
}


#compose #android
Please open Telegram to view this post
VIEW IN TELEGRAM
👍83
⚙️ Вышла вторая Beta Jetpack Compose 1.9.0

В новой сборке исправили баги, а также добавили поддержку smart элементов в контекстных меню

Самый простой способ попробовать новую версию - использовать BOM в Gradle
dependencies {
implementation(platform("androidx.compose:compose-bom-beta:2025.06.02")
}


#compose #android
Please open Telegram to view this post
VIEW IN TELEGRAM
10👍5
This media is not supported in your browser
VIEW IN TELEGRAM
LazyTimetable - open source Jetpack Compose библиотека для реализация lazy расписания мероприятия или в школе/универе. Работает только на Android

#compose #android #opensource
👍17🤔133🔥3
This media is not supported in your browser
VIEW IN TELEGRAM
⚙️ История (20м) как в Dodo переписали компонент слайдера на Compose. До этого он был на MotionLayout.

Причина - куча багов, которые не получалось решить, а также на Compose писать проще.

По итогу реализовали свой Layout, чтобы сделать иерархию плоской и было меньше рекомпозиций.
@Composable  
fun FastPaymentButton(
fastPaymentState: FastPaymentState,
modifier: Modifier = Modifier,
thumbContent: @Composable BoxScope.() -> Unit = {},
background: @Composable () -> Unit = DefaultFastPaymentButtonBackground,
// Параметры будут добавляться по мере обогащения слайдера фичами
onClick: () -> Unit = {},
onSwiped: () -> Unit = {},
) {
// Content
}


#compose #android
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥51👍11
⚙️ Вышел Jetpack Compose 1.9.0 Stable

Вышла следующая стабильная версия UI фреймворка для Android. Что нового:

👉 Появилась модификаторы для работы с тенями Modifier.dropShadow() и Modifier.innerShadow(). Уже существующий Modifier.shadow() рисует тень за объектом, а новые модификаторы добавят тень внутри.

👉 Более производительный способ отслеживать положения элементов на экране с помощью Modifier.onLayoutRectChanged()

👉 Добавили поддержку скролла в двух направлениях сразу (например как скролл карты или фото). Используйте Draggable2D и Scrollable2D API

👉 Улучшили работу скролла скролл при использованием VIew с Compose

👉 Добавили опцию для включения большего количества информации при анализе крешей в Compose
class App : Application() {
override fun onCreate() {
Composer.setDiagnosticStackTraceEnabled(BuildConfig.DEBUG)
}
}


👉 Аннотации @Stable, @Immutable и @StableMarker выделили в отдельный артефакт runtime-annotation, чтобы можно было использовать их в модулях без Compose

👉 Новые аннотации @RememberInComposition и @FrequentlyChangingValue (подробнее в отдельном посте)

Много улучшений в LazyLayout
👉 Стабилизация API для создания собственных Lazy компонентов
👉 Значительное ускорение производительности скролла Lazy List и Lazy Grid благодаря механизму предзагрузки (prefetch). Надо использовать LazyLayoutCacheWindow
@Composable
private fun LazyColumnCacheWindowDemo() {
val dpCacheWindow = LazyLayoutCacheWindow(ahead = 150.dp, behind = 100.dp)
val state = rememberLazyListState(cacheWindow = dpCacheWindow)
LazyColumn(state = state) {
items(count) { Text(text = "$it", fontSize = 80.sp) }
}
}


Конечно же новая версия Compose - это повышение скорости работы и исправление багов для более плавного UI

Обновляем BOM файл в зависимостях вашего проекта для получения свежей версии:
// build.gradle.kts
dependencies {
implementation(platform("androidx.compose:compose-bom:2025.08.00"))
}


#compose #android
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥576👍4
⚙️ XCalendar - Google Calendar, переписанный на Compose Multiplatform для Android и iOS. Есть все основные фичи, но самое интересное - как сделали виджеты для отображения календаря.

#kotlin #compose #android #ios #пример
Please open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
👍38🔥11
⚙️ Стектрейсы Jetpack Compose в релизных сборка теперь станут понятными!

С выходом Kotlin 2.3.0 (на момент написания поста вышла Beta 2) компилятор Compose начал генерировать mapping файлы для стектрейсов Composable функций — теперь даже если ваше приложение минифицировано R8, вы сможете понять, где именно упала композиция.

Раньше подробные стектрейсы были доступны только в debuggable сборках из-за того что информация не затиралась. Теперь же появился новый режим — Group Keys, который позволяет связать анонимные функции из минифицированного кода с исходными @Composable без необходимости хранить пути к файлам.

Чтобы включить этот режим, добавьте строку до инициализации любого контента Compose (лучше всего в рутовой функции):
Composer.setDiagnosticStackTraceMode(ComposeStackTraceMode.GroupKeys)


После этого при падениях во время composition / measure / draw Compose сам добавит свой стектрейс — даже в релизных сборках 🔥

Для работы требуется:
⚙️ Compose Runtime 1.10+
🤖 R8 включен (ProGuard не подходит)
🏝 Kotlin 2.3.0+

Если же увидите новые предупреждения или недостаток информации — Google просит репортить их в Issue Tracker.

#compose #kotlin #android #r8
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥27👍42
🐱 Heron - open source клиент для соц сети Bluesky. Приложения на Jetpack Compose Multiplatform для Android, iOS и Desktop

Тех стек:
👉 Многомодульная архитектура
👉 Metro DI
👉 Coil для показа картинок
👉 Kotlin Coroutines и SerlializationX
👉 Ktor
👉 Jetpack Room

#compose #cmp #kmp #android #ios #desktop #пример #opensource
Please open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
👍23🔥63
⚙️ Вышел Jetpack Compose 1.10.0 Beta 2

Обновляйте зависимости или сразу всё через BOM файл:
dependencies {
implementation(
platform("androidx.compose:compose-bom-beta:2025.11.00")
)
}

#compose #android
Please open Telegram to view this post
VIEW IN TELEGRAM
👍5
⚙️ ShadowGlow - open source библиотека для теней с широкими возможностями кастомизации. Поддержка только Android

Text(
text = "Solid Shadow",
modifier = Modifier
.shadowGlow(
color = Color.Black.copy(alpha = 0.5f),
borderRadius = 8.dp,
blurRadius = 10.dp,
offsetX = 4.dp,
offsetY = 4.dp
)
.background(Color.White)
.padding(16.dp)
)


#compose #android
Please open Telegram to view this post
VIEW IN TELEGRAM
👍33
⚙️ Ускоряем рендеринг текста в Compose: фоновая предзагрузка

Традиционно измерение и кэширование текста происходит на UI-потоке, что для длинных текстов может создавать задержки. Начиная с версии 1.9, Compose позволяет вынести эти операции в фоновый поток. Для View уже давно была такая возможность, а вот на Compose ждали.

Как это работает на практике:
val textMeasurementExecutor = Executors.newSingleThreadExecutor()

CompositionLocalProvider(
LocalBackgroundTextMeasurementExecutor provides DefaultTextMeasurementExecutor
) {
// Весь текст внутри будет предзагружаться в фоне
Column {
Text("Заголовок")
Text("Длинный описательный текст...")
AnnotatedString("Форматированный текст")
}
}

Ключевые преимущества:
- Ускорение layout — предзаполнение word-cache происходит заранее
- Разгрузка UI-потока — тяжелые операции с текстом уходят в фон
- Особенно эффективно в списках (LazyColumn/LazyRow) с текстовым контентом
- Работает с любыми текстовыми компонентами — BasicText, Text, AnnotatedString

Когда стоит применять:
- Приложения с большими объемами текста (читалки, новости, документация)
- Списки с множеством текстовых элементов
- Сложные текстовые интерфейсы с форматированием

❗️Важный нюанс: Результаты могут варьироваться в зависимости от контента, поэтому всегда тестируйте производительность до и после внедрения.

Уже используете эту возможность? Делитесь результатами в комментариях!

#Compose #Android
Please open Telegram to view this post
VIEW IN TELEGRAM
31👍10🔥4
🔥 Remote Compose — новый взгляд на Server-Driven UI в Jetpack Compose

В AndroidX Jetpack появилась новая экспериментальная библиотека androidx.compose.remote (пока еще даже на dev версия). Она предлагает совершенно другой подход к динамическим интерфейсам и может радикально изменить то, как мы обновляем UI в продакшене, категорически отличающаяся от текущих BDUI/SDUI решений.

Remote Compose позволяет создавать и рендерить интерфейсы Jetpack Compose удалённо, без пересборки и релиза приложения.
UI генерируется на сервере, сериализуется в компактный бинарный документ и воспроизводится на устройстве.

Remote Compose открывает возможности, которые раньше требовали релиза приложения:
⚡️ Мгновенные A/B-тесты — вариации интерфейса меняются на сервере, без обновлений.
🎨 Обновление дизайна в реальном времени — карточки товаров, баннеры, сезонные темы.
📰 Динамические контентные экраны — новости, акции, спецпроекты, которые появляются мгновенно.
🧪 Фичи без мусора — нет необходимости тянуть все варианты экрана в бинарник.

Архитектура Remote Compose состоит из двух частей:

1️⃣ Создание документа

На сервере вы пишете обычные composable-функции — либо используете специальные Remote* элементы (RemoteColumn, RemoteText и др.).

Библиотека перехватывает draw-операции Compose и превращает UI в бинарный документ. Получается самодостаточный «UI-файл», который можно отправить на клиент.

2️⃣ Воспроизведение документа

На устройстве этот документ «проигрывается» плеером:
👉 есть Compose-плеер — для современных приложений;
👉 есть Android View-плеер — для старых архитектур.

Плеер интерпретирует более 90 низкоуровневых операций (рисование, layout, модификаторы, state), обеспечивая реальную нативную отрисовку, без WebView и без компонентов, которые нужно заранее описывать в приложении.

Почему это лучше JSON или WebView
JSON-подход требует схем, ограничивает сложные эффекты, анимации и кастомные компоненты.
WebView — это отдельный процесс, разная визуальная стилистика, тяжёлое потребление памяти и уязвимости

Remote Compose передаёт не структуру компонентов, а реальные команды рисования. Поэтому любое, самое сложное Compose-UI — будет воспроизведено точно так, как вы его задали.

Базовые принципы Remote Compose
👉 Документность — UI становится бинарным документом, который можно кешировать, версионировать, отправлять по сети.
👉 Платформенная независимость — один документ можно рендерить на телефоне, планшете, складном устройстве и даже часах.
👉 Отделение визуального уровня от логики — клиенту не нужно знать о ваших composable-функциях, ViewModel, DI и т.п.
👉 Двусторонняя связь — клики и события возвращаются на клиент, который решает, что делать (навигировать, логировать, изменять состояние).
👉 Поддержка анимаций и выражений — значения могут вычисляться по времени, переменным, условиям.

Для большинства приложений оптимальная модель — гибридная:
📱 основная навигация + критические экраны в “локальном Compose”,
⚙️ динамические зоны — через Remote Compose.

Если Remote Compose будет развиваться так же активно, как Compose в своё время, это может стать стандартом для динамических интерфейсов на Android. Как вам такой поворот с Compose?

Источник тут

#jetpack #android #compose #serverdrivenui #sdui #bdui
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥94🤯4018👍3🤔3
⚙️ Пример использования Jetpack Compose Remote

// Пример создания документа на севере
val document = captureRemoteDocument(
context = context,
creationDisplayInfo = displayInfo,
profile = profile
) {
RemoteColumn(modifier = RemoteModifier.fillMaxSize()) {
RemoteText("Dynamic Content")
RemoteButton(onClick = { /* action */ }) {
RemoteText("Click Me")
}
}
}


// Пример воспроизведения документа на клиенте
@Composable
fun DynamicScreen(document: CoreDocument) {
RemoteDocumentPlayer(
document = document,
documentWidth = screenWidth,
documentHeight = screenHeight,
modifier = Modifier.fillMaxSize(),
onNamedAction = { name, value, stateUpdater ->
// Обработка именнового действия из документа
when (name) {
"addToCart" -> cartManager.addItem(value)
"navigate" -> navController.navigate(value)
"trackEvent" -> analytics.logEvent(value)
}
},
bitmapLoader = rememberBitmapLoader() // Для загрузки картинок
)
}


Источник тут

#jetpack #android #compose #serverdrivenui #sdui #bdui
Please open Telegram to view this post
VIEW IN TELEGRAM
🤯32👍8🔥2🤔1
⚙️ Вышел Jetpack Compose 1.10.0

👉 Стабильное API Shared Transition
👉 Оптимизированный скролл
👉 Новые подходы к сохранению данных при пересоздании Activity через ViewModel
🚀 Повышена производительность UI на Compose
🛠 Исправлено багов и шероховатостей

Изменений действительно много — в один пост всё не поместить.

Буду разбирать ключевые обновления по отдельности в следующих публикациях на @compose_broadcast

#compose #android
Please open Telegram to view this post
VIEW IN TELEGRAM
21👍3
🎭 Динамическое управление shared element анимациями в Compose

В Compose 1.10.0 вы можете динамически включать и отключать анимации shared element в зависимости от условий навигации или состояния UI. Это особенно полезно, когда нужно анимировать переход только в определенных сценариях.

Раньше sharedElement() и sharedBounds() автоматически анимировали изменения layout при нахождения совпадению по ключу. Теперь можно контролировать эту анимацию через конфигурацию SharedContentConfig.


// отим анимировать переход только с экрана A на экран B, но не обратно
SharedTransitionLayout {
val transition = updateTransition(currentState)

transition.AnimatedContent { targetState ->
// Конфигурация, зависящая от состояния
fun animationConfig(): SharedTransitionScope.SharedContentConfig {
return object : SharedTransitionScope.SharedContentConfig {
override val SharedTransitionScope.SharedContentState.isEnabled: Boolean
get() = transition.currentState == "A" &&
transition.targetState == "B"
}
}

...
}
}


⚠️ Важно: По умолчанию, если shared element отключается во время анимации, текущая анимация завершается до удаления элемента. Это предотвращает резкие обрывы.

Новая фича даёт разработчикам больше контроля над анимациями, делая интерфейсы более предсказуемыми и оптимизированными.

#Compose #AndroidDev #Анимация #UI
👍9
⚙️ Создание кастомного Toolbar в Jetpack Compose: от проблемы к решению

Разработчик из ПСБ поделился опытом создания кастомного Toolbar в Compose. Основная задача — правильное центрирование заголовка и подзаголовка при динамическом контенте слева и справа (иконки, текст переменной длины).

Решения "в лоб" не сработали:
- Row с Weight приводит к лишним рекомпозициям
- Ручной расчет ширины текста — непредсказуемо и сложно
- Проблема в разных фазах измерения Compose

Решением стал кастомный Layout. Вместо стандартных компоновок используется Layout, который измеряет все элементы за один проход.

#Compose #Android #UI
Please open Telegram to view this post
VIEW IN TELEGRAM
👍14🤔3