Приложение на Flutter с нуля | BottomSheet, TextField | ПЕРЕСБОРКА #8

Подписывайся на мой: 🕺 Telegram 👨‍💻 GitHub (Куча кода на Dart Flutter) 📸 Instagram Мой курс по Flutter на YouTube: Код из видео: ----------------------------------------------- В этом видео мы закончим с версткой приложения, а именно сверстаем модальный экран с поиском рифм. В рамках его реализации познакомимся с BottomSheet (Это мой любимый виджет в мобильном дизайне) и TextField - формой ввода текста в Flutter. Это последнее видео про верстку, оно хоть и горячее как куриный бульен из микроволновки, но дальше начнется совсем жара) А теперь к делу... Погнали смотреть! ----------------------------------------------- Пересборка - это что? Три года назад я решил сделать приложение для поиска рифм на Flutter. Опубликовал это как Android приложение в GooglePlay (PlayMarket) Этот проект я сделал очень быстро, однако приложение начало обретать успех среди пользователей. В один месяц число загрузок перевалило за 60000 скачиваний. И сейчас, спустя несколько лет, я решил вернуться к этому проекту и переписать его с нуля! В пересборке нас ожидает весь фарш настоящей разработки приложения. От создания проекта до публикации приложения в GooglePlay и AppStore. Контент ожидает быть интересным, ведь помимо обычного создания приложения на камеру я хочу встроить и обучающие моменты. Ну все прямо как в Flutter уроки с нуля до профи для начинающих, только теперь мы пишем настоящее приложение) ----------------------------------------------- 00:00 - 00:19 Что будет в этом видео ? 00:19 - 00:53 Проект в открытом доступе! 00:53 - 01:23 Обсуждаем дизайн поиска рифм 01:23 - 01:31 Что такое BottomSheet в Flutter ? 01:31 - 02:03 Делаем кнопку поиска 02:03 - 02:29 Что такое GestureDetector ? 02:29 - 03:10 Метод для показа showBottomSheet 03:10 - 04:21 Кастомизируем BottomSheet 04:21 - 05:05 Почему он такой маленький ? 05:05 - 05:32 Метод showModalBottomSheet на весь экран 05:32 - 06:06 Увеличиваем высоту BottomSheet 06:06 - 06:18 Как перекрыть весь экран BottomSheet’ом 06:18 - 06:48 Параметр isScrollControled у BottomSheet 06:48 -07:08 Как добавить отступы BottomSheet ? 07:08 - 08:15 Отступы BottomSheet через MediaQuery (Плохой быстрый вариант) 08:15 - 09:07 BottomSheet полная кастомизация (Вариант получше) 09:07 - 10:05 Делаем borderRadius BottomSheet (скругление) 10:05 - 10:34 Сделали отступы 10:34 - 10:57 Сравнение двух вариантов 10:57 - 11:44 Делаем общий компонент для BottomSheet 11:44 - 12:07 Начинаем делать поиск 12:07 - 12:51 Что такое TextField и как всунуть его в Row 12:51 - 14:15 Добавляем кнопку поиска 14:15 - 16:10 Делаем TextField красивым 16:10 - 17:33 Про border у TextField 17:33 - 19:14 Дорабатываем размеры 19:14 - 19:34 Добавляем иконку поиска 19:34 - 20:40 Когда можно использовать цвета-константы 20:40 - 22:08 Добавляем hintText для формы ввода 22:08 - 23:46 Почему нужно выносить методы из верстки ? 23:46 - 26:17 Ещё немного про декомпозицию виджетов и структуру проекта 26:17 - 26:45 Верстаем автокомплит список 26:45 - 27:20 Как добавить ListView в Column 27:20 - 27:28 Добавляем разделитель Divider в список 27:28 - 28:13 Добавляем ListTile в 28:13 - 28:53 Исправили ошибку размеров 28:53 - 30:50 Делаем список красивым 30:50 - 31:17 Меняем цвет Divider для всего приложения через theme 31:17 - 32:04 Словили баг Flutter’a 32:04 - 32:51 Как будет работать UX автокомплита ? 32:51 - 33:39 Что будет в следующем ролике ? Логика ? #программирование #flutter #войтивайти
Back to Top