предисловие

Прошло уже 9012 лет, мне не нужно больше говорить о том, насколько популярен Flutter, достаточно предыдущего продвижения видеоурока Flutter на домашней странице Nuggets в течение длительного времени, чтобы доказать это.

Точно так же, как вы должны «начать», прежде чем сможете «выйти», вы должны понять Flutter, прежде чем внешний интерфейс убедит Flutter.

Эта статья даст вам представление с точки зрения фронтенда: в чем для фронтенда разница между разработкой Flutter?

...то убедите =_=. [Если вы хотите, чтобы вас убедили напрямую, пролистайте до конца]

Что такое флаттер

Во-первых, что такое флаттер?

Официальное объяснение сайта:

Flutter — это SDK Google с открытым исходным кодом, с помощью которого можно создавать высокопроизводительные приложения для мобильных устройств, Интернета и компьютеров на разных платформах.

Конечно, конечно, хотя его можно разработать в Интернете и на рабочем столе, мы будем болееОсновное внимание уделяется возможностям мобильной кроссплатформенной разработки Flutter.

Ну, до флаттера было на самом деле много фреймворков для кроссплатформенной разработки, известные из нихXamarin на C#, нативскрипт на js, weex на али и нативные реакции, с которыми все знакомы, Тогда есть более известные имена.

Итак, чем же выделяется Flutter среди множества кроссплатформенных фреймворков для разработки?

Зачем использовать флаттер?

1. Низкий вход и высокий выход
   Набор кода, который непосредственно производит приложения для двух платформ Android + iOS. Это общее преимущество кроссплатформенных фреймворков разработки, не более того.
2. Эффективное развитие

Благодаря функции мгновенной компиляции Flutter JIT (Just In Time) он может обеспечить функцию горячей перезагрузки и быстро разрабатывать приложения. Студенты, изучающие интерфейс, должны иметь глубокое понимание эффективности разработки Hot Reload. 3. Богатый и элегантный пользовательский интерфейс
Сам фреймворк предоставляет компоненты пользовательского интерфейса в двух стилях Material Design и Cupertino и не ограничивается ограничениями OEM самой системы.
4. Высокопроизводительные приложения
Такая же производительность, как родная. AOT Flutter компилирует код в двоичный файл ARM и использует собственный механизм саморисования (Skia) без зависимостей Bridge и может напрямую обращаться к базовым службам системы. Благодаря этому Flutter работает так же хорошо, как нативные приложения.

Вышеупомянутое второе, что самое главное?

У Флаттера хороший "отец"!

Давайте подумаем об этом, текущие три основных интерфейсных фреймворка, React и React Native, взяты из Facebook, angular — из Google, и только vue не имеет большого опыта работы в компании. На самом деле, многие фреймворки с открытым исходным кодом в сообществе на самом деле вынашиваются внутри крупных предприятий.

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

Это, я такая крутая, мне было тяжело.

Ближе к делу здесь упоминается, что флаттер не ограничивается OEM-производителями систем и обеспечивает лучшую производительность, чем другие кросс-платформенные фреймворки, так чем же флаттер так хорош? Мы можем изучить его из структуры структуры флаттера.

Фреймворк флаттера

Каркасная структура флаттера выглядит следующим образом:

Ну, я думаю, вы видели эту картину не раз. Те, кто понимает, возможно, уже знают об этом, а те, кто не понимает, могут все еще быть в замешательстве.

Вот это просто

Сверху донизу, Первый это Framework, Framework написан на языке дартс, сверху вниз,

