bunopus 7 дек 2018 в 11:30

Детальный разбор того, что Google показал на конференции FlutterLive (и что это значит для Dart и мира)

6 мин

11K

Блог компании WrikeDart*Flutter*Разработка мобильных приложений*

+16

Комментарии 24

mkulesh 7 дек 2018 в 12:41

А как же Kotlin? Прощаемся, не успев распробовать?

bunopus 7 дек 2018 в 13:38

Flutter можно рассматривать как фреймворк для визуального представления. А бизнес логику писать на Kotlin по-прежнему

Veikedo 7 дек 2018 в 12:52

Не совсем понял — при использовании флаттер, UI нужно писать отдельно для каждой платформы? Или гугл выпустил какой-то набор компонент, которые по разному отображаются в зависимости от платформы?

gluko 7 дек 2018 в 12:59

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

Veikedo 7 дек 2018 в 13:02

Понял, спасибо.

Для react native существует, например, nativebase.io, который под каждую платформу отображает нативный элемент.

Видимо, для флаттер придётся подождать сообщества.

bunopus 7 дек 2018 в 13:41

Есть несколько способов:

если нужен нативный вид на каждой платформе — придётся разделять UI. В наличии есть Cupertino-like widgets и Material
реализовать свой UI, который будет подходить везде
Но не всё так страшно, если написать правильно, то не придётся везде вставлять

if(Platform.isIOS)
//...

можно написать фабрику, которая будет вам возвращать виджет в зависимости от платформы

Veikedo 7 дек 2018 в 13:43

Да, спасибо.

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

Veikedo 7 дек 2018 в 13:13

Ещё вопрос — неужели всех устраивает монструозный (как по мне) трёхэтажный синтаксис описания виджетов? Есть ли планы по разработке подобия jsx?

bunopus 7 дек 2018 в 13:43

Ну и в jsx можно написать

<widget>
   <childwidget1>
     <childwidget2>

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

Veikedo 7 дек 2018 в 13:44

уже есть транслятор jsx во флаттер?

bunopus 7 дек 2018 в 15:52

Можно почитать вот эту ветку там оооочень много всего про это написано

Neikist 7 дек 2018 в 16:02

Меня наоборот радует. Большой вложенности не будет за счет декомпозиции частей виджета в отдельные методы или вообще виджеты, а отсутствие разделения между кодом и разметкой очень радует.

Veikedo 7 дек 2018 в 16:06

Всё это относится и к jsx.

Neikist 7 дек 2018 в 16:23

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

Veikedo 7 дек 2018 в 16:32

Если хотите с проверкой типов, то можно юзать tsx, часть typescript'a.

Кавычки будут (это же xml всё-таки), всё остальное верно.

<widget onClick={() => alert(1)}>
   <children>
      ...
   </children>
</widget>

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

Neikist 7 дек 2018 в 17:16

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

if(value==...) {
    <children1>
      ...
   </children1>}
else {
    <children2>
      ...
   </children2>
}

Veikedo 7 дек 2018 в 17:30

const Widget = () => {
  if (1 === 1) {
    return <div>Nice One</div>
  }

  return <div>Nice Two</div>
};

const Widget1 = () => (
  <div>
    {1 === 1 && <div>Nice One</div>}
    {2 === 1 && <div>Nice Two</div>}
  </div>
);

const Widget2 = () => (
  <div>
    {() => {
      if (1 === 1) {
        return <div>"Nice One"</div>
      }

      return <div>"Nice Two"</div>
    }}
  </div>
);