Приложение на Flutter с нуля | ОЧЕНЬ МНОГО ВЕРСТКИ | ПЕРЕСБОРКА #7

Подписывайся на мой: 🕺 Telegram 👨‍💻 GitHub (Куча кода на Dart Flutter) 📸 Instagram Мой курс по Flutter на YouTube: ----------------------------------------------- В этом видео мы будем верстать очень много виджетов и экранов на Flutter. А конкретно - добавим SliverList с карточками избранных рифм. Добавим SliverGrid для показа карточек истории поиска, а так же качественный и понятный интерфейс настроек. В рамках видео мы поговорим о том, как создавать и где хранить библиотеку компонентов в проекте на Flutter. Так же много будем говорить про UI/UX дизайн, пользовательское поведение, декомпозицию виджетов и грамотное составление библиотеки компонентов. А теперь к делу... Погнали смотреть! ----------------------------------------------- Пересборка - это что? Три года назад я решил сделать приложение на flutter для поиска рифм на Flutter. Опубликовал это как Android приложение в GooglePlay (PlayMarket) Этот проект я сделал очень быстро, однако приложение начало обретать успех среди пользователей. В один месяц число загрузок перевалило за 60000 скачиваний. И сейчас, спустя несколько лет, я решил вернуться к этому проекту и переписать его с нуля! В пересборке нас ожидает весь фарш настоящей разработки приложения. От создания проекта до публикации приложения в GooglePlay и AppStore. Контент ожидает быть интересным, ведь помимо обычного создания приложения на камеру я хочу встроить и обучающие моменты. Ну все прямо как в Flutter уроки с нуля до профи для начинающих, только теперь мы пишем приложение реально) ----------------------------------------------- 00:00 - 00:12 Вступление 00:12 - 00:32 Что будет в этом ролике ? Куча верстки! 00:32 - 01:35 Начинаем верстать страницу Избранное 01:35 - 02:12 Учим VsCode исправлять ошибки самостоятельно 02:12 - 03:37 VSCode настройки для проекта 03:37 - 06:07 Верстка страницы Избранное 06:07 - 09:12 Создаем папку виджетов / UI Kit 09:12 - 11:11 Выносим widgets внутри одной feature / UI Kit 11:11 - 12:27 Использование одного виджеты на разных экранах 12:27 - 13:14 Как организовать библиотеку компонентов в проекте ? 13:14 - 15:37 Как кастомизировать общие виджеты ? 15:37 - 16:03 Как ещё улучшить дизайн избранных ? 16:03 - 17:17 Начинаем верстать экран Истории поиска 17:17 - 17:39 Как изменить имя переменной во всех файлах ? 17:39 - 17:49 Меняю название фичи на history 17:49 - 18:16 Вспоминаю как хорошо было в Java 18:16 - 19:17 Завершаем переезд фичи и генерируем AutoRoute 18:17 - 20:00 Верстаем экран истории поиска 20:00 - 20:18 Как экран истории поиска выглядел раньше? 20:18 - 21:07 Придумываем дизайн находу 21:07 - 21:17 Новый покемон SliverGrid 21:17 - 22:19 Что такое SliverGrid ? 22:19 - 23:15 Добавляем SliverGrid на экран Истории поиска 23:15 - 25:09 Адаптируем SliverGrid под экран (childAspectRatio) 25:09 - 30:05 Адаптируем карточки внутри SliverGrid 30:05 - 33:42 Придумываем и верстаем экран настроек 33:42 - 36:19 Работа с Theme textTheme, добавляем стили 36:19 - 36:32 Продумываем карточку для настроек 36:32 - 37:08 CupertinoSwitch 37:08 - 37:58 Верстаем карточку настроек 37:58 - 39:34 Кастомим карточку настроек в отдельном компоненте 39:34 - 40:00 Как запрещать нажатие на кнопки в Flutter 40:00 - 40:45 Добавляем все нужные настройки 40:45 - 41:08 Про App Tracking Transparency 41:08 - 46:47 Продолжаем верстать экран Настроек 46:47 - 48:05 Вечность выбираю подходящую иконку 48:05 - 51:07 Добавляем остающиеся элементы на экран настроек 51:07 - 51:35 Разговоры про психологию цвета 51:35 - 52:54 Делаем не враждебный цвет иконок в настройках 52:54 - 53:22 Проверяем все готовые экраны 53:22 - 55:11 Меняем показ карточки рифмы (Бархатный custom) 55:11 - 55:20 Построение виджетов по условию if 55:20 - 56:49 Каскадное добавление списка в список Flutter (Замена addAll) 56:49 - 57:26 Засовываем Row в другой Row 57:26 - 58:26 Дорабатываем UI карточки рифмы 58:26 - 59:28 Пробую задвигать про UX-дизайн и психологию пользователя 59:28 - 01:00:07 Обновляем дизайн карточки истории 01:00:07 - 01:00:51 Кастим List в Map используя метод asMap 01:00:51 - 01:02:22 Используем StringBuffer для построения строк (Как StringBuilder в Java) 01:02:22 - 01:02:40 Накосячил в логике и исправил 01:02:40 - 01:03:03 Слегка причесываем стиль текста 01:03:03 - 01:03:20 Что мы сделали в видео ? 01:03:20 - 01:03:55 Что будет в следующем выпуске ? #программирование #flutter #войтивайти
Back to Top