1. Существуют упакованные компоненты пользовательского интерфейса Material и Cupertino [эквивалент интерфейсных фреймворков пользовательского интерфейса, таких как Ant-Design / Element / iview]
2. Упакованные компоненты пользовательского интерфейса Material и Cupertino собраны из более простых компонентов Widget. [Здесь виджет эквивалентен интерфейсному HTML div, h1, span и другим элементам тега]
3. Продолжая вниз, слой виджета представляет собой объект, состоящий из анимации (анимации), рисования (рисунка) и жеста (жеста) посредством рендеринга. [Это немного отличается от внешнего интерфейса, структуры внешнего интерфейса (html), стиля (CSS) и взаимодействия событий (JS отдельные, а во Flutter все они — виджеты)

Под фреймворком находится движок.Взаимодействия с пользовательским интерфейсом в фреймворке отрисовываются и рендерятся движком. Внутри слоя Engine компоненты пользовательского интерфейса отрисовываются с помощью графического движка Skia.SkiaЭто 2D-графический движок Google с открытым исходным кодом, подходящий для многоплатформенных систем, который также является одним из основных элементов кроссплатформенности флаттера. Вот почему ранее было сказано, что флаттер можетОтсутствие ограничений на OEM-компоненты системы. То есть, если вы хотите самостоятельно инкапсулировать флаттер-фреймворк пользовательского интерфейса в стиле муравьиного дизайна, вы можете создать свой собственный UI-фреймворк непосредственно через базовый виджет. Если базовый базовый пользовательский интерфейс не соответствует вашим потребностям. Вы можете напрямую использовать dart для вызова API движка изображений Skia и рисовать свой собственный пользовательский интерфейс без каких-либо ограничений.

Наконец, есть встроенный, встроенный уровень, который имеет дело с различиями платформ, так что флаттер-приложения могут быть встроены в различные системные платформы.

Можно видеть, что Flutter не использует OEM в собственной системе, а использует движок 2D-рендеринга skia для прямой визуализации и рисования пользовательского интерфейса, что делает его уровень, связанный с платформой, очень низким.Платформа предоставляет только холст, и все остальная логика, связанная с рендерингом, находится внутри Flutter., что обеспечивает хорошую кросс-конечную согласованность.

Выше приведена структура кроссплатформенной разработки на флаттере, так в чем же преимущество этого дизайна? Мы можем сравнить архитектуру разработки других приложений.

Сравнение кроссплатформенной архитектуры

Native

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

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

А системные сервисные вызовы, такие как использование датчиков, таких как камеры и Bluetooth, также будут реализованы через API, предоставляемый системой платформы.

Тогда это будет проблемой.OEM элементы управления и спецификации вызовов системных служб разных платформ, а также языки программирования не унифицированы.Android использует Java/Kotlin, а iOS использует Objective-C/Swift, что приводит к различиям платформ .

Для приложения необходимо разработать несколько наборов кодов, а эффекты пользовательского интерфейса могут быть несогласованными, что отнимает много времени и сил.

В связи с этим возникает потребность в кроссплатформенной разработке.

Давайте взглянем на распространенные кроссплатформенные архитектуры.

Webview

Прежде всего, наиболее распространенным кросс-платформенным решением является прямое использование веб-просмотра, что на самом деле мы часто называем гибридным приложением.

Хотя ядро ​​​​WebView для разных платформ не обязательно, всегда следуйте спецификации W3C, тогда наш интерфейсный код может работать на платформе WebView, реализовать кросс-платформенную разработку пользовательского интерфейса.

Что касается вызова системной службы, мост используется для вызова собственного метода через протокол.

Тогда недостатки решения гибридного приложения также очевидны.производительность веб-просмотра не так хороша, как нативная.

Чтобы решить проблему производительности этого веб-просмотра, сообщество запустило другое решение.

React Native / Weex

Как показано на рисунке, такие фреймворки, как React native и Weex, используют интерфейсный язык для описания OEM-системы и т. п. для достижения кросс-платформенности.Короче говоря, он настраивает макет страницы, записывая js, а затем анализирует его в нативном формате. управление через React Native.

Такой подход значительно повышает производительность.Потому что по сути это все же родное управление.

Однако, даже если производительность улучшится, она все равно не сможет достичь нативного уровня, потому что RN парсит макет файла jsbunder через Jscore, который все же немного отличается от нативного прямого макета.

Кроме того, использование React Native не может избежать написания собственного кода: если вы столкнетесь со сложными проблемами, связанными с платформой, вам все равно придется углубиться в нативную библиотеку, чтобы внести необходимые коррективы. Airbnb отказался от rn в прошлом году по тем же причинам.

Итак, можно ли избежать этой проблемы с флаттером? Давайте посмотрим на архитектуру флаттера.

Flutter

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

Затем напрямую обойти собственный механизм рендеринга и визуализировать представление из собственного механизма рендеринга, который точно такой же, как и собственный.Без посредников сделать разницу.

Производительность рендеринга двух также была улучшена для сравнения между двумя движками рендеринга.

До сих пор мы сравнивали несколько реализаций рендеринга пользовательского интерфейса на кроссплатформенной архитектуре,

Как насчет вызовов системных служб? Flutter не устраняет проблему кроссплатформенных вызовов системных служб, потому что различия в конструкции оборудования и языках программирования существуют объективно и в принципе неизбежны.

Однако, в отличие от предыдущих методов использования моста для вызова системных служб, флаттер использует канал платформы для вызова системных служб, которые здесь будут пропущены.В следующих главах подробно обсуждается механизм связи.

Web VS Flutter

Язык разработки

В отличие от Интернета, который делит страницы на HTML, CSS и JS, во Flutter все — виджеты. Конкретные типы виджетов делятся на:

• Виджет элемента. Например, кнопка, меню, список
• Виджет стиля. например шрифт, цвет
• Виджеты макета. такие как отступы, поля
• ...

Все виджеты вложены вместе, чтобы сформировать флаттер-приложение.

Синтаксис пользовательского интерфейса

основной стиль

Что касается синтаксиса стиля, то мы хорошо знакомы с интерфейсным кодом и можем быстро реализовать простой пользовательский интерфейс с помощью HTML и CSS.

Давайте взглянем на базовую модель коробки:

<div class="greybox">
    Lorem ipsum
</div>
<style>
.greybox {
  background-color: #e0e0e0; /* grey 300 */
  width: 320px;
  height: 240px;
  font: 900 24px Georgia;
}
</style>

var container = Container( // grey box
  child: Text(
    "Lorem ipsum",
    style: TextStyle(
      fontSize: 24.0,
      fontWeight: FontWeight.w900,
      fontFamily: "Georgia",
    ),
  ),
  width: 320.0,
  height: 240.0,
  color: Colors.grey[300],
);

Во флаттере, поскольку во Flutter нет языка разметки, нам нужно вложить классы Widget для реализации нашего пользовательского интерфейса.Класс Container Widget здесь фактически эквивалентен тегу div.

Затем посмотрите этот стиль кода, если вы написали не-jsx реакцию, вы обнаружите, что стиль кода немного похож наReact.createElementстиль.

React.createElement("div", {
    class: "test-c",
    style: "width: 10px;"
}, "Hello", React.createElement("span", null, "world!"));

макет

Для реализации пользовательского интерфейса вторым важным моментом является макет, В веб-интерфейсе основными моментами реализации макета являются свойства CSS:

<div class="greybox">
  <div class="redbox">
    Lorem ipsum
  </div>
</div>
<style>
.greybox {
  background-color: #e0e0e0; /* grey 300 */
  width: 320px;
  height: 240px;
  font: 900 24px Roboto;
  display: flex;
  align-items: center;
  justify-content: center;
}
.redbox {
  background-color: #ef5350; /* red 400 */
  padding: 16px;
  color: #ffffff;
}
</style>

Во флаттере вам нужны некоторые официально предоставленные классы стиля для реализации, такие как класс BoxDecoration здесь, чтобы украсить весь блок, Alignment, чтобы определить выравнивание текста и т. д.

var container = Container( // gray box
  child: Center(
    child:  Container( // red box
      child: Text(
          "Lorem ipsum",
          style: bold24Roboto,
          textAlign: TextAlign.center,
        ),
        decoration: BoxDecoration(
          color: Colors.red[400],
        ),
        padding: EdgeInsets.all(16.0),
      ),
      alignment: Alignment.center,
  ),
  width: 320.0,
  height: 240.0,
  color: Colors.grey[300],
);

взаимодействовать

Web:

<input name="account" />
<div onclick="handleSubmit()">Submit</div>

Последний момент — взаимодействие.Как и в большинстве интерфейсных фреймворков пользовательского интерфейса, каждый компонент фактически предоставляет некоторые обработчики событий.

С помощью этих хуков мы можем фиксировать поведение пользователя для реализации соответствующей логики,

Демонстрация здесь просто реализует основные взаимодействия, такие как проверка ввода и отправка нажатием кнопки.

Flutter:

// ...
children: <Widget>[
  TextFormField(
    decoration: InputDecoration(
        hintText: 'Email/Name/Telephone',
        labelText: 'Account *',
      ),
      onSaved: (String value) {
        loginForm.account = value;
      },
      validator: (String value) {
        if (value.isEmpty) return 'Name is required.';
      }
  ),
  RaisedButton(
    child: Text(
      'Login'
    ),
    onPressed: () {
      // print('提交操作');
      // dosomething with loginForm
      handleSubmit()
    },
  ),
]

Остальное — это такие взаимодействия, как роутинг, анимация, жесты и т. д. Здесь я не буду больше говорить, в основном то, что можно реализовать с помощью веб-технологий, можно реализовать во флаттере.

Видно, что часть пользовательского интерфейса флаттера похожа на реакцию, за исключением отсутствия jsx.

Итак, после краткого введения в грамматику, давайте посмотрим, как написать приложение на практике.

Начать попыток приложения

Прежде всего, о том, как установить среду разработки флаттера, говорить особо нечего, учебник на официальном веб-сайте очень совершенен.

Структура каталогов

Кратко расскажу о структуре каталогов, черезflutterПосле создания проекта такая структура каталогов будет сгенерирована автоматически,

.
├── android         # Android 平台配置，flutter 自动生成
├── ios             # iOS 平台配置，flutter 自动生成
├── assets          # 静态资源目录
├── build           # 存放构建出的 release 相关文件
├── lib             # 业务代码
├──  └── main.dart  # app 入口
└── pubspec.yaml    # 包管理文件

Hello World

Для начала работы с фреймворком, конечно же, требуется классический Hello World.

Чтобы получить флаттер-приложение, Нам нужно загрузить основные компоненты флаттераimport 'package:flutter/widgets.dart';, затем выполните основноеrunApp, тогда базовый привет, мир завершен.

// main.dart 文件
import 'package:flutter/widgets.dart';

void main() {
  runApp(
    Center(
      child: Text(
        'Hello, world!'
      ),
    ),
  );
}

Эффект следующий:

Как видите, если стиля нет, то приложение черное...

Подобно фреймворкам пользовательского интерфейса, таким как ant design или iview, которые нам нравится использовать во фронтенд-разработке, фреймворки пользовательского интерфейса обычно используются для разработки флаттера.

Material App

Flutter имеет два встроенных компонента пользовательского интерфейса: Material UI и Cupertino UI.

Теперь давайте посмотрим, как реализовано следующее приложение в стиле материала. Сначала импортируйте материальный компонент

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

import 'package:flutter/material.dart';
void main() {
  runApp(
    MaterialApp(
     title: 'Hello App',
     home: Scaffold(
       appBar: AppBar(
         title: Text('Hello'),
       ),
       body: Center(
         child: Text(
           'Hello Flutter',
           style: TextStyle(
             fontSize: 30
           ),
         )
       ),
     ),
   )
  );
}

Здесь также можно настроить более сложную информацию, связанную с маршрутизацией, поэтому я не буду здесь говорить больше.

Благодаря им мы знаем, как реализовать флаттер-приложение, затем мы видим, что все элементы с сущностями называются виджетами, здесь для удобства понимания мы вместе называем их компонентами.

Widgets

Компоненты подразделяются на виджеты без состояния и виджеты с состоянием, которые можно легко связать с компонентами без состояния и компонентами с состоянием реакции.

На самом деле, эти два компонента флаттера действительно аналогичны компонентам реакции.

Давайте сначала посмотрим на компонент без сохранения состояния (StatelessWidget).

Виджет без сохранения состояния StatelessWidget

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Hello App',
      home: Scaffold(
        appBar: AppBar(
          title: Text('Hello'),
        ),
        body: Center(
            child: Text(
          'Hello Flutter',
          style: TextStyle(fontSize: 30),
        )),
      ),
    );
  }
}

