Урок 4: Верстаем экран по макету из Figma, ShapeDrawable | Курс Android на Kotlin c нуля
📕 Личный телеграм канал про путь разработчика:
🔹 Обучающий бот по Android c Android-ROADMAP
🔹 Дизайн-макет для EnglishWordsApp в Figma:
⚙️ КОД из всех видео на YouTube здесь:
🔹 Бесплатный курс по основам Kotlin:
Приступим к полноценной верстке первого экрана приложения для изучения иностранных слов. У меня есть дизайн-макет в Figma - наиболее распространенным инструментов на сегодняшний день для создания дизайна. Проведу по нему краткий обзор и покажу как пользоваться основными функциями, которые нужны нам, как разработчикам.
Из основного это: экспорт графики (иконок/изображений из Фигмы), просмотров размеров элементов и отступов, просмотр цветовой палитры, просмотр шрифтов и размеров текстов.
Далее приступим к верстке элементов. Использовать будем распространенные вью, такие как: Button, ImageButton, ImageView и лейауты LinearLayout и ConstraintLayout. Из особенно интересного научимся создавать ShapeDrawable, чтобы придавать контейнерам формы. Например, как в макета, контейнеры с закругленными углами.
00:00 - 01:31 – Что такое Figma (Фигма)?
01:31 - 02:10 – Верстка иконки закрытия
02:10 - 04:30 – Импорт векторной иконки в проект
04:30 - 05:46 – Верстка изучаемого слова
05:46 - 06:07 – Верстка вариантов ответа
06:07 - 07:26 – Вложенные лейауты
07:26 - 08:05 – Стилизация (позиционирование, размер текста и фон)
08:05 - 11:09 – Создание фонов (ShapeDrawable)
11:09 - 12:41 – LinearLayout и layout_gravity
12:41 - 15:14 – Верстка и стилизация футера
15:14 - 16:47 – Элемент иконка “с пальцем вверх“
16:47 - 19:23 – Добавляем Button
#androiddevelopment #mobiledevelopment #андройд
1 view
19
4
7 months ago 00:05:09 1
ИЗО урок 4 класс Мудрость старости
7 months ago 00:03:59 1
НЕ ВОЮЙТЕ С РУССКИМИ ♥ НЕ БУДИТЕ ЛИХО ЗРЯ ♥ ВОЕННЫЕ ПЕСНИ ДЛЯ ДУШИ ♥ RUSSIAN MUSIC HITS WLV