Flutter уроки
От идеи до приложения
Данный ресурс посвящен разработке мобильных приложений с помощью Flutter SDK.
Flutter SDK – бесплатное кроссплатформенное средство от Google с открытым исходным кодом для быстрой разработки мобильных приложений для iOS и Android.
С появлением Flutter реализовать свои идеи в виде мобильного приложения стало как никогда просто и доступно.
В наших уроках Вы узнаете про Flutter:
– с чего начать мобильную разработку;
– особенности реализации алгоритмов и структур;
– подходы и методы для решения задач.
Начните сейчас изучать Flutter
Урок 1. Flutter первое приложение Hello
WorldСодержание урока:
1. Создание нового проекта в Android Studio
2. Главная функция main()
3. Функция runApp()
4. Иерархия виджетов
5. Свой «виджет» класс MyBody и горячая перезагрузка
6. Установка и использование пакета url_launcher (открытие ссылок в браузере)
Урок 2. StatelessWidget и StatefulWidgetВсе собственные классы-виджеты рекомендуется создавать от двух основных: StatelessWidget и StatefulWidget.
Отдельные части интерфейса удобно объединять в отдельные виджеты, созданные от этих двух суперклассов, но какой из них использовать – мы рассмотрим в этом уроке.
Урок 3.
ListView бесконечный прокручиваемый списокВиджет-класс ListView позволяет создавать конечные и бесконечные списки виджетов и делает их прокручиваемыми, если они не помещаются на экране или в отведенной для них области.
Под бесконечным списком мы будем понимать список элементов, который пополняется по мере необходимости, в нашем уроке – когда существующие элементы уже отображены. В мобильных приложениях такие списки повсюду: новостные ленты, списки сообщений, фотогалереи и т.п.
Урок 4. Форма
ввода, проверка правильного вводаГлавным контейнером для формы является виджет-класс Form, он позволяет объединить в себе поля ввода. Обращаясь к состоянию формы FormState, можно проверить корректное заполнение полей, сбросить значения по умолчанию и сохранить значения.
Урок 5. Навигация
и маршрутизация в приложении, class NavigatorРедкое приложение может обойтись одним окном или одной страницей.
Во Flutter и то и другое – виджеты. Для переключения между окнами или виджетами нужно использовать Navigator.
Урок 6. Асинхронные методы async и awaitПрограммируя на Flutter невозможно избежать использования асинхронных методов, таких как чтение данных из сети интернет, файлов и баз данных. Работа таких методов выводится в отдельные потоки и не нарушает работы основного потока программы: вычисление и отображение интерфейса. Одним словом, функции которые выполняются относительно долго — должны быть асинхронными.
Урок 7. HTTP и HTTPS, сетевые запросы в Dart и FlutterДля обмена данными между клиентом и сервером в основном используется http протокол или его расширение https для безопасной передачи данных.
В Dart есть одноименный пакет http, подключается он в файле зависимостей и метаданных pubspec.yaml
Электронная книга по Dart и Flutter: Язык программирование Dart 2.x (Базовое руководство)Для того, чтобы писать приложения с помощью Flutter, необходимо разобраться с языком программирования Dart. Сам по себе язык Dart гораздо проще C#Java и тем более С++, я бы сказал это один из самых простых статически типизированных языков программирования на сегодняшний день… В данном руководстве мы максимально быстро разберем базу языка Dart что бы сразу приступить к написанию мобильных (и не только) приложений на платформе Flutter.
Создание мобильных игр при помощи Flutter и Flame для начинающихЗачем создавать свою мобильную игру? Многие люди согласятся, что игры — весьма увлекательное программное обеспечение, в котором можно открыть для себя множество новых миров и реальностей, в которых можно проживать целые жизни. Много зависит от игрового процесса, который может быть как линейным и простым, так и сложным, включающим в себя 3D модели, реалистичную физику движений, графику, генерацию окружающего мира и сюжетные линии, зависящие от выбора игрока. Некоторые из нас же хотят пойти дальше и создать собственные игры, и, если вы один из них, то эта статья станет весьма полезна для вас. Основное внимание в ней будет уделено концепции, а не созданию законченной или готовой к выпуску игры.
Создание казуальной 2D игры. Пошаговая инструкция при помощи Flame и Flutter (часть 1 из 5)Вы когда-нибудь задумывались о разработке видеоигр? Если да, то вы пришли по адресу! Эта статья расскажет и покажет, как создать свою собственную 2D мобильную игру.
Эта статья — продолжение предыдущей, которая является введением в разработку игр для разработчиков любой степени продвинутости. В этой же части мы будем создавать игру в стиле «убить крота».
Она будет называться Langaw (на сленге это означает дом мухи), и ее задача будет состоять в том, чтобы убить как можно больше мух, прежде чем они доберутся до кучки мусора.
Игрок будет контролировать игру простыми нажатиями (не мухобойкой 🙂). Пока что мы не будем использовать какие-либо изображения или графику, и наши мухи будут просто зелеными квадратиками. При нажатии на нее, муха станет красной и опустится в нижнюю часть экрана.
Примеры приложений на Flutter
Flutter Pixel SandИгра с пиксельным песком. Разработана с помощью Google Flutter SDK.
Прокачай акселерометр своего смартфона.
itsallwidgets.com - каталог Flutter приложенийКаталог itsallwidgets.com пополняется разработчиками Flutter приложений. Для добавления в него, любой желающий должен отправить свое приложение на проверку.
Быть в курсе
Новые заметки
Анонс Flutter 1.22
#248 v.2 | Перевод статьи Announcing Flutter 1.22 Поддержка iOS 14 и Android 11, i18n и l10n, готовые плагины Google Maps и WebView, новый инструмент App Size и многое другое! Мы с радостью представляем вам свежую версию Flutter с обширной поддержкой iOS 14 и Andr...Views (экраны) и диалоговые окна — пошаговая инструкцию с Flame и Flutter (часть 3 из 5)
#247 v.4 | Перевод урока Views and Dialog Boxes Tutorial – Step by Step with Flame and Flutter (Part 3 of 5) Когда только начинаешь изучать разработку игр, думаешь, что самое тяжелое — это начать, продумать логику геймплея, найти и создать графику. Но это не так. ...Анимация и графика в играх: пошаговое обучение с Flame и Flutter (часть 2 из 5)
#245 v.3 | Перевод урока Game Graphics and Animation Tutorial – Step by Step with Flame and Flutter (Part 2 of 5) В этой части обучения мы сфокусируемся на добавлении графики и анимации в нашу игру. Мы продолжим с того места, на котором остановились в предыдущей ч...Создание казуальной 2D игры. Пошаговая инструкция при помощи Flame и Flutter (часть 1 из 5)
#242 v.5 | Перевод урока 2D Casual Mobile Game Tutorial – Step by Step with Flame and Flutter (Part 1 of 5) Вы когда-нибудь задумывались о разработке видеоигр? Если да, то вы пришли по адресу! Эта статья расскажет и покажет, как создать свою собственную 2D мобильн...Основы Dart 2.x (Коллекции)
#196 v.5 | Во многих приложениях требуется создавать группы связанных объектов и управлять ими. В языке Dart для этого существуют коллекции.
Коллекции предоставляют более гибкий способ работы с группами объектов. В отличие от массивов которые используются в других...Создание мобильных игр при помощи Flutter и Flame для начинающих
#239 v.6 | Перевод урока Create a Mobile Game with Flutter and Flame – Beginner Tutorial Зачем создавать свою мобильную игру? Многие люди согласятся, что игры — весьма увлекательное программное обеспечение, в котором можно открыть для себя множество новых миров и ...Представляем Вам Flutter 1.17!
#237 v.7 | Перевод статьи Announcing Flutter 1.17 Включает в себя поддержку Metal для более быстрой работы системы iOS, новые компоненты Material, новые программы для мониторинга сети и многое другое! Сегодня мы с радостью представляем Вам Flutter 1.17, наш первый...Представляем Dart 2.8!
#238 v.3 | Перевод статьи Announcing Dart 2.8 Сегодня мы представляем вам новую версию Dart SDK — 2.8! Сообщество Dart растет, и миллионы разработчиков Flutter используют Dart как язык для создания приложений на любой платформе. Мы продолжаем работать над завершен...Электронная книга по Dart и Flutter: Язык программирование Dart 2.x (Базовое руководство)
#222 v.2 | От автора книги:
- Для того, чтобы писать приложения с помощью Flutter, необходимо разобраться с языком программирования Dart. Сам по себе язык Dart гораздо проще C#\Java и тем более С++, я бы сказал это один из самых простых статически типизированных ...Flutter - создание версии приложения с мгновенным запуском для Google Play Маркет
#218 v.4 | Что такое Google Play Instant и с историей развития этого вопроса можно ознакомиться в статье Google Play Instant. Рефакторинг длиною в жизнь.
В этой заметке мы рассмотрим, что нужно изменить в проекте чтобы собрать Flutter приложение с мгновенным запус...Сохранение pdf файла во Flutter web
#213 v.3 | Если кто-то столкнулся с проблемой сохранения бинарных файлов во Flutter web, в том числе PDF файлов, предлагаем наше решение. Для вывода бинарного файла в браузере воспользуемся функцией JavaScript, ее нужно подключить в index.html: function ToFile(arg...Flutter for web - создание веб-приложения
#174 v.5 | Flutter for web Git репозиторий ВНИМАНИЕ: Данная заметка устарела с выходом Flutter >= 1.9
Смотрите: FlutterWeb Урок 1. Введение в разработку на Flutter для Интернета Установка и настройка необходимых пакетов Пакет stagehand - создает новый проект из в...FlutterWeb Урок 1. Введение в разработку на Flutter для Интернета
#205 v.7 | С выходом версии фреймворка Flutter 1.9 у разработчиков приложений появилась возможность создать один Flutter-проект с одной кодовой базой для платформ: Android, iOS и web.
Это позволяет получить почти все плюсы Flutter в любом браузере и на любом устро...RaisedButton class - кнопка Material Design
#68 v.12 | Источник https://docs.flutter.io/flutter/material/RaisedButton-class.html Приподнятая над поверхностью кнопка. Эффект "парящей" кнопки создается за счет глубины теней. При нажатии приподнимается - тень становится больше и более размытой, создавая эффек...Основы Dart 2.x (Классы и объекты)
#183 v.4 | Dart является объектно-ориентированным языком, но в нем присутствуют некоторые отличия данной парадигмы от Java\C#.
Dart нет специальных ключевых слов (public; private; protected) то есть спецификаторов доступа, по этому все идентификаторы «публичны» п...Основы Dart 2.x (Классы и объекты) Часть II
#188 v.4 | Наследование Наследование является одним из фундаментальных атрибутов объектно-ориентированного программирования. Оно позволяет определить дочерний класс, который использует (наследует), расширяет или изменяет возможности родительского класса. Класс, чл...Основы Dart 2.x (Встроенные типы данных)
#182 v.6 | Описание: Dart это объектно-ориентированный статически типизированный язык программирования созданный компанией Google (Dart v1.0 вышел в ноябре 2013 года).
Для примеров можно использовать веб-среду DARTPAD Встроенные типы данных в Dart: • numbers
• str...Список ресурсов по Dart и Flutter
#57 v.7 | Для добавления нового ресурса пришлите ссылку на почту contact@flutter.su Сайты flutter.dev (flutter.io) [En]
dart.dev [En]
Flutter for web [En]
Flutter for desktop [En] Flu...Container class - класс контейнер
#77 v.8 | Наследование: Object > Diagnosticable > DiagnosticableTree > Widget > StatelessWidget > Container Виджет-класс Container сочетает в себе свойства: отображения, позиционирования и размерности. Внутри контейнера можно задать поля padding по отношению к до...Основы Dart 2.x (DartVM, Isolates, Streams)
#199 v.3 | Dart virtual machine Прежде чем говорить о Dart_VM и остальных вещах в данной теме, необходимо понимать что такое процесс операционной системы и как это всё работает, ибо без этих знаний будет сложно разобраться о чем идет речь далее ...
Процесс - это (...