• StatelessWidgetФункциональные компоненты, соответствующие реакцииFunctional Component
• здесьbuildметод соответствует реакцииrenderметод

Давайте взглянем на компонент состояния (StatefulWidget).

StatefulWidget StatefulWidget

Состояние Flutter состоит из двух классов: Class State и StatefulWidget. Хотя формулировки разные, но понятия схожи:

• StatefulWidgetвести перепискуReact.Component
• существуетStatefulWidgetКласс управляет тем, что передается от родительского компонента.Prop
• существуетStateкласс управляет собойState
• пройти черезsetStateобновить состояние

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Counter App',
      home: Scaffold(
        appBar: AppBar(
          title: Text('Counter'),
        ),
        body: Center(
            child: Counter(10) ),
      ),
    );
  }
}


class Counter extends StatefulWidget {
  // 这个类是 state 的配置，可以在此定义父组件传递下来的 prop
  final int increaseNum;
  // 构造函数
  Counter(this.increaseNum);
  
  @override
  _CounterState createState() => _CounterState();
}

class _CounterState extends State<Counter> {
  int _counter = 0;

  void _increment() {
    print('count: $_counter');

    setState(() {
      // setState 的回调告诉 flutter 去变更 当前 State， 并且 setState() 的调用会触发 build() 从而更新视图
      _counter += widget.increaseNum;
    });
  }

