Собственные типы данных

Собственный тип данных — это описание структуры: какие поля в ней есть и какого они типа. Вместо трёх отдельных переменных вы получаете один осмысленный объект.

Например, тип «Book» объединяет строку с названием, целое число с годом издания и список строк с авторами.

Что это даёт:

  • Переиспользование: описали один раз — применяете везде.
  • Простые правки: структура меняется в одном месте и расходится по всему приложению.
  • Единообразие: данные везде выглядят одинаково.
  • Меньше ошибок: сложные данные перестают разъезжаться по случайным переменным.
инфо
  • Собственный тип нужен там, где встроенных — integer, string и прочих — уже не хватает.
  • У FlutterFlow есть и набор встроенных типов данных. ::: custom-data-types.avif

Внутри собственный тип превращается в структуру (struct) — составной тип, объединяющий поля разных типов в одну сущность.

:::info Имя класса получается из имени типа с приставкой «Struct» в конце: тип «Cart» превращается в класс CartStruct.

Создание типа данных

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

совет
Конвенция именования

Собственные типы данных называйте в UpperCamelCase — так рекомендует Dart Style Guide. Подробнее — в руководстве Имена переменных и функций.

Папки для типов данных и перечислений

В панели Data Schema собственные типы данных лежат на вкладке Data Types, а перечисления — на вкладке Enums. На обеих вкладках можно заводить папки и группировать в них связанные элементы.

Новые элементы и папки добавляются кнопкой + вверху панели. В меню:

  • Add Data Type (на вкладке Enums — Add Enum);
  • Create Data Type from JSON — только на вкладке Data Types;
  • Add Folder — введите имя в окне Folder Name и нажмите Create Folder. В имени допустимы буквы, цифры, подчёркивания и пробелы; внутри одной родительской папки имена не повторяются.

Меню элемента или папки открывается кнопкой с тремя точками при наведении на строку или правым кликом. По меню можно ходить с клавиатуры:

  • стрелки вверх и вниз — между пунктами;
  • Right Arrow или Enter — открыть подменю;
  • Left Arrow или Esc — закрыть подменю;
  • Enter или Space — выбрать пункт.

У типа данных или перечисления в меню бывают пункты:

  • Move to Folder — подменю со списком папок с учётом вложенности. Появляется, если есть куда переместить;
  • Move to New Folder — спрашивает имя, создаёт папку и переносит туда элемент;
  • Move Out of Folder — возвращает элемент на верхний уровень. Появляется, если элемент лежит в папке.

У папки:

  • Add Data Type (или Add Enum);
  • Create Data Type from JSON;
  • New Subfolder;
  • Rename Folder;
  • Delete Folder.

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

совет

Элемент или папку можно перетащить на другую папку. Чтобы вынести на верхний уровень, бросьте на пустое место панели.

Поле поиска вверху панели не различает регистр и пробелы и показывает результаты, не ломая структуру папок:

  • найденные элементы остаются в своих папках;
  • папки без совпадений скрываются;
  • если совпало имя папки, видно всё её содержимое;
  • на время поиска папки раскрываются.
инфо

Папки на вкладке Enums влияют только на порядок в панели. В сгенерированном коде все перечисления по-прежнему лежат в одном файле.

Работа с экземплярами

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

Экземпляр позволяет:

  • задать значения полям;
  • сохранить объект в состоянии приложения, страницы или компонента и передать его между виджетами;
  • обращаться к отдельным полям там, где они нужны.

Порядок такой: сначала создайте переменную состояния типа Data Type, затем откройте диалог Set from Variable и выберите Create Data Type Object > Project Data Type. Укажите нужный тип и заполните обязательные поля.

Собственный тип в кастомном коде

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

custom-data-in-custom-code.avif

Пример: разбор ответа API

Допустим, API возвращает данные о товаре. Опишите тип «Product» по структуре ответа и сопоставьте поля JSON с полями типа.

Ответ выглядит так:

{
  "id": "a1b2c3d4e5f678901234567",
  "name": "Jacket",
  "price": 199.99,
  "reviews": [
    {
      "id": "rev101",
      "username": "mike",
      "rating": 4,
      "comment": "This product exceeded my expectations in every way. Highly recommended!",
    },
    {
      "id": "rev102",
      "username": "kera",
      "rating": 2,
      "comment": "Great quality, but the color was not as shown in the picture.",
    }
  ],
}

А сопоставление полей — так:

mapping-json-to-custom-data-type.avif

перевод официальной документации FlutterFlow

обновлено · перевод от

⌕ ESC