Введение в Jetpack Compose

Jetpack Compose — это современный набор инструментов пользовательского интерфейса, недавно выпущенный Google, который используется для создания собственного пользовательского интерфейса Android. Он упрощает и ускоряет разработку пользовательского интерфейса за счет меньшего количества кода, API-интерфейсов Kotlin и мощных инструментов.

Jetpack compose дает нам возможность создать другой пользовательский интерфейс, который называется Declarative Framework , и сделать эту транзакцию нативной.

Вы могли видеть, что коды, которые были написаны с помощью Flutter и React Native, сделали пользовательский интерфейс, и теперь вы можете делать все это с помощью Jetpack Compose.

Примечание . Jetpack Compose был выпущен в марте 2021 года. Вам потребуется Android Studio Artic Fox , чтобы использовать Compose , который работает как минимум с SDK 21 .

Почему мы должны использовать Jetpack Compose?

• Декларативный: он полностью декларативен, так что вы можете описать свои компоненты пользовательского интерфейса, вызвав некоторые предопределенные функции.
• Совместимость: он легко совместим с существующими представлениями, присутствующими в Android.
• Увеличение скорости разработки: раньше разработчикам приходилось работать с XML-файлом и файлом Kotlin. Но с помощью компоновки реактивного ранца это становится проще, и разработчикам нужно работать только с файлами Kotlin, поэтому это поможет разработчикам увеличить скорость разработки.
• Краткий и идиоматический Kotlin: Jetpack Compose создал пользовательский интерфейс с преимуществами, которые дает Kotlin.
• Простота обслуживания: так как кодовая база любого приложения находится в одном файле. Становится легко управлять кодовой базой приложения.
• Написано на Kotlin: приложение, написанное с использованием компоновки джетпака, использует 100% языка программирования Kotlin.

С новой функцией Compose вы можете просматривать выходные данные без эмулятора.

Создайте проект, выбрав новое пустое действие Compose, и изучите основную структуру Jetpack Compose.

Когда мы выбираем Empty Compose Activity, класс MainActivity будет выглядеть так, как показано ниже.

Первое, что вы заметите, это то, что основная активность была унаследована от ComponentActivity , а не от AppCompatActivity.

Перейдите к градиенту, с помощью Jetpack Compose вы увидите, что поле было добавлено, как показано ниже.

Если открыть проект как EmptyActivity, вам необходимо добавить зависимости, как показано ниже.

Мы сказали, что вы можете увидеть дизайн без сборки в среде выполнения.

Когда мы выбираем Split view, мы можем видеть предварительный просмотр кодов Kotlin, которые мы пишем.

Аннотации @Preview: вы можете добавить параметры вручную в свой код, чтобы настроить способ отображения аннотаций предварительного просмотра в Android Studio.

В то же время мы хотим видеть весь экран или элемент, мы можем добавить элементы под аннотацией.

Составные функции — это основные строительные блоки приложения, созданного с помощью Compose.
Composable может применяться к функции или лямбде, чтобы указать, что функция/лямбда может использоваться как часть композиции для описания преобразования данных приложения в дерево или иерархию.

Приведенный ниже код делает объект TextView, который находится в xml, компонуемым.

Текстовый класс является компонуемым классом, который получает слишком много параметров.

Если мы начинаем обычную активность, мы даем один макет внутри setContentView, но теперь для компоновки мы используем setContent .

В классе setContent вы можете видеть, что он требует от нас компонуемых параметров, написанных, как показано ниже.

Приветствие — это сочинение. Мы можем передать эту композицию внутри setContent при открытии приложения.

Какие простые функции мы узнали в этой статье на данный момент?

• Составная функция: составная функция представлена ​​в коде с помощью аннотации @Composable к имени функции. Эта функция позволит вам программно определить пользовательский интерфейс вашего приложения, описав его форму и зависимости данных, а не сосредотачиваясь на процессе создания пользовательского интерфейса.
• Функция предварительного просмотра: само название функции говорит нам о том, что функция используется для создания предварительного просмотра составной функции. Он используется для предварительного просмотра наших составных функций в нашей среде IDE, а не для установки нашего APK в эмуляторе или виртуальном устройстве.

Если вы заинтересованы в SwitfUI в iOS, я рекомендую вам ознакомиться со статьей Пинара Кочака .

Ресурсы