Глобальные свойства

Глобальные свойства — это встроенные переменные, доступные на любой странице приложения. Их задаёт сам FlutterFlow: создать своё или изменить существующее нельзя. Зато они закрывают задачи, которые встречаются в каждом втором проекте.

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

Доступ к ним — через меню Set from Variable > Global Properties.

Список глобальных свойств

• Is User Logged In — вошёл ли пользователь в приложение. По нему открывают возможности зарегистрированным и меняют интерфейс для гостей. Свойство доступно, только если в проекте включена аутентификация любого типа.

• Current Time — текущие дата и время. Формат вывода настраивается, см. собственные форматы.

• Current Device Location — текущее местоположение устройства: чтобы показать точку на карте или записать координаты в базу. Примеры — ниже.

• Link To Current Page — диплинк на текущую страницу.

• Current Route Path — имя маршрута страницы, которая сейчас открыта. Свойство выручает, когда действие нужно выполнить только на «своей» странице. Например, при запуске приложения из push-уведомления главная страница может остаться в фоне, хотя пользователь ушёл на другой экран, — и её действие On Page Load сработает не вовремя. Разбор такой ситуации — в обсуждении на GitHub.

• Current Route Stack — список маршрутов всех активных страниц в стеке навигации. По нему видно, насколько глубоко пользователь ушёл и каким путём. Пригодится для своей логики кнопки «назад», хлебных крошек или аналитики: в интернет-магазине, например, можно посмотреть, с какой страницы человек попал в оформление заказа, и показать подходящее предложение.

• Fraction of Screen Width — доля от ширины экрана устройства.

• Fraction of Screen Height — доля от высоты экрана устройства.

• Screen Width — полная ширина экрана в пикселях.

• Screen Height — полная высота экрана в пикселях.

• Is Android — приложение открыто на Android. См. пример.

• Is iOS — приложение открыто на iOS. См. пример.

• Is Web — приложение открыто в браузере. См. пример.

• Is Debug Mode — приложение запущено в режиме отладки; удобно, чтобы показывать что-то только во время разработки.

• Is Dark Mode — включена тёмная тема.

• Is Light Mode — включена светлая тема.

• Is On-Screen Keyboard Visible — видна ли экранная клавиатура. По этому признаку подстраивают интерфейс, см. пример.

• Current Environment — текущее окружение разработки.

Current Time

Свойство Current Time возвращает текущие дату и время. Оно доступно, когда в качестве источника (Source) выбрано Global Properties.

Значение можно вывести на экран или передать во встроенный либо собственный виджет для дальнейшей обработки.

Собственный формат

Готовых форматов даты и времени иногда не хватает — тогда формат задают строкой самостоятельно.

Например, шаблон yyyy/MM/dd || kk:mm выведет дату как «2023/07/25 || 10:30».

Разберём его по частям:

• yyyy — год из четырёх цифр, «2023».
• MM — месяц из двух цифр, «07» для июля.
• dd — день из двух цифр, «25».
• kk — час в 24-часовом формате, «10».
• mm — минуты, «30».

Полный набор обозначений, из которых собирается шаблон:

• d — день месяца: «2» для 2 февраля.
• E — сокращённый день недели: «Mon».
• EEEE — полный день недели: «Monday».
• LLL — сокращённый месяц отдельно: «Feb».
• LLLL — полный месяц отдельно: «February».
• M — месяц числом: «2» для февраля.
• Md — месяц и день: «2/2».
• MEd — сокращённый день недели, месяц и день: «Mon, 2/2».
• MMM — сокращённый месяц: «Feb».
• MMMd — сокращённый месяц и день: «Feb 2».
• MMMEd — сокращённый день недели, месяц и день: «Mon, Feb 2».
• MMMM — полный месяц: «February».
• MMMMd — полный месяц и день: «February 2».
• MMMMEEEEd — полный месяц, день недели и день: «Monday, February 2».
• QQQ — сокращённый квартал: «Q1».
• QQQQ — полный квартал: «1st quarter».
• y — год: «2023».
• yM — год и месяц: «2023/2».
• yMd — год, месяц, день: «2023/2/2».
• yMEd — день недели, год, месяц, день: «Mon, 2023/2/2».
• yMMM — сокращённый месяц и год: «Feb 2023».
• yMMMd — сокращённый месяц, день, год: «Feb 2, 2023».
• yMMMEd — день недели, месяц, день, год: «Mon, Feb 2, 2023».
• yMMMM — полный месяц и год: «February 2023».
• yMMMMd — полный месяц, день, год: «February 2, 2023».
• yMMMMEEEEd — день недели, полный месяц, день, год: «Monday, February 2, 2023».
• yQQQ — сокращённый квартал и год: «Q1 2023».
• yQQQQ — полный квартал и год: «1st quarter 2023».
• H — час в сутках (24 часа): «15» для трёх часов дня.
• Hm — часы и минуты (24 часа): «15:30».
• Hms — часы, минуты, секунды (24 часа): «15:30:45».
• j — час (12 часов): «3 PM».
• jm — часы и минуты (12 часов): «3:30 PM».
• jms — часы, минуты, секунды (12 часов): «3:30:45 PM».
• m — минуты: «30».
• ms — минуты и секунды: «30:45».
• s — секунды: «45».
• G — эра: «AD» в «AD 2023».
• L — месяц отдельно: «7» для июля.
• c — день отдельно: «2» для вторника.
• h — час в формате AM/PM (1–12): «3» для трёх утра.
• H — час в сутках (0–23): «15» для трёх часов дня.
• S — доли секунды: «123» для 123 миллисекунд.
• D — день года: «50» для пятидесятого дня.
• a — маркер AM/PM: «AM» или «PM».
• k — час в сутках (1–24): «24» для полуночи.
• K — час в формате AM/PM (0–11): «0» для 12 AM.
• Q — квартал: «4» для четвёртого квартала.

Current Device Location

Свойство возвращает текущее местоположение устройства (геолокацию). Доступно, когда Source выставлен в Global Properties.

Координаты можно показать на карте или сохранить в базе данных.

Пример: получить местоположение

Передадим координаты виджету, который умеет принимать LatLng, — например, Google Maps:

1. Выделите виджет (скажем, GoogleMap) в дереве виджетов или на холсте.
2. В панели свойств найдите свойство Initial Location и нажмите Set from Variable.
3. Выберите Source → Global Properties.
4. В Available Options укажите Current Device Location.
5. Нажмите Confirm.

Пример: сохранить местоположение

Теперь запишем координаты пользователя в документ Firestore.

1. Создайте поле типа LatLng в схеме Firestore.

2. Задайте значение этого поля из переменной и выберите Current Device Location в Global Properties.

Is Android / iOS / Web

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

Как это применяют:

• Is Android — push-уведомления с настройкой, которая работает только на Android: экран настройки показывается лишь на этой платформе.
• Is iOS — анимации и жесты, рассчитанные на iOS: включаем их на iOS, а для остальных платформ оставляем запасной вариант.
• Is Web — загрузка файлов перетаскиванием: в браузере на десктопе это уместно, на телефоне — нет.

Is On-Screen Keyboard Visible

Свойство сообщает, открыта ли сейчас экранная клавиатура. Доступно, когда Source выставлен в Global Properties.

Пример: спрятать нижнюю панель при открытой клавиатуре

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

Вот как это выглядит:

Решается условной видимостью на панели навигации: в условии используется «Is On-Screen Keyboard Visible», и панель прячется, пока клавиатура на экране.