  @override
  Widget build(BuildContext context) {
    // 每次调用 setState 都会触发 build 方法，同时，类似于 react 的 render 方法，
    // flutter 框架为了让 重新 build 更加快，也已经对此做了优化
    return Row(
      crossAxisAlignment: CrossAxisAlignment.center,
      mainAxisAlignment: MainAxisAlignment.center,

      children: <Widget>[
        RaisedButton(
          onPressed: _increment,
          child: Text('Increment'),
        ),
        Text('Count: $_counter'),
      ],
    );
  }
}

Реагировать студенты узнали, это не дежа вю это?

Жизненный цикл

Компонент закончился, жизненный цикл еще далеко?

Подобно React, Flutter также имеет собственный жизненный цикл компонентов:

• initState: состояние инициализации
• didChangeDependencies: изменение состояния зависимости
• сборка: вид сборки
• didUpdateWidget: изменение состояния, повторная визуализация представления
• деактивировать: компоненты пользовательского интерфейса временно удаляются (например, переключение страниц)
• dispose: пользовательский интерфейс навсегда уничтожен

На этом мы завершаем раздел о компонентах пользовательского интерфейса.

Кросс-платформенная разработка, в дополнение к платформенной части пользовательского интерфейса, «кросс» также пересекает вышеупомянутыйВызов системной службы платформы.

Собственный сервисный вызов

Независимо от того, какое это кроссплатформенное решение для разработки, оно в основном выполняется на уровне пользовательского интерфейса для завершения кроссплатформенной разработки и одновременного запуска в нескольких местах, но когда вам нужно выполнить определенные функции, такие как: открытие альбома для получения фото,это делается здесь.Уровень можно не качать,нужно еще использовать Native метод для прохождения.

Например, сам h5 не может вызывать базовый API системы, в h5 мы будем использовать jsbridge для отправки команд нативу, чтобы натив мог вызывать системный API.

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

Вот также демонстрация, которая вызывает камеру:

import 'package:image_picker/image_picker.dart';

class MyHomePage extends StatefulWidget {
  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  File _image;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Image Picker Example'),
      ),
      body: Center(
        child: _image == null
            ? Text('No image selected.')
            : Image.file(_image),
      ),
      // 点击按钮进行拍照
      floatingActionButton: FloatingActionButton(
        onPressed: getImage,
        tooltip: 'Pick Image',
        child: Icon(Icons.add_a_photo),
      ),
    );
  }


  Future getImage() async {
    // 打开相机拍摄，并获得图片资源
    var image = await ImagePicker.pickImage(source: ImageSource.camera);

    setState(() {
      _image = image;
    });
  }

}

Так как же плагин вызывает системную службу? Здесь вам нужно использовать механизм связи канала метода / канала платформы флаттера.

Нативное обслуживание звонков - для достижения их плагина флантера

Как показано на рисунке, флаттер использует механизм канала метода для вызова API-интерфейсов нативных слоев разных платформ. Поскольку код в конечном итоге будет скомпилирован в машинный код, процесс вызова в основном похож на собственный вызов, который выполняется без потерь, в отличие от мостового вызова, который требует преобразования протокола.

Чтобы самостоятельно реализовать FlutterPlugin, вызываемый базовой службой, вы можетеОбратитесь к официальной документации, простые шаги заключаются в следующем:

1. Определите API пакета плагина
2. Реализовать другую базовую логику
   • Функциональная реализация платформы Android (Java / Kotlin)
   • Функциональная реализация для платформы iOS (Object-C/Swift)
3. Используйте канал метода для вызова собственного API в дротике

убеждать

Прочитав так много, вы чувствуете, что это не похоже на уговоры бросить курить, а на то, чтобы сдуть кусок Флаттера?

Не волнуйтесь, он уволен.

Хотя Flutter выглядит очень мощным, на самом деле у него много ограничений.

Домашняя среда сложна, и малые программы процветают.

Все мы знаем, что внутренний трафик практически монополизирован несколькими крупными компаниями, а стоимость продвижения и скачивания приложений тоже очень высока.

Поэтому крупные компании запустили множество небольших программ, пока известны следующие:

Мини-программы WeChat/Baidu/Alipay/ByteDance/QQ и быстрые приложения и т. д.

Для быстрого привлечения трафика, учитывая соотношение вход-выход, небольшие компании охотнее используют мини-программу/быстрое приложение/решение H5, а не приложение с более высокими затратами на привлечение клиентов.

Например, компания Jingdong.taroФреймворк или аналогичный кросс-энд фреймворк для разработки апплетов больше соответствует китайским характеристикам, чем Flutter.

Taro — это многотерминальная унифицированная среда разработки, которая поддерживает однократное написание кода с помощью метода разработки React для создания приложений, которые могут работать в мини-программах WeChat/Baidu/Alipay/ByteDance/QQ, Quick Apps, H5, React Native и т. д.

Заброшенная веб-экология

Как видите, во всей статье, помимо дизайнерской идеи в стиле реакции,Флаттер имеет мало общего с интерфейсом.

В реках и озёрах ходит слух: все приложения, которые можно реализовать на js, будут реализованы на js.

Но к сожалению, исходя из разных соображений, в качестве языка разработки флаттера вместо JavaScript/Typescript гугл выбрал dart, который не является популярным языком. Он устанавливает определенный порог для разработки интерфейса, чтобы контактировать с флаттером.

Однако флаттер предназначен не только для нашего фронтенда, с точки зрения фронтенда мы, конечно же, надеемся использовать js/ts. Однако для разработки терминалов, таких как Android/ios, также требуются определенные затраты, которые можно считать равными.

Отсутствие общественной активности

Затем, поскольку за последние два года язык дротиков был воспитан флаттером, он не был популярен, пока не появился флаттер. Пока относительно не хватает экологии сообщества dart, библиотек с открытым исходным кодом и т. д. В отличие от сообщества фронтенда, есть богатые пакеты npm.

Итак, вы можете подумать об этом, вы слышали язык дротиков до флаттера?

Почему Google использует дартс в качестве языка разработки для флаттера?

На самом деле это потому что... У Дарта тоже хороший отец Орз, а его отец тоже Гугл.

Вы видели, как важно иметь хорошего отца, разве языковой дротик в третьей строке не пользуется большим успехом? [Смешно]

Ограничения чистого интерфейса

Трепетание использует механизм самопоглощения, чтобы полностью решить различия на платформе на уровне пользовательского интерфейса, но, как упоминалось ранее,Различия в службах системного оборудования (таких как камера Bluetooth и другие службы)неизбежно.

Как чистый интерфейс,в идеале, вы можете использовать флаттер для выполнения всех функций, которые могут быть реализованы изначально.

Но реальность часто не идеальна, кросс-энд разработка часто сталкивается с некоторыми проблемами, связанными с платформой, такими как камера плагина флаттера, которая немного глючит на определенной модели Android-устройства.Если вы чистый фронтенд, Если вам повезет, вы можете найти решение в сообществе open source, если вам не повезет, вы можете обратиться за технической поддержкой только к терминальной (iOS/Android) разработке.

Затем вам также понадобится разработка для iOS/Android, чтобы охватить нижнюю часть кросс-конечной среды разработки,Это все еще фреймворк для кросс-энд разработки?

Чтобы разработать зрелое приложение, осмелитесь ли вы довериться чистому интерфейсу с флаттером?

Конечно,Это не недостаток флаттера, а проблема, общая для всех кроссплатформенных решений.. Если бы не было такой проблемы, то давно бы React Native доминировал в реках и озерах, и airbnb не отказался бы от React Native.

если толькокроссплатформенный фреймворкСуществуют также ошибки, связанные с различиями платформ, которые должны решаться самими программистами, а затемЧистые фронтенд-программисты несут полную ответственность за мобильную разработкуЭто ложное предложение.

Итак, флаттер изолирован от передней части? Это не так. Если вы хотите разработать простое приложение с тяжелым дисплеем пользовательского интерфейса и несколькими системными службами, то флаттер — хороший выбор.

Суммировать

На самом деле видно, какие программисты больше всего подходят для использования флаттера?

И iOS-разработка, и немного Android-разработки., который не должен быть очень опытным и может искать программистов, которые могут решить общие проблемы с терминалом. Тогда обучение флаттеру становится еще более эффективным.

Если у вас действительно есть клиент, который заинтересован в том, чтобы стать инженером-разработчиком флаттера, то вы можете просто изучить разработку для Android и iOS.

Какие таланты пользуются наибольшей популярностью зимой в Интернете?

Универсальный, всесторонний талант, инженер взрывных стеков...

Увольнение закончилось.

---

Эта статья была впервые опубликована вблог на гитхабе
Если статья будет вам полезна,твоя звездамоя самая большая поддержка
Другие статьи:

• Приоритет браузера, модуля, основных полей в package.json, о которых вы не знаете
• Ты еще можешь так играть? Супер практичные встроенные типы Typescript и пользовательские типы
• Оптимизация производительности интерфейса не завершена

Реклама в потоке:
Шэньчжэнь Shopee долгосрочное внутреннее продвижение
Позиция: front-end, back-end (to go), продукт, UI, тестирование, Android, IOS, эксплуатация и обслуживание — все требуется.
Зарплата и льготы: 20K-50K😳,7:00 выходной 😏, Бесплатные фрукты😍, Бесплатный ужин😊, 15 дней ежегодного отпуска👏, 14 дней оплачиваемого больничного.Справочник по деталям работы.PS: Если вы голосуете онлайн, вы не можете нажать внутрь.
E-mail Ваше резюме:chenweiyu6909@gmail.comИли добавить мою микро письмо: cwy13920