Наши клиенты делают интересные проекты на базе нашего продукта, однако, к сожалению, об этом знаю только я в результате получения обратной связи по FGX Native. Мне кажется, что всем было бы интересно узнать о таких приложениях, о применяемых возможностях FGX Native и об использованных технических решениях. Сегодня я начну с обзора приложения, которое первоначально задумывалось, как приложения для каршеринга. Однако, в ходе разработки, области применения гораздо расширились за счет универсальности разработанного решения. Но обо всем по порядку.

Далее приведен текст автора @r3h0soft.

Перед нами стояла задача реализовать программный комплекс мониторинга за ГЛОНАСС устройствами, который бы включал возможности:

• Отслеживание местоположения устройств
• Мониторинг телеметрии
• Формирование различных отчётов за выбранный период времени
• И т.д.

В комплекс входило так же и мобильная разработка, при которой стоило преимущественно выбрать среду разработки с лаконичными и понятным кодом имеющим в комплекте кроссплатформенной реализации. Выбор остался за Delphi. Мобильное приложение должно было отвечать всем требованиям на текущий момент что касаемо UI, отзывчивый интерфейс, анимации, поддержкой API и т.д.  Но если с реализацией бэкенд всё было прозрачно, то неотъемлемой частью разработки UI было не всё гладко с использованием FireMonkey. Выбор пал на FGX Native, который предлагает все инструменты для простой и лёгкой разработки и решению поставленных задач.

В FGX Native реализовано собственное уникальное решение реализации UI, за основу взята система позиционирования FlexBox. С его помощью можно на лету, только через свойства компонента, реализовать UI любой сложности, которое будет одинаково выглядеть при любом разрешении устройств без единой строчки кода. Этот подход значительно ускорил процесс разработки и позволил сосредоточится на построении логики приложения, не загромождая код, вычислениями позиционирования элементов интерфейса.

Карты

Данный проект сложно представить без отражения мониторинга в режиме реального времени. За основу мы взяли компонент карт TfgMap с возможностью отображать маркеры, полигоны, географические зоны, строить маршруты, используя линии с большим количеством объектов. Удивила скорость работы компонента и его плавность. Одной из приятных функций для нашего проекта оказалась стилизация карт. Это позволило нам настроить внешний вид карты, чтобы он не выбивался из общего дизайна интерфейса. Одной из задач при использовании карт было построение маршрута, реализовав парсер точек по заданному диапазону времени с необходимой информацией о состоянии объекта и его положении GPS, используя фильтр настойки для разграничения маршрута использовали состояния "простоя" объекта, и иные события при которых объект не выполнял движения. Так мы получили точный список точек перемещения и реализовали отображение через поли линии. Через свойства реализации в FGX Native, мы смогли стилизовать под свои нужды, зная определенные участки состояния объекта смогли через маркеры объектов вывести определенные состояния (к примеру, участки превышения скорости). Хорошим моментом послужило что точками можно взаимодействовать присвоив им ID, так можно получить дополнительную информацию в любом участке трекера просто выбрав точку на карте. Конечно, в будущем очень хотелось бы использовать некую сущность для маркера имеющую стиль, для наполнения его своими объектами как в TfgCollectionView и отображения определенных маркеров при определенных состояниях.

Сами маркеры добавляются легко через менеджер объектов.

Списки

Не обошлось и без списков, следовало подгружать объекты в стилизованные карточки одного списка, не нагружая при этом систему, с плавность отрисовки и высокой скоростью. Для решения данной задачи взят TfgCollectionView. Этот компонент отвечает всем требованиям и прост как и все другие решения библиотеки в освоении.  Мы использовали списки, как для формирования меню навигации, так и для отображения маршрутов, истории поездок и т.д. Чтобы не нагружать приложение разными формами, мы использовали выдвигаемые панели сбоку TfgDrawerLayout и снизу TfgBottomSheetLayout. С помощью этих компонентов решена задача быстрого доступа к данным истории телеметрии при этом не нагружая интерфейс и проект дополнительными формами.

Не обошлось и без списков, следовало подгружать объекты в стилизованные карточки одного списка, не нагружая при этом систему, с плавность отрисовки и высокой скоростью. Для решения данной задачи взят TfgCollectionView. В списках мы добавили нужные нам стили объектов списка, что позволило генерировать нужный по событию изменяя только имя стиля, это удобно. Единственное чего не хватило, так это свайпа по элементам списка (лево/право). В общем и целом, этот компонент отвечает всем требованиям и прост как и все другие решения библиотеки в освоении.  Мы использовали списки, как для формирования меню навигации, так и для отображения маршрутов, истории поездок и т.д.

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

Анимация

Чтобы оживить интерфейс и порадовать пользователя внешним видом было принято решение встроить готовые сценарии анимации. В одном из обновлений FGX Native появилась поддержка продвинутых анимаций Lottie. Мы нашли готовые примеры анимации и просто встроили их в пару кликов. Таким образом получился такой вот симпатичный экран:

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

Сканер штрих кодов

В ходе работы с приложением, пользователю необходимо выполнить регистрацию ГЛОНАСС устройства. Можно было бы ограничится вводом в ручную серийного номера, указанного на устройстве. Однако, мы воспользовались готовым сканером штрих кодов TfgBarcodeScanner и камерой TfgCamera и сделали эту процедуру автоматической.

Уведомления и монетизация

Любое приложение каршеринга - это контроль за местоположением транспортного средства. И в нашем случае это не исключение. Нам нужно было уведомлять пользователя при определенных событиях телеметрии устройства (вход/выход из геозоны, состояния устройства, ДТП, включения зажигания). Для этого мы использовали локальные уведомления. А вот для системных уведомлений, таких как "обновление приложения" или "необходимости оплаты" легко реализованы с помощью Push уведомлений на базе FGX и Firebase.

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

Хотите иметь возможность монетизации в приложении будь то подписка или продажа, для этого есть готовые компоненты оплаты, как для Android так и iOS.

Реализация авторизации

Как и любое приложение, работающее с пользователя, нам необходимо было организовать процесс авторизации. Мы использовали Firebase, реализация выполнена с помощью FB4D библиотеки, в FGX имеется возможность легко реализовать авторизацию и с помощью Google Sign, Facebook, VK, AppleID, что не может не радовать. Основная база крутится на PostgreSQL, используя штатные компоненты FireDAC. Общение построено с использованием REST API, чьим ответственным выступил DelphiMVCFramework фреймворк. Как видно, FGX Native не конфликтует с различными сторонними решениями, что позволяет расширять возможности разработки приложений любой сложности и поставленных задач.

Bluetooth

Не обошлось и без штатных задач управления устройством с помощью Bluetooth , мы использовали стандартные средства Delphi RTL для синхронизации и управления модулем через Bluetooth.

Итог

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

• Мониторинг за сотрудниками (курьерами, работниками, водителям где устройством мониторинга выступает мобильное приложение на FGX с использованием сервисов фоновой локации и состоянием устройства, мониторинга задач и управления через Bitrix),
• личный кабинета клиента микрофинансовой компании,
• личный кабинет клиентов интернет провайдера,
• управление модулем автопилота для лодок fishboat по Bluetooth и многое другое.

FGX Native - это лучшее решение для нас!

Поздравляем Романа с успехом и желаем ему не останавливаться на достигнутом!

Цитата

Welcome - тысячи аудио прогулок и экскурсий по городам и музеям всего мира, составленные местными жителями и профессионалами-экскурсоводами

С нашим приложением ты можешь узнать много интересных историй даже не выходя из дома

Удивительные рассказы и виртуальные прогулки в твоем телефоне. Устраивайся поудобнее и выбирай интересное тебе место

• Приложение в Play Market: https://play.google.com/store/apps/details?id=ru.wc2.welcome&hl=ru&gl=US
• Ссылка на конкурс Embarcadero: https://delphi.embarcadero.com/delphi26th-welcome-a-spectacular-mobile-app-for-travelers-made-in-delphi/
• Автор: @Roman