Compose Broadcast
5.42K subscribers
305 photos
84 videos
508 links
Все о Jetpack Compose и Compose Multiplatform

YouTubе канал: https://youtube.com/androidBroadcast
Android - @android_broadcast
iOS - @ios_broadcast
Kotlin - @kotlin_broadcast
Download Telegram
Forwarded from Android Broadcast
🎉 Jetpack Navigation 3 - навигация для Compose, написанная с нуля!

Будем честны Jetpack Navigation for Compose было никаким решением, до того как в ней появилась типобезопасная навигация, но и тогда остается много вопросов. Google решила что пора написать настоящую навигацию для Compose. Знакомьтесь - Jetpack Nav 3

Ключевые идеи в новой библиотеки: декларативное объявление + "навигация как состояние". Это полностью повторяет идеи что я заложил в NavState. Все это вылилось в принципы:
👉 Разработчик управляет back stack
👉 Возможность расширения и реализации собственной навигации на базовых компонентах
👉 Анимации из коробки
👉 Поддержка Predictive Back
👉 Поддержка адаптивных layout
👉 Сохранения состояния каждого элемент back stack, включая ViewModel
👉 Поддержка многомодульности

Пока представлена только первая альфа и библиотеки еще предстоит путь, как минимум обзавестись поддержкой KMP

🔗 Больше подробности в документации
🐱 Примеры использования на GitHub

#jetpack #compose #навигация
Please open Telegram to view this post
VIEW IN TELEGRAM
1🔥43👍91
⚙️ Вышел 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
⚙️ Вышел Compose Multiplatform 1.8.1

Что нового
👉 Compose библиотека с ресурсами теперь может быть собрана как XCFramework (нужен Kotlin 2.2+)
👉 Теперь можно изменить имя генерируемого класса для Compose Resources (Res->)
🛠 Исправление багов

#compose #composemp
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥22
Forwarded from Android Broadcast
⚙️ Как растет производительность Jetpack Compose

Google показала как они снизили лаги UI на Jetpack Compose за 2 года. Тесте проводились на Pixel 3a

В Compose 1.9.0 появятся еще улучшения:
🚀 Приостановка композции
🚀 Фоновая подготовка текста для отображения
🚀 Улучшения предзагрузки в LazyLayout

#compose #производительность
Please open Telegram to view this post
VIEW IN TELEGRAM
2🔥48👍7
⚙️ 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
Forwarded from Android Broadcast
This media is not supported in your browser
VIEW IN TELEGRAM
🔨 Compose превью теперь может быстро менять размеры. Это изменение в Android Studio Narwhal FD позволит проще проверять адаптивность UI, за что так топит Google

#androidstudio #compose
Please open Telegram to view this post
VIEW IN TELEGRAM
👍59🔥32
This media is not supported in your browser
VIEW IN TELEGRAM
Kotlin Playground позволяет писать код с Compose Multiplatform и сразу его проверить (используется Compose Web)

#compose #composemp #web
🤯76🔥41
⚙️ Развеиваем мифы о Stability в Compose: оптимизации Strong Skipping (9м)

Интересная статья с экспериментов как происходит рекомпозиция в зависимости от параметров. влияние лямбд и strong skipping режима работы компилятора.

По итогу автор выводит ряд рекомендаций (зайдите поставьте лайк на Хабре за статью):
1️⃣ Compose стал более агрессивно оптимизировать пропуск Composable функций, когда параметры не изменились.
2️⃣ Акцент в отдладке Compose сдвигается от метрик и отчетов к отладке на основе LayoutInspector и других инструментов, потому что метрики и отчеты говорят слишком мало о реальной производительности компонентов.
3️⃣ Чтобы обновить UI, используя нестабильные аргументы, нужно создать новый инстанс такого аргумента в памяти, и метод copy дата-классов для этого отлично подходит.
4️⃣ При работе с коллекциями для оптимизации рекомпозиций больше не нужно использовать Immutable Collections, однако придется обновлять их с созданием нового инстанса. Альтернатива использовать - SnapshotStateList.
5️⃣ При работе с лямбдами для максимальной производительности нужно захватывать только те объекты, которые действительно нужны: если нужно только одно поле класса, лучше прочитать поле в отдельную переменную и сослаться на нее.

🐱 Код из статьи есть на GitHub

#compose #производительность
Please open Telegram to view this post
VIEW IN TELEGRAM
👍279👏2🤯1
⚙️ Создание кастомного тултипа с Jetpack Compose (11м)

Пример реализации виджета тултипа, который должен уметь:
👉 Показываться под якорным элементом в виде облачка
👉 Скрываться согласно нашей кастомной логике
👉 Добавляться в существующие экраны с минимальными затратами
👉 Не блокировать взаимодействие с остальным UI

#compose
Please open Telegram to view this post
VIEW IN TELEGRAM
👍51
⚙️ Оптимизация Composable функции в с помощью спец. аннотаций `@ReadOnlyComposable`, `@NonRestartableComposable` и `@NonSkippableComposable`, которые дают Compose компилятору гарантии на основе которых упрощается генерируемый код, что позволит работать быстрее.

Очень подробный разбор в статье (EN) Материал обязателен тем кто пишет свой UI Kit или много собственных компонентов на Compose

#compose #производительность
Please open Telegram to view this post
VIEW IN TELEGRAM
👍28
⚙️ Rippler - опен-сорс библиотека для создания нативного для платформы и одинакого на всех версиях ОС эффекта нажатия в Compose Multiplatform.

Почему важно применить? Да потому что в Compose MP по умолчанию используется эффект в лоб от Material, да еще и не в лучшей реализации.

Подробнее про реализацию можно почитать в статье (7м)

#compose #пример
Please open Telegram to view this post
VIEW IN TELEGRAM
👍312
This media is not supported in your browser
VIEW IN TELEGRAM
Руководство по созданию анимации границы-муравьев на Compose через Node API

#compose
👍37
⚙️ В Compose 1.9.0 появится возможность кастомиризровать тени

Новая возможность появилась в Compose 1.9.0-alpha04. В release notes рассказывают про "новый кастомизируемый фреймвор теней" 🤯

@Composable
fun DropShadowSample() {
Box(Modifier.size(100.dp, 100.dp)
.dropShadow(RectangleShape, DropShadow(12.dp)))
}

@Composable
fun InnerShadowSample() {
Box(Modifier.size(100.dp, 100.dp)
.innerShadow(RectangleShape, InnerShadow(12.dp)))
}


#compose
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥72👍8🤯5
⚙️ Вышел Jetpack Compose 1.9.0-alpha04

Самый просто способ обновиться - использовать свейжи BOM файл
// Добавляем в зависимости перед добавлением Compose зависимостей
// и лучше версию зависимостей не указывать вовсе, чтобы они всегда из BOM брались
implementation("androidx.compose:compose-bom-alpha:2025.06.00")


#compose
Please open Telegram to view this post
VIEW IN TELEGRAM
👍14
⚙️ LazyLayout стало Stable API в Jetpack Compose 1.9.0-alpha04

#compose
Please open Telegram to view this post
VIEW IN TELEGRAM
👍18
⚙️ API для управления контекстным меню текста сделали публичным в Jetpack Compose 1.9.0-alpha04

@Composable
fun AddComponentsToTextContextMenu() {
val textFieldState = rememberTextFieldState()
BasicTextField(
state = textFieldState,
modifier =
Modifier.addTextContextMenuComponents {
separator()
item(key = ClearKeyDataObject, label = "Clear") {
textFieldState.clearText()
close()
}
separator()
}
)
}


#compose
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥29👏8👍51
⚙️ Для текстовых полей в Compose добавили поддержку умного выделения. Например, при выделения части Url или адреса на карте в тексте, система сама автоматом выделит всё. Уже работает в Compose 1.9.0-alpha04

#compose
Please open Telegram to view this post
VIEW IN TELEGRAM
👍30
🐱 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
30👍9🔥4
Пример реализации подобного эффекта для любого Compose элемента

#compose
👍50🤯37🔥113🤔1
Подборка(10м) основных рекомендаций как писать на Compose, чтобы все юыло красиво и удобно в использовании.

#compose
👍18