Mobile Compose – Telegram
Mobile Compose
2.91K subscribers
135 photos
3 videos
315 links
Твой главный путеводитель в мир Jetpack Compose и Compose Multiplatform.

Android XR: @android_xr
Личный блог: @grigorievdy_blog

Автор: @grigorievdy

Поддержать канал: https://news.1rj.ru/str/mobile_compose?boost
Download Telegram
#Article #Medium #Recomposition

Android Jetpack Compose: Remember Made Easy

Совсем недавно на канале выходил пост о рекомпозиции в Jetpack Compose при помощи mutableStateOf(). В качестве продолжения, в этой статье автор решил рассмотреть другую немаловажную концепцию в работе со State — remember.
#Links #Github #Codelabs #Medium

На данные момент существует большое количество источников, позволяющих детально рассмотреть основные Composable-функции для формирования UI с примерами их использования. Большим плюсом таковых является поддержание актуальности документации и примеров, что весьма немаловажно когда продукт находится в Alpha-статусе.
Решил собрать в рамках одного поста все полезные источники:

▫️ Google codelabs - официальные кодлабы от Google

▫️ Jetpack Compose Playground - отличный источник с большим количеством разделов, гайдов и примеров

▫️ Learn Jetpack Compose By Example - в дополнение к предыдущему, содержит много ответов на часто возникающие вопросы у начинающих.

▫️ Which Compose API to use? - интересный сервис, позволяющий по выбранному компоненту из классического UI-фреймворка получить эквивалентный ему в Jetpack Compose, а также посмотреть примеры его использования

▫️ Jetpack Compose Awesome - как и Playground, содержит в себе много полезных ссылок по Jetpack Compose.

P.S. Если есть интересные источники, которых нет в этом списке, пишите в наш чат-канал😉.
Mobile Compose pinned «#Links #Github #Codelabs #Medium На данные момент существует большое количество источников, позволяющих детально рассмотреть основные Composable-функции для формирования UI с примерами их использования. Большим плюсом таковых является поддержание актуальности…»
#Article #Medium

RecyclerView and LazyColumnFor in Jetpack Compose

Большинство мобильных приложений так или иначе работают со списками данных. В одном из прошлых постов рассказывалось как реализовать Grid-список при помощи LazyGridFor(). На этот раз поговорим о более часто используемом виде списка — линейном, который представлен в Jetpack Compose функциями LazyColumnFor() и LazyRowFor() в зависимости от необходимой ориентации списка. В статье также затрагиваются такие темы как работа с несколькими видами ViewType, а также обработка таких кейсов как ItemDecoration и Workaround.
#Release #Alpha #Changelog

Релиз Jetpack Compose 1.0.0-alpha09

Некоторые из изменений, пришедших с новым минорным обновлением:

▫️LazyColumnFor и LazyRowFor теперь deprecated, вместо них надо использовать LazyColumn и LazyRow
▫️Добавлен LazyVerticalGrid 🔥
▫️В конструктор текстовых полей добавлен параметр InteractionState (для работы с состояниями Dragged, Pressed и Focused)
▫️Modifier.focusObserver теперь deprecated, вместо этого надо использовать Modifier.onFocusChanged или Modifier.onFocusEvent
▫️Modifier.offset теперь возвращает в лямбде IntOffset вместо Float

Также обновление коснулось и дополнений, связанные с навигацией и пагинацией — navigation-compose и paging-compose были обновлены до версии 1.0.0-alpha04.
Изменений на этот раз довольно мало, в основном исправление существующих проблем:

▫️Обновлены свойства CombinedLoadStates.refresh, CombinedLoadStates.prepend и CombinedLoadStates.append применимо к переходу из состояния Loading в состояние NotLoading
▫️По навигации существенных изменений нет

P.S. Также важно, что для перехода на alpha09 необходимо поднять версию Kotlin compiler до 1.4.21. По заявлению разработчиков это последний релиз в уходящем года и новый стоят ожидать уже в январе.
Друзья, у меня есть хорошая новость! Кто еще не в курсе, Александр Горшков (автор канала Android Live) позвал меня в гости на свой Youtube-канал, где мы в прямом эфире напишем небольшое мобильное приложение на Jetpack Compose, а вы сможете задать интересующие вас вопросы.

▫️Что? — На встрече разберем такие аспекты как работа со списком, навигацией, анимацией и много чего еще.
▫️Где? — Youtube-канал Android Live (ссылка появится немного позже)
▫️Когда? — 21 декабря в 18:30 по МСК

#News
#Article #Medium #UI

StaggeredVerticalGrid of Android Jetpack Compose

В предыдущих публикациях мы уже разбирали различные реализации списков в Jetpack Compose (статьи про LazyColumnFor и LazyGridFor). Однако помимо этого, существует еще один вид списка, появляющийся в приложениях реже других, но правильное и уместное использование которого может значительно украсить ваше приложение. И имя этому списку — StaggeredVerticalGrid. Автор статьи предлагает свою реализацию этого компонента с примером использования и описанием внутреннего устройства. Весьма неплохое решение пока не появился официальный компонент в foundation-библиотеке.
#Article #Medium #Navigation

Passing string typed data with Jetpack Compose navigation component

В одном из предыдущих постов публиковалась статья о том, как добавить навигацию между вкладками вашего приложения используя compose-navigation. Однако мало какая навигация обходится без передачи между экранами дополнительных параметров. В Jetpack Compose все такие объекты по-умолчанию String-типа. В статье описывается как передавать и получать объекты такого типа между экранами.
#Article #Medium

Passing multi typed data between screens with Jetpack Compose navigation component.

Третья и последняя статья из серии, посвященной навигации в Jetpack Compose. Как уже известно, все объекты, которые можно передать между экранами, по-умолчанию являются String-типа. Однако, зачастую, нам необходимо передать объект другого примитивного типа (передача Parcelable в данный момент недоступна) и именно о том, как правильно это сделать, рассказывает автор данного материала.
​​Друзья, вот и заканчивается 2020 год.🎄 Это был год действительно больших перемен для многих из нас. Работа, различные мероприятия, да и простое общение с теми кто близок — всё перешло в режим online, к чему мы все (не сразу, конечно) адаптировались. Что же касается IT-индустрии, то она всё так же стремительно развивается, а значит в грядущем, 2021 году, всё у нас будет хорошо.👍

За почти три месяца существования канала нас уже почти 400 человек, и я уверен, что это далеко не предел, за что вам, друзья, большое спасибо. Ведь именно вместе мы участвуем в формировании Jetpack Compose сообщества в русскоязычном пространстве.💪

Желаю вам как следует отдохнуть на новогодних праздниках и с новыми силами вернуться уже в наступившем году. Ну и ждём релиза Beta (а быть может и Stable) версии JC в 2021 году 🙂

@Composable
fun Greeting(year: Int) {
Text(text = "С наступающим $year годом!")
}
#Article #Medium #DesignSystem

Building a Design System implementation using Jetpack Compose — Part2 (Component)

Вторая часть статьи о построении дизайн-системы в вашем приложении, используя декларативный подход. Кто не видел первую часть — она тут.

P.S. Также в подборку полезных материалов от Jetpack Compose добавил еще один ресурс — Jetpack Compose Awesome.
#Article #Medium #Architecture

Android Jetpack Compose — Create a Component-Based Architecture

Архитектура - один из важнейших аспектов разработки качественного мобильного приложения. Уделив должное внимание качеству кода, масштабируемости системы, а также выбору надежных технологий, можно избежать большинства проблем в будущем. В статье рассматривается вариант создания приложения при помощи Jetpack Compose и компонентной архитектуры, с выделением самостоятельных переиспользуемых компонентов, называемых UIComponents.
#Release #Alpha #Changelog

Релиз Jetpack Compose 1.0.0-alpha10

Некоторые из изменений, пришедших с новым обновлением:

▫️Добавлен экспериментальный метод stickyHeader для списков LazyColumn и LazyRow
▫️FlowRow и FlowRow теперь deprecated
▫️В конструктор текстовых полей добавлены параметры enabled и readOnly для реализации “неактивного” поля
▫️TestUiDispatcher теперь deprecated, вместо этого использовать Dispatchers.Main
▫️Метод animate() заменён на animateAsState(), который теперь возвращает State<T> вместо T

Также обновление коснулось и дополнений, связанные с навигацией и пагинацией — navigation-compose и paging-compose были обновлены до версии 1.0.0-alpha05, однако существенных изменений в новых версиях библиотек нет.
#Article #Medium #UI

Expandable lists in Jetpack Compose

Интересная статья, в которой автор рассказывает как можно реализовать двухуровневый список, в котором каждый элемент при нажатии раскрывается и отображает собственный вложенный список. Всё это работает через ViewModel и StateFlow, а также украшено интересной анимацией сворачивания/разворачивания карточки.
#Article #Medium

How to Handle User Interactions With Component-Based Architecture and Jetpack Compose

Недавно здесь был пост со статьей про компонентную архитектуру, основной идеей которой является выделение самостоятельных переиспользуемых компонентов, называемых UIComponents. Однако такой подход имеет один минус - любой UIComponent в чистом виде является статичным и не способен обрабатывать действия пользователя (например, клик). В качестве решения этой проблемы автор предлагает использовать интерфейс UIDelegate. Подробнее в сегодняшнем материале.
#Article #Medium

Infinite Lists With Paging 3 in Jetpack Compose

Пагинация является важным элементом мобильного приложения, когда дело касается работы с различными списками данных. Она позоляет создать эффект “бесконечного списка”, благодаря своевременной подгрузке данных с источника. В Jetpack Compose для этих целей даже существует специальное дополнение — paging-compose. О том, как правильно реализовать “бесконечный список” при помощи paging-compose и рассказывает автор в сегодняшней статье.
#Article #Medium #Navigation

Android Then and Now: Navigation

Новая статья из серии сравнений различных компонентов Android-разработки "Тогда и Сейчас". На этот раз автор разбирает как изменилась навигационная архитектура мобильных приложений, Среди прочего, автор рассматривает и Single-View подход, который активно используется в Jetpack Compose.
#Release #Alpha #Changelog

Релиз Jetpack Compose 1.0.0-alpha11

Некоторые из изменений, пришедших с новым большим обновлением:

▫️Переходы (transitions), основанные на transitionDefinition<>, теперь deprecated.
▫️Метод animateAsState() заменён на более конкретные методы animateFloatAsState(), animateDpAsState(), animateOffsetAsState() и т.д.
▫️Методы items(items: List) and itemsIndexed(items: List) для списков теперь являются extension-функциями, поэтому после миграции на alpha11 придётся их импортировать вручную.
▫️В конструктор Image и Icon добавлен обязательный параметр contentDenoscription.
▫️ScrollableColumn/Row теперь deprecated. Вместо них рекомендуется использовать LazyColumn и LazyRow.
▫️WithConstraints переименован в BoxWithConstraints и перемещён в пакет foundation.layout.
▫️У BasicTextField появился параметр decorationBox, который позволяет добавить различные декорации к текстовому полю (такие как иконка, заголовок, плейсхолдер и т.д.).
▫️Surface теперь может иметь несколько вложенных потомков.

Также обновление коснулось и дополнений, связанные с навигацией и пагинацией — navigation-compose и paging-compose были обновлены до версии 1.0.0-alpha06.
Изменений на этот раз довольно мало, в основном исправление существующих проблем:

▫️По пагинации существенных изменений нет.
▫️Для NavController добавлен extension-метод getBackStackEntry(route: String).

P.S. Также важно, что для перехода на alpha11 необходимо поднять версию Kotlin compiler до 1.4.21-2.
P.S.S. Мы преодолели отметку в 400! Спасибо всем, двигаемся дальше.
1
#Article #Medium

Jetpack Compose Image Content ScaleType Fully Illustrated

При работе с изображением нередко встает вопрос о его размещении внутри какой-либо другой формы. В традиционном Android UI-фреймворке мы имеем параметр android:scaleType, предлагающий различные режимы масштабирования, которые можно применить к изображению в зависимости от размера представления, в которое оно будет помещено. В Jetpack Compose для решения этого вопроса используются сразу два параметра — alignment и contentScale. Подробнее о том, в каких случаях нужно использовать те или иные значения параметров, автор рассказывает в сегодняшней статье.
#Release #Alpha #Changelog

Релиз Jetpack Compose 1.0.0-alpha12

Некоторые из изменений, пришедших с новым обновлением:

▫️AnimatedValue/Float теперь deprecated. Вместо этого теперь стоит использовать Animatable. (Подробнее)
▫️Для LazyColumn/LazyRow добавлены настраиваемые ключи для более эффективной работы с изменяемыми данными списка. (Подробнее)
▫️tapGestureFilter, doubleTapGestureFilter, longPressGestureFilter и pressIndicaitonGestureFilter теперь deprecated. Доступ к жестам можно теперь получить при помощи Modifier.pointerInput и функции detectTapGestures. (Подробнее)
▫️ConstraintLayout вынесли в отдельное API, которое теперь нужно подключать отдельно к проекту. (Подробнее)
▫️Для Tab и BottomNavigationItem добавлен параметр enabled для обработки случая, когда компонент не должен реагировать на нажатия. (Подробнее)
▫️Блок ComponentActivity.setContent перенесен из пакета androidx.compose.ui.platform в androidx.activity.compose. (Подробнее)

Обновление коснулось и дополнений, связанные с навигацией и пагинацией — navigation-compose и paging-compose были обновлены до версии 1.0.0-alpha07.
Помимо этого, было добавлено еще дополнение для работы с ViewModel — lifecycle-viewmodel-compose
Некоторые из изменений, коснувшихся дополнений:

▫️navigation-compose теперь зависит от lifecycle-viewmodel-compose для обеспечения поддержки viewModel() composable-destinations. (Подробнее)
▫️NavHost теперь использует LocalOnBackPressedDispatcherOwner из зависимости Activity-Compose для получения OnBackPressedDispatcher. (Подробнее)

P.S. Также важно, что для перехода на alpha12 необходимо поднять версию Kotlin compiler до 1.4.30, а также подключить зависимость androidx.activity:activity-compose:1.3.0-alpha02.
​​Друзья! В последней публикации о новом релизе я решил добавить ссылки на PR в AOSP для каждого описанного изменения. Это может быть полезно тем, кто хочет воочию разобраться с тем, как то или иное изменение было реализовано. Как вам такая идея? Продолжать это в последующих релизах или оставить лишь краткое описание (как было раньше)?