Создание приложений

Создание приложения в Tulip поначалу может показаться пугающим, но как только вы разберетесь и поймете основные элементы, все окажется не так уж сложно. Приложения объединяют следующие принципы для создания нового программного обеспечения: дизайн пользовательского интерфейса, условная логика и функции, данные и базы данных, аналитика, а также связь с другими системами, устройствами и машинами. В этом руководстве мы рассмотрим ключевые концепции и интерфейсные инструменты, необходимые для успешного создания приложений. Помните, что Tulip - это платформа без кода, поэтому мы сосредоточимся на функциях, необходимых для разработки готовых к производству приложений, независимо от вашего опыта кодирования.

Для начала мы рассмотрим основной интерфейс для просмотра ваших приложений.

Создание и организация приложений

Чтобы просмотреть все приложения в вашем инстансе, перейдите на страницу приложений в вашем инстансе Tulip по адресу: [ваш инстанс].tulip.co/group. Вы также можете навести курсор на вкладку Apps в верхней навигационной панели и нажать Apps.

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

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

• Шаги
• Аналитика
• Версии
• Завершения
• Permissions
• Approvals

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

Чтобы создать новое приложение, перейдите на экран "Приложения" и нажмите синюю кнопку "Создать приложение" в правом верхнем углу. Вы также можете нажать на маленькую стрелку рядом с кнопкой, чтобы создать новую группу приложений.

Выберите пустой шаблон или уже разработанное приложение Featured App и нажмите кнопку "Создать" в левом нижнем углу окна. Эти шаблоны были разработаны пользователями Tulip, чтобы у других было быстрое решение проблем, если они не хотят создавать приложение с нуля. Вы также можете редактировать эти шаблоны, чтобы настроить их под свои нужды.

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

Нажмите синюю кнопку "Редактировать" в правом верхнем углу, чтобы перейти к интерфейсу редактора приложений.

Редактор приложений

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

1. Добавить шаг/группу шагов - добавление нового шага или группы шагов.
2. Панель шагов/записей - просмотр шагов на вкладке шагов или переключение на вкладку записей для просмотра используемых таблиц.
3. Рабочая область - пространство для создания интерфейса приложения
4. Добавить виджет актива - добавьте форму, значок или логотип в ваше приложение.
5. Добавить виджет кнопки - добавление кнопки в приложение
6. Добавить виджет ввода - добавление поля ввода в приложение
7. Добавить текстовый виджет - добавьте текстовое поле в ваше приложение
8. Вставить виджет - вставьте различные виджеты, такие как изображения, анализы, атрибуты машин и многое другое.
9. Добавить виджет камеры - добавьте снимок с обычной камеры или камеры со штрих-кодом.
10. Перевести - Tulip Player автоматически переведет приложение на выбранный вами язык через ваш профиль Tulip.
11. Создать снимок - сохраните текущую версию приложения, создав ее дубликат, чтобы вы могли протестировать несколько версий без риска ошибки.
12. Протестировать - протестировать приложение в режиме разработчика
13. Запустить - Запустить приложение в Tulip Player
14. Опубликовать - опубликовать ваше приложение
15. Вперед/назад - перемещение элемента в рабочей области вперед или за другие элементы
16. Панель триггеров - настройка триггеров, стилистических элементов и информации на уровне приложения.

Подробный обзор редактора приложений можно найти в разделе Введение в редактор приложений Tulip.

Шаги

Шаги - это "страницы" вашего приложения, различные экраны, на которых отображается контент. Чтобы добавить шаг, нажмите кнопку "Добавить шаг", которая показывает четыре варианта:

• Шаги - обычные шаги, которые можно настроить под свои нужды или с помощью виджетов.
• Шаги формы и формы подписи - эти опции были отключены для новых экземпляров после r235.
• Группы шагов - папка для шагов, помогающая организовать приложение и выполнять массовые операции, например перестановку/дублирование шагов.

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

Подробное руководство по работе с шагами вы найдете в подборке статей здесь: Шаги.

Базовый макет

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

Чтобы перейти к базовому макету, нажмите кнопку "Базовый макет" в нижней части панели шагов/записей.

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

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

Виджеты

Виджеты - это строительные блоки приложений. Они могут отображать информацию, собирать данные, выполнять логику триггеров и многое другое.

Виджеты значков

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

Виджеты кнопок

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

Подробнее о виджетах кнопок читайте здесь.

Виджеты ввода

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

Подробнее о виджетах ввода читайте здесь.

Текстовый виджет

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

Виджеты встраивания

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

Подробнее о встраиваемых виджетах читайте здесь.

Виджеты камеры

Показывайте изображение с камеры Tulip Vision или сканируйте штрих-код с помощью камеры на вашем устройстве.

Подробнее о виджетах камеры читайте здесь.

Пользовательские виджеты

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

Подробнее о пользовательских виджетах читайте здесь.

Триггеры

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

Без триггеров ваше приложение - это плоский экран; триггеры заставляют ваше приложение что-то делать. Триггеры можно добавлять в виджеты, а также в шаги (триггеры уровня шагов) и приложения (триггеры уровня приложений), а также при определенных событиях, например при срабатывании устройства. Выберите виджет, к которому вы хотите добавить триггер, и на панели триггеров нажмите на плюсик рядом с "Триггер".

Чтобы добавить триггер к шагу, убедитесь, что вы находитесь на шаге, к которому хотите добавить триггер. Перейдите на вкладку "Шаг" в панели триггеров и выберите один из вариантов из списка, нажав на знак "плюс".

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

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

УтвержденияIf представляют собой либо действие, либо переход. Действие - это изменение в приложении, не связанное с изменением шагов. Переход - это либо изменение шагов, либо завершение приложения.

И наконец, к утверждениям if добавляются утверждения else if, которые определяют альтернативное действие, которое нужно предпринять, если утверждение if окажется ложным.

Более подробное руководство по триггерам вы найдете в разделе Триггеры.

Переменные

Переменные - это типы данных, хранящихся в Tulip Cloud, которые используются при создании таблиц и аналитики. В Tulip существует множество типов данных, каждый из которых имеет свое назначение:

• Булево - да/нет
• Цвет - динамический цвет для определения состояния виджета
• Datetime - временная метка даты и времени
• Файл - ссылка на файл, хранящийся в Tulip
• Изображение - Ссылка на изображение, хранящееся в Tulip
• Целое число - Целое число
• Интервал - Количество отображаемого времени в секундах
• Машина - Объект машины в Tulip
• Число - Вещественное число
• Объект - Конфигурируемая структура объекта с дочерними атрибутами, которые имеют свой собственный тип данных
• Станция - Объект станции в Tulip из цеха
• Текст - Последовательность символов
• Пользователь - объект пользователя в Tulip из настроек учетной записи/рабочего пространства

Чтобы добавить переменную в приложение, перейдите на вкладку App в панели триггеров и выберите X рядом с "Переменные".

Откроется окно переменных, в котором будут отображены все переменные, используемые в вашем приложении. Чтобы создать новую переменную, нажмите синюю кнопку "Создать переменную" в правом верхнем углу.

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

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

Вы также можете создавать переменные в редакторе триггеров. Например, если вы хотите создавать новую запись при нажатии кнопки Submit, нажмите кнопку, к которой нужно добавить триггер, и откройте редактор триггеров.

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

Чтобы узнать больше о переменных, смотрите раздел Переменные.

Создание приложения с помощью Tulip

Создайте простое приложение Hello World с помощью участника Tulip. Этот курс также предлагается в Tulip University.

Лучшие практики проектирования пользовательского интерфейса

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

Дополнительные ресурсы

Университет Tulip

Tulip University - это бесплатный ресурс по запросу для изучения Tulip. Tulip University содержит десятки курсов, сертификаций и задач по созданию приложений, которые помогут вам подняться на новый уровень. Сделайте первые шаги, записавшись на курс Tulip Essentials, отработайте свои навыки в Tulip Challenges и расскажите о своих достижениях, став сертифицированным разработчиком приложений Tulip.

Библиотека Tulip

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

Сообщество Tulip

У вас есть вопросы, но вы не можете найти ответ в Базе знаний или Университете? У вас есть идея для функции, которая сделает вашу жизнь в 100 раз проще? Нужен способ быть в курсе всего самого нового и интересного в Tuliverse? Загляните в Tulip Community.

Tulip Community - это активный онлайн-форум, на котором пользователи могут задавать вопросы, вести дискуссии и помогать друг другу использовать Tulip для решения своих проблем.