6. Интерфейсы | KNOWLEDGE SPACE | Базовый курс

Начало путешествия всегда наполнено волнением и предвкушением. Это отправная точка, где рождаются мечты и раскрываются возможности.

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

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

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

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

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

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

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

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

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

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

Расширенные возможности укладки Раздел "Стиль" позволяет настроить цвет границы, цвет фона с помощью функции z-index toggle switch, которая помогает быстро настроить размер путем равномерного перетаскивания краев или закрепления положения в центральной точке.

Привязка объектов к интерфейсу Основным шагом в настройке сущностей является привязка их к определенным параметрам. Каждый тип привязки сущностей имеет индивидуальные параметры, и некоторые настройки были предварительно определены для определенных сущностей.

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

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

Отображение карточки объекта Карточка объекта - это еще один способ отображения значений и индикаторов для отдельных объектов. Она состоит из набора полей, доступных для редактирования или с ограниченным доступом, часто используемых в качестве формы ввода для ввода длинных строковых значений или текста.

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

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

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

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

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

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

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

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

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

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

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

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

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

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