Циклопедия скорбит по жертвам террористического акта в Крокус-Сити (Красногорск, МО)

Flutter (программное обеспечение)

Материал из Циклопедии
Перейти к навигации Перейти к поиску

 → Flutter (SDK)

программное обеспечение
Flutter
Файл:Google-flutter-logo.png
ТипApplication framework
АвторGoogle
РазработчикGoogle and community
Написана на C, C++, Dart and Skia Graphics Engine[1]
Первый выпускAlpha (v0.0.6) / 28 мая 2017 года; 2496 дней тому назад[2]
Аппаратная платформаDevelopment: Linux, MacOS and Windows, Target: Android, iOS and Google Fuchsia
Последняя версияFlutter 1.0 / 4 декабря 2018 года; 1941 дней тому назад[3]
Тестовая версияRelease Preview 2 (v0.8.2) (28 сентября 2018 года; 2008 дней тому назад[4][5])
Сайтflutter.io

Flutter — это SDK предназначенный для создания высокопроизводительных, высококачественных мобильных приложений для iOS и Android из единой кодовой базы, с открытым исходным кодом, созданный Google.[6] Flutter — решение для разработки кроссплатформенных мобильных приложений. Flutter написан на C, C++, Dart и Skia (движок для 2D-рендеринга). Также Flutter является основой создания приложений для Google Fuchsia.

История[править]

Первая версия Flutter была известна как «Sky» и работала в операционной системе Android. Он был представлен на саммите Dart Developer Summit в 2015 году, с заявленным намерением последовательно отображать 120 кадров в секунду.[7] Во время основного выступления на Google Developer Days в Шанхае Google анонсировала бета-версию — Flutter Release Preview 2, который является последним крупным выпуском до Flutter 1.0.[8] 4 декабря 2018 года на мероприятии Flutter Live была выпущена версия Flutter 1.0, обозначающая первую стабильную версию Framework.[9]

Архитектура[править]

Платформа Flutter организована в виде серии слоев, каждый из которых опирается на предыдущий.

Платформа Flutter состоит из следующих слоев:

  • верхние слои — платформа Dart: Material, Cupertino, Widgets, Rendering, Animation, Painting, Gestures, Foundation;
  • движок Flutter (C++): Skia, Dart, Text;
  • встроенная платформа: Render Surface Setup, Native Plugins, Packaging, Thread Setup, Event Loop Interop.[10]

Платформа Dart[править]

Верхние слои каркаса используются чаще, чем нижние. Библиотеки являются частью базовой платформы Flutter и импортируются с использованием 'package: flutter / <library> .dart'[11].

У данной платформы есть огромное количество библиотек, виджетов (виджеты для работы с ядром, анимацией, UI, виджеты реализующие текущий язык дизайна iOS/Android, локализации и многое другое). На сайте https://docs.flutter.io/index.html представлены все доступные для использования библиотеки. Библиотека Foundation, написанная на Dart, предоставляет базовые классы и функции, которые используются для конструирования приложений с использованием Flutter, таких как API для взаимодействия с движком.[12]

Также Flutter имеет богатое сообщество пакетов с открытым исходным кодом. Вы можете просмотреть эти пакеты на pub.dartlang.org

Цель разработчиков Flutter — помочь вам сделать больше с меньшим количеством кода. Например, слой «Material» создается путем составления основных виджетов из слоя «Widgets», а сам слой «Widgets» создается путем организации объектов более низкого уровня из слоя «Rendering».

Слои предлагают множество вариантов создания приложений. Flutter предоставляет свободу выбора: возможность создавать готовые виджеты, которые предоставляет Flutter, или создавать свои собственные виджеты, используя те же инструменты и методы, которые использовала команда Flutter для создания инфраструктуры. При разработке приложений чувствуются преимущества продуктивности высокоуровневой унифицированной концепции виджетов, не жертвуя возможностью погружения так глубоко, в нижние уровни.

Движок Flutter, написанный в основном на C++, обеспечивает низкоуровневую поддержку рендеринга с использованием графической библиотеки Skia от Google. Кроме того, он взаимодействует с моделью для конкретной платформы SDK, такими как Android и iOS.

Виджеты[править]

Виджеты — это центральная иерархия классов в структуре Flutter. Виджет является неизменным описанием части пользовательского интерфейса. Сами виджеты не имеют изменяемого состояния (все их поля должны быть конечными). Если вы хотите связать изменяемое состояние с виджетом, рассмотрите возможность использования StatefulWidget, который создает объект State (через StatefulWidget.createState) всякий раз, когда он создается и включается в дерево. Данный виджет может быть включен в дерево ноль или более раз. В частности, данный виджет может быть размещен в дереве несколько раз.

Widget({Key key })

Свойство key управляет тем, как один виджет заменяет другой виджет в дереве. Если свойства runtimeType и key двух виджетов имеют оператор ==, соответственно, то новый виджет заменяет старый виджет, обновляя базовый элемент (то есть вызывая Element.update с новым виджетом). В противном случае старый элемент удаляется из дерева, новый виджет преобразуется в элемент, а новый элемент вставляется в дерево.

Основные 3 типа виджетов на которых строится все приложение:

  • StatefulWidget — виджет с изменяемым состоянием. Состояние — это информация, которая может быть прочитана синхронно при построении виджета, и может измениться в течение времени жизни виджета. Чтобы уведомить об изменении состояния виджета — необходимо задать State.setState. Пример:

<syntaxhighlight lang="с"> class YellowBird extends StatefulWidget {

 const YellowBird({ Key key }) : super(key: key);
 @override  _YellowBirdState createState() =>
 _YellowBirdState();

}

class _YellowBirdState extends State<YellowBird> {

 @override  Widget build(BuildContext context) {
   return Container(color: const Color(0xFFFFE306));
 }

}</syntaxhighlight>

  • StatelessWidget, для виджетов, которые всегда строятся одинаково, учитывая конкретную конфигурацию и окружающее состояние. Пример:

<syntaxhighlight lang="с"> class GreenFrog extends StatelessWidget {

 const GreenFrog({ Key key }) : super(key: key);
 @override  Widget build(BuildContext context) {
   return Container(color: const Color(0xFF2DBD3A));
 }

} </syntaxhighlight>

  • InheritedWidget, для виджетов, которые вводят окружающее состояние, которое может быть прочитано виджетами-потомками (аналог пробрасывания props в ReactNative). Пример:

<syntaxhighlight lang="с">class FrogColor extends InheritedWidget {

 const FrogColor({
   Key key,
   @required this.color,
   @required Widget child,
 }) : assert(color != null),
   assert(child != null),
   super(key: key, child: child);
 
 final Color color;
 static FrogColor of(BuildContext context) {
   return context.inheritFromWidgetOfExactType(FrogColor);
 }
 @override  bool updateShouldNotify(FrogColor old) => color != old.color;

}</syntaxhighlight>

UI — тоже код![править]

Для любых UI-элементов есть свой виджет.

Пример простого приложения:

<syntaxhighlight lang="с">import 'package:flutter/material.dart';

void main() {

 runApp(
   Center(
   child:
     Text('Hello, world!', textDirection: TextDirection.ltr,
     ),
   ),
 );

} </syntaxhighlight> Больше информации об использовании данных виджетов в официальной документации.

Hot-reload[править]

Примечательной особенностью платформы Dart является её поддержка «Hot-reload», при которой изменения в исходных файлах могут быть внедрены в работающее приложение. Flutter расширяет это, поддерживая горячую перезагрузку с сохранением состояния, где в большинстве случаев изменения в исходном коде могут быть немедленно отражены в работающем приложении, не требуя перезапуска или потери состояния.[13] Эта функция, реализованная во Flutter, получила широкое признание.

Источники[править]

  1. FAQ - Flutter. Проверено 8 августа 2018.
  2. Chris Bracken Release v0.0.6: Rev alpha branch version to 0.0.6, flutter 0.0.26 (#10010) · flutter/flutter. Проверено 8 августа 2018.
  3. Google Developers Flutter 1.0: Google's Portable UI Toolkit. Google Developers (2018-12-04). Проверено 4 декабря 2018.
  4. https://developers.googleblog.com/2018/09/flutter-release-preview-2-pixel-perfect.html
  5. https://github.com/flutter/flutter/wiki/Changelog
  6. Technical Overview. Flutter.
  7. Amadeo, Ron Google's Dart language on Android aims for Java-free, 120 FPS apps. Ars Technica (1 May 2015).
  8. Google Announced Flutter Release Preview 2. Apptunix. Архивировано из первоисточника 25 сентября 2018.[недоступная ссылка] Проверено 10 декабря 2018.
  9. Flutter 1.0: Google’s Portable UI Toolkit. Google Developers.
  10. Layer cakes are delicious. Flutter.
  11. Flutter SDK. Flutter.
  12. foundation library - Dart API (англ.). Проверено 13 декабря 2017.
  13. Lelel, Wm Why Flutter Uses Dart (26 February 2018). Проверено 5 декабря 2018.