Перейти к основному содержимому

iRidium Studio

Список документации на актуальную версию студии iRidium Studio 2019:

обучение:
вебинары Академии

Проект для панели управления

В этом разделе описана работа с iRidium Studio при создании графического интерфейса для панели управления. Графический интерфейс может работать с оборудованием напрямую или через iRidium Server.

Создайте новый проект для панели управления:

iRidium Studio > File > New > **New Panel Project**

new_panel_project.png

Рабочая область

После запуска iRidium Studio и создания Panel Project , вы увидите рабочую область, состоящую из:

GUIoverview.png

  1. Настройки Studio *
    выпадающие списки, из которых можно перейти к настройкам редактора: File, Project, Tools, Help, View
  2. Инструменты рисования *
    средства для быстрого создания графических элементов. Выбрав стиль и указав возможность масштабирования, вы можете быстро добавлять в проект кнопки, уровни и другие объекты.
  3. Обзор проекта (Project Overview) *
    отображает структуру графической части проекта, позволяя добавить в нее новые элементы (страницы, окна, папки).
  4. Свойства элементов (Object Properties) *
    часть панели Project Overview, содержащая информацию о выбранном в рабочей зоне объекте – странице, окне или графическом элементе.
  5. Галерея (Gallery) *
    галерея изображений и звуков, которые можно использовать при создании интерфейса
  6. Рабочая область (Workspace)
    отображает внешний вид страницы или окна, выбранного в Project Overview. Здесь размещаем графические элементы для страниц и окон проекта, привязываем команды к элементам.
  7. База данных (Device Base) *
    хранилище встроенных драйверов (продуктов) iRidium. Включает инструменты создания драйверов для пользователей и дополнительные базы скриптовых драйверов.
  8. Дерево устройств (Project Device Panel) *
    отображает драйверы, которые используются в проекте и все их команды и каналы. Из дерева можно перетащить команды в рабочую зону (на элементы)
  9. Параметры устройств (Properties) *
    часть Project Device Panel, где настраиваются параметры драйвера, команды или канала, выбранного в дереве устройств проекта.
  10. GC Cloud (IR Database) *
    база ИК команд для использования с преобразователями Global Caché

Рабочая область (Workspace) - область для создания и размещения графических элементов проекта.

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

Editor_window_workspace.png


Инструменты рисования

icon_Draw_Item.pngDraw Item - создать графический элемент

Преднастроенные стили

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

Панель находится с левой стороны редактора iRidium Studio, начало работы с панелью включает три этапа:

EditorToolsGUICreation.png

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

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


Типовые дизайны для Studio

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

Скачать типовые дизайны iRidium >>


Информация в рабочей зоне

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

Editor_window_View_Info.png

Отображение элементов рабочей зоны *Select all – выделить все элементы на странице *Unselect all – снять выделение со всех элементов *Name – отображать имя графического элемента в рабочей зоне *Frame – отображать рамку графического элемента в рабочей зоне

icon_Grid.png - сетка в рабочей зоне помогает выравнивать графические элементы с выбранным шагом

icon_Zoom_+.png icon_Zoom_-.png icon_Zoom.png - изменение масштаба в рабочей зоне. Удобный инструмент при работе с интерфейсами, которые имеют разрешение FullHD или Retina и не помещаются в окне полностью.


Панель инструментов

Панель инструментов содержит клавиши вызова инструментов и настроек редактора. К ней относятся и боковые клавиши, вызывающие панели Studio – окна с возможностью скрытия.

icon_Redo.pngRedo #Отменить/ВернутьПовторить действие
icon_Delete_Unused_Files.pngDelete Unused Files #Инструмент очистки проектаУдалить неиспользуемые графические элементы
icon_Project_Properties.pngProject Properties #Настройки открытого проектаВсе настройки открытого проекта iRidium
icon_Grid.pngGrid #Информация в рабочей зонеСетка в рабочей зоне редактора
icon_Zoom_+.pngZoom + #Информация в рабочей зонеУвеличить масштаб рабочей зоны
icon_Zoom_-.pngZoom - #Информация в рабочей зонеУменьшить масштаб рабочей зоны
icon_View_Info.pngView Info #Информация в рабочей зонеВыбрать cвойства элементов в рабочей зоне
icon_Draw_Item.pngDraw Item #Инструменты рисованияСоздать элемент рабочей зоны
icon_Char_Map.pngChar Map #Таблица специальных символовТаблица специальных символов
icon_Big_Delete_State.pngDelete State #Управление состояниями элементаУдалить состояние элемента
icon_Big_Next_State.pngNext State #Управление состояниями элементаК следующему состоянию
DrawItemsTools.pngинструменты быстрого рисования #Преднастроенные стили
icon_All_Relations.pngAll Relations #Создание связей (Relations)Все связи между объектами в проекте
icon_Align_Group.pngAlign Group #Инструменты выравниванияВыровнять группу элементов относительно общей оси
icon_Align_Element.pngAlign Element #Инструменты выравниванияВыровнять элемент относительно края страницы или окна
icon_interval.pngInterval #Инструменты выравниванияРасстояние между членами группы объектов GUI
icon_Align_Text.pngAlign Text #Инструменты выравниванияВыровнять текст относительно элемента
icon_rapid_effect.pngRapid effect #Клавиша «Быстрый эффект»Создать эффект нажатия для 2го состояния выбранного элемента
icon_Select.pngSelect #Инструменты рисованияВыбор объекта рабочей зоны
icon_Big_Add_State.pngAdd State #Управление состояниями элементаДобавить состояние элемента
icon_Big_Prev_State.pngPrev State #Управление состояниями элементаК предыдущему состоянию
icon_Specified_Size.pngSpecified Size #Инструменты выравниванияПодогнать выбранный элемент под заданные размеры
icon_Send_To_Panel.pngЗагрузить на панель #Загрузка на панельЗагрузить GUI на панель управления через Transfer
icon_Zoom.pngZoom #Информация в рабочей зонеМасштаб рабочей зоны

Настройки открытого проекта

Откройте настройки одним из способов: Editor_window_menu_project_properties.png

Cпискок настроек открытого проекта:

Editor_window_project_properties_general.png

*1. Jobe Notes (информация о проекте)

    • Customer/Order - заказчик, счет.
    • Project Name - имя проекта
    • Address - адрес объекта автоматизации
    • Phone - телефон заказчика
    • Lendscape Width/Height - разрешение проекта при отображении его в горизонтальном режиме (в пикселях). У проектов, имеющих портретную ориентацию, эти размеры также должны быть записаны как ширина/высота для горизонтальных страниц *2. Description (заметки о ходе проекта, история версий) *3. Wizard (быстрое создание интерфейса из готовых страниц)
      подходит для быстрого формирования проекта из стандратного набора страниц. После добавления страниц необходимо связать их командами навигации - перехода между страницами проекта. *4. Resize Project (настройки масштабирования проекта)
      используются при изменении разрешения в разделе General настроек проекта, влияют на растягивание изображений и иконок. *5. General (основные параметры проекта)
    • Project Name - имя проекта, используется при сохранении
    • Target Device - целевое устройство, где планируется запуск проекта. Определяет разрешение GUI
    • Landscape Width - ширина горизонтальной страницы проекта. Укажите горизонтальный размер, даже если ваш проект - вертикальный.
    • Landscape Heigh - высота горизонтальной страницы проекта. Укажите горизонтальный размер, даже если ваш проект - вертикальный.
    • Password - пароль на открытие и редактирование проекта *6. StartUp (стартовые настройки)
    • Page - укажите страницу, которая должна открыться первой при запуске проекта
    • Popups - укажите список окон, которые должны открыться поверх стартовой страницы. Они откроются одно поверх другого, сверху вниз по списку. *7. App Settings (параметры приложения iRidium App при работе с проектом)
    • General - настройки используются на всех ОС
    • Sound On - вкл/выкл звуки в приложении
    • Clear Token - стирать/cохранять данные из Project Tokens при перезапуске приложения
    • Scripts in Background Mode - не останавливать работу скриптов, когда приложение свернуто
    • Scale Type [Proportional/FullSize/None] - способ растягивания интерфейса по размеру панели управления
      • None – не растягивать
      • Proportional – растянуть по размеру панели сохраняя пропорции
      • Full Size – растянуть по размеру панели не сохраняя пропорции
    • Background Color - заливка пустых зон экрана, когда пропорции или разрешение проекта не совпадают с размерами экрана панели (заливка пустой зоны экрана)
    • Windows/OS X - настройки используются только на Windows/OS X
    • Fullscreen - запускать проект в полноэкранном режиме
    • No Frame - вкл/выкл рамку окна приложения
    • Always on top - поверх всех окон
    • Show cursor - показать/скрыть курсор
    • Custom position [X/Y] - открыть окно приложения в выбранном месте экрана *8. Screensaver (окно блокировки)
    • Page - имя любой страницы проекта, которая будет использоваться как скринсейвер
    • Interval - время (сек.), в течение которого с проектом не должно производиться никаких действий, чтобы страница-скринсейвер автоматически открылась *9. Remote Debugging см. отладку приложения для своей ОС

Изменить разрешение проекта

Сохраните резервную копию проекта перед началом масштабирования

Чтобы изменить разрешение проекта, например, сделать из 2048х1536 проект 1024x768, впишите нужное разрешение в свойствах проекта. При этом рекомендуется переходить от большего разрешения к меньшему во избежание потери качества изображений в проекте.

ResolutionChange_InProject.png

После сохранения проекта в новом разрешении, появятся два диалоговых окна:

1. Подтвердите масштабирование

ResolutionChange_ConfirmResize.png

  • "Ok" - подтверждает изменение размера проекта
  • "Cancel" - проект сохранит исходное разрешение, никаких действий не будет произведено

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

ResolutionChange_ChooseResizeType.png

  • "Yes" - размеры окон и графических элементов проекта будут масштабированы пропорционально новому размеру страниц
  • "No" - размеры окон и графических элементов останутся старыми, изменится только размер страниц проекта

3. Сохраните масштабированный проект, чтобы зафиксировать изменения.

После сохранения, проект можно редактировать или сращивать с другими проектами.

Особенности масштабирования:

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

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

Теперь, проект нужно привести к финальным пропорциям, для чего изменим только его ширину. Отклоните запрос на изменение размера элементов и окон проекта.

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


Редактор скриптов (JS Editor)

Инструмент для создания программ на языке Java Script с использованием API iRidium - медодов и событий Java Script в iRidium. Программа, созданная таким образом, может управлять интерфейсом проекта iRidium, драйверами в проекте. С ее помощью можно создать собственный драйвер.

icon_Scripts.png открыть редактор скриптов iRidium

Editor_window_JS_Editor.png

JSnew.pngновый файл скрипта:
создать файл скриптаоткрыть файл скрипта (*.js)
JSdel.pngудалить выбранный в списке файл скрипта
JSupdown.pngпереместить вверх/переместить вниз
JSpass.pngустановить пароль на просмотр и редактирование файла скрипта (для вступления пароля в силу, необходимо сохранение и повторное открытие проекта)
JSapply.pngприменить внесенные в скрипт изменения
JSsavefile.pngсохранить в файл *.js
JSExternal_editor.pngоткрыть во внешнем редакторе* зашифрованные скрипты нельзя открыть во внешнем редакторе
*Если не выбран внешний редактор в настройках, то при нажатии откроется настройка внешнего редактора
JSundoredo.pngотменить/вернуть изменение
JSColor.pngВставить значение цвета в редакторе
JShelp.pngпоказать/скрыть справку по методам и событиям IR.
JSserch.pngпоиск по слову или строке (Ctrl+F)
JS_enable.pngвключение скрипта в работе клиента
JS_disable.pngвыключение скрипта в работе клиента (отключенные скрипты помечены серой иконкой)
Enter_pass.pngввод пароля
Set_pass.pngсброс пароля (для удаления оставьте поле "Set new password" пустым)
  • Настройки вкладки Script (размер табуляции, внешний редактор) находятся в Настройках Studio: Tools > Studio settings > Script

Инструмент очистки проекта

Опция Delete Unused Files - быстрое удаление из проекта картинок, которые были в него добавлены, но фактически не используются.

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

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

Editor_Delete_Unused_Files_menu.png


Клавиша «Быстрый эффект»

Инструмент для автоматического создания эффекта анимации на основе первого (неактивного) состояния кнопки.

Добавьте в проект изображение и нажмите кнопку «Быстрый эффект» на панели инструментов. В параметрах модифицированного состояния укажите: *Сдвиг изображения относительно изначального *Прозрачность нового состояния (альфа-канал элемента) *Цвет и размер текста на новом состоянии

Editor_Rapid_effect_on_button.png

Editor_Rapid_effect_on_button_action.png


Инструменты выравнивания

icon_Align_Group.png - Align Group . Выровнять группу элементов относительно общей оси.

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

icon_Align_Element.png - Align Element . выровнять элемент относительно края страницы или окна

Выберите один или несколько элементов, примените выравнивание из выпадающего списка. Все элементы переместятся к краю или середине страницы, в зависимости от выбранного выравнивания.

icon_interval.png - Interval . Расстояние между членами группы элементов.

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

icon_Align_Text.png - Align Text . Выровнять текст относительно элемента

Выберите один или несколько элементов. Примените выравнивание текста - оно затронет ВСЕ состояния этих элементов.

icon_Specified_Size.png - Specified Size . Подогнать выбранный элемент под заданные размеры

Выберите один или несколько элементов. Примените инструмент Specified Size, чтобы размеры выбранных элементов стали: 32х32, 64х64, 96х96, 128х128, 256х256


Таблица специальных символов

icon_Char_Map.png - Char Map . Таблица специальных символов. Поможет просмотреть все доступные символы в установленных шрифтах.

Удобно использовать при работе со шрифтами-иконками: выберите интересующий символ, скопируйте его и вставьте в текстовое поле элемента.

Чтобы символ отобразился так же, как в таблице, выберите тот же шрифт в настройках графического элемента.

Char_Map.png


Управление состояниями элемента

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

Панель инструментов:

icon_Big_Prev_State.pngPrev State . Перейти к предыдущему состоянию элемента
icon_Big_Next_State.pngNext State . Перейти к следующему состоянию элемента
icon_Big_Add_State.pngAdd State . Добавить состояние элемента
icon_Big_Delete_State.pngDelete State . Удалить состояние элемента

Object Properties > States

Editor_window_Object_Properties_States.png

icon_Prev_State.pngPrev State - открыть предыдущее состояние
icon_Next_State.pngNext State - открыть следующее состояние
icon_Add_State.pngAdd State - добавить одно состояние
icon_Delete_State.pngDelete State - удалить выбранное состояние

Отменить/Вернуть

icon_Undo.png icon_Redo.png

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


Создание связей (Relations)

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

Icon_All_Relations.png All Relations - открыть окно "Все связи"

Editor_window_feedback_relation.png

  • например, с помощью значения, полученного с ползунка уровня Item 1 , Вы можете изменить координату элемента Item 2 .

Загрузка на панель

icon_Send_To_Panel.png - загрузить GUI на панель управления через приложение iRidium Tranfser.

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

Request_Send_To_Panel.png

Нажмите OK, и загрузка начнется автоматически.

Чтобы список панелей не оказался пустым, заранее нажмите клавишу в iRidium Transfer.


Обзор проекта (Project Overview)

Обзор проекта (Project Overview) позволяет создать новые страницы (Pages ) и всплывающие окна (Popups ). Открывается с помощью кнопки на левой боковой панели редактора.

Страница или окно, выбранное в Project Overview, появляется в Рабочей области редактора.

Editor_window_Project_Overview.png

Editor_Project_Overview_icon_View.pngView – переключить режим отображения дерева [Folders/Popup Groups]
Editor_Project_Overview_icon_New_Page.pngNew Page – создать новую страницу
Editor_Project_Overview_icon_New_Popup.pngNew Popup – создать новый попап
Editor_Project_Overview_icon_Add_Group.pngAdd Group – создать группу (папку)
Editor_Project_Overview_icon_Del.pngDel – удалить страницу/попап/группу окон
Editor_Project_Overview_icon_Copy.pngCopy – копировать страницу/попап
Editor_Project_Overview_icon_Past.pngPast – вставить страницу/попап
Editor_Project_Overview_icon_Clone.pngClone – клонировать страницу/попап
Editor_Project_Overview_icon_Move_Up.pngMove Up - переместить страницу/попап/группу выше по списку
Editor_Project_Overview_icon_Move_Down.pngMove Down - переместить страницу/попап/группу ниже по списку

Editor_window_Project_Overview_rmb.png

Add Page/Popup page – создать страницу/попап
Delete Page/Popup – удалить страницу/попап
Copy Page/Popup – копировать страницу/попап
Add Item To Gallery – добавить выбранную страницу в графическую галерею редактора
View Popup – показать на выбранной странице один из попапов проекта
Add Folder – добавить новую папку

Свойства элементов (Object Properties)

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

Editor_window_Object_Properties_type.png

Выберите тип элемента в Object Properties . Настройте параметры элемента, которые зависят от его типа

General
Основные

Тип, положение и размеры элемента в рабочей зоне
Editor_window_Object_Properties_General.png

Programming
Программирование

Настройка связи с оборудованием, команд навигации и др.
Editor_window_Object_Properties_Programming.png

States
Параметры состояний

Внешний вид элемента, цвет, изображения, текст и т.п.
Editor_window_Object_Properties_States_small.png


General (размер и положение)

Общие параметры объектов интерфейса, встречающиеся у всех элементов iRidium на примере Кнопки (Button) :

Editor_window_Object_Properties_General.png

*Name – имя графического элемента, выбирается произвольно *Left / Top – положение элемента на странице (отступ слева и сверху в пикселях) *Width / Height – высота и ширина графического элемента в пикселях *Active – активность элемента (возможность реагировать на события)

    • True – элемент активен, принимает данные и отправляет команды
    • False – элемент не активен, заблокирован для нажатий и не отправляет команд (неактивный элемент становится черно-белым при работе с клиентом, на этот тег можно повлиять в процессе работы проекта на управляющей панели) *Visible - видимость элемента при запуске проекта на управляющей панели
    • True – элемент видимый
    • False – элемент невидимый (подействовать на тег можно в процессе работы с проектом через скрипты, глобальные переменные или с помощью событий Relations)

Specifics - уникальные параметры элемента, определяемые его типом:

*Type – тип элемента, указывается в зависимости от требуемого поведения *Feedback – способ отображения элементом полученных от оборудования данных

    • None – на состояние элемента не влияют ни нажатия пользователя, ни события в системе
    • Momentary – полученные от оборудования данные не влияют на состояние элемента, а при нажатии он меняет состояние на противоположное
    • Channel – состояние элемента определяется данными, полученными от оборудования. По событию отправки могут быть посланы любые данные, но элемент сменит свое состояние только при получении соответствующего (ненулевого) значения от оборудования
    • Invert Channel – при получении от оборудования значения ноль, элемент сменит свое состояние на активное, при получении ненулевого значения перейдет в неактивное состояние. Реакция на нажатия пользователя отсутствует (работает аналогично Channel)
    • On и Blink – специализированные типы обратной связи, используемые только для работы с элементами Multistate Button (см. описание Multistate Button). *Hit (для кнопки) – способ обработки нажатия на графический элемент
    • Active touch – фиксировать нажатие на любую область элемента, включая прозрачную
    • Bounding Box – фиксировать нажатие на любую область элемента, включая прозрачную
    • Pass Through – «прозрачный» для попадания элемент, нажатия на который не фиксируются вообще. Попадание будет зафиксировано для элемента, находящегося слоем ниже
    • Touch on Fill - фиксировать нажатие на любую непрозрачную область элемента. Нажатие на прозрачную область не сработает (будет передано объекту, который находится ниже) *Hit (для уровня) – способ обработки нажатия на графический элемент
    • Active – обрабатываются все нажатия на уровень
    • Display Only – нажатия не обрабатываются вообще, элемент только отображает значения, полученные от управляемого оборудования
    • Active Centering - фиксируются одиночные нажатия, положение ползунка уровня после его отпускания возвращается в середину шкалы
    • Drag – положение шкалы изменяется только при перетаскивании ползунка из текущего значения в устанавливаемое. Одиночные нажатия не обрабатываются
    • Drag Centering – положение шкалы уровня изменяется только при перетаскивании ползунка, движение ползунка всегда начинается из центра шкалы, при отпускании ползунок возвращается в центр шкалы.
    • Drag Slider - положение уровня шкалы изменяется только при перетаскивании пользовательского ползунка (Значение Custom у свойства Slider). Используйте данное значение, если уровень находится на Static list и вам надо отключить ложное срабатывание при перемотке списка *Password Number – порядковый номер пароля в таблице безопасности, который будет запрошен при нажатии на графический элемент. При правильном вводе пароля будут выполнены связанные с элементом действия (переход на защищенную страницу, отправка команды оборудованию и т.п.). Пароли устанавливаются в настройках i3 pro на управляющей панели или в настройках проекта в iRidium Transfer. *Event to Change(для Trigger button) - настройка смены состояния кнопки
    • Press - состояние элемента будет меняться при нажатии на него
    • Release - состояние элемента будет меняться при отпускании него. Используйте данное значение, если элемент расположен на Static list и вот надо отключить смену состояния при перематывании списка

скачать пример работы с уровнем и Trigger button на Static list
*Static list


Programming (команды оборудованию)

Настройки взаимодействия графических элементов с управляемым оборудованием, универсальные для всех используемых iRidium элементов интерфейса:

Editor_window_Object_Properties_Programming.png

Relations, Press, Release, Hold, Move – события интерфейса. По событию можно отправить команду оборудованию и отобразить обратную связь. Создание команд производится перетаскиванием из Project Device Panel или в редакторе макросов.

*Relations – здесь отображаются связи элемента с каналами драйверов и другими элементами интерфейса *Press – список команд, которые будут выполнены при нажатии на графический элемент *Release – список команд, которые будут выполнены при отпускании графического элемента *Hold – команды, которые будут выполняться в цикле все время, пока пользователь удерживает элемент *Move – используется для Level и MS Level. При движении ползунка уровня, отправляет управляемому оборудованию все промежуточные положения, которые прошел ползунок. Используется для плавного регулирования. В качестве замены Move хорошо подходит сочетание Press+Release

Обработка нажатий и жестов


States (внешний вид)

Внешний вид графического элемента настраивается во вкладке Состояния (States). Здесь настраиваются общие для всех состояний параметры и уникальные свойства состояний:

Editor_window_Object_Properties_States_full.png

All States – параметры, изменение которых повлияет на внешний вид всех состояний графического элемента;

State 1…n – параметры, уникальные для каждого состояния.

*Color – цвет заливки изображения *Color Alpha Channel – степень непрозрачности фона элемента *Opacity – степень непрозрачности всего элемента *Text – поле ввода текста на элемент Text Settings: *Font – шрифт, используемый для ввода текста на элемент. Требовния к специфическим шрифтам (арабские языки, иероглифическое письмо) помимо рекомендации использовать Arial Unicode MS:

      1. Формат шрифта: ТТF (ТТС не поддерживается)
      1. Шрифт должен включать все необходимые иероглифы или символы
      1. Шрифт должен поддерживать Unicode *Text Color – цвет текста на элементе *Text Align – выравнивание текста относительно границ элемента *Text Effect – эффекты оформления текста (выбрать из списка) + цвет эффектов *Word Wrap – перенос строки при ее длине большей, чем ширина элемента Images and Borders: *Border – граница элемента, выбирается из списка *Border Color – цвет границы элемента

*Image – основное изображение элемента *Icon – изображение-иконка (размещается поверх основного) *Image Align – способ выравнивания основного изображения относительно границ элемента *Icon Align – выравнивание иконки относительно границ эл-та *Chameleon Stretch – растягивание изображения-хамелеона по размеру элемента *Chameleon Image – изображение в формате PNG, которое при наложении на кнопку использует цвета ее заливки и рамки для того чтобы определить цвета внутри изображения. Другими словами, это изображение, которое способно менять свои цвета в процессе работы с проектом *Draw Order - порядок отображения слоев элемента (фон, изображение, иконка, текст, бордюр) Stretch And Filtration *Image Stretch – растягивание основного изображения по размеру элемента *Icon Stretch – растягивание изображения-иконки по размеру элемента *Chameleon Stretch – растягивание изображения-хамелеона по размеру элемента *Image Filtration – выбор способа фильтрации изображения при растягивании *Icon Filtration – выбор способа фильтрации иконки при растягивании *Chameleon Filtration – выбор способа фильтрации изображения-хамелеона при растягивании

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

Чтобы создать или удалить состояние графического элемента, а также для быстрого перемещения между состояниями используйте Object Properties > States :

Editor_window_Object_Properties_States.png

icon_Prev_State.pngPrev State - открыть предыдущее состояние
icon_Next_State.pngNext State - открыть следующее состояние
icon_Add_State.pngAdd State - добавить одно состояние
icon_Delete_State.pngDelete State - удалить выбранное состояние


Добавление собственных шрифтов

  • iRidium Studio поддерживает только шрифты формата "ttf", "ttc", "otf".
  1. Добавьте файл шрифта в папку \iRidium pro documents\Studio\Gallery2019\Fonts расположенную в папке пользователя Documents(C:\Users\UserName\Documents) .

C:\Users\UserName\Documents\iRidium pro documents\Studio\Gallery2019\Fonts

Fonts_Studioadd.png

  1. Выберите добавленный шрифт в списке шрифтов:

States_new_fonts.png

Галерея может содержать:

  • изображения
  • графические элементов (из нескольких состояний)
  • группы элементов
  • группы объектов и приложенные скрипты
  • страницы и окна проектов
  • проекты визуализации
  • звуки
  • ссылки на IP-камеры

Галерея делится на Общую Галерею и Галерею Проекта. Галерея проекта содержит только те объекты, что уже используются в проекте.

Editor_window_gallery.png

Editor_window_gallery_icon1.pngПоказать строку поиска по галерее (снизу галереи)
Editor_window_gallery_icon2.pngПоказывать объекты галереи как эскизы
Editor_window_gallery_icon3.pngПоказывать объекты галереи как список
Editor_window_gallery_icon4.pngЗадать размер эскизов в галерее

Настойка динамических изображений (ссылок на IP-камеры) производится во вкладке Галерея Проекта (Project Gallery), раздел Dynamic Images.


Импорт объектов в галерею

Воспользуйтесь механизмом импорта в меню правой кнопки мыши:

Editor_window_Gallery_Graphics_Sounds_Import.png

*Import File – импорт отдельного изображения, должен производиться в открытую папку *Import Folder – импорт папки с изображениями производится в корень галереи.

Для создания в галерее объектов с несколькими состояниями, используйте разделитель групповых операций. Отдельные состояния объекта - картинки с одинаковым именем, разделителем и номером состояния после него, при импорте объединятся в один объект.

Шаблон: _.png

Пример : image_1.png, image_2.png, … , image_n.png

При импорте в галерею согласитесь на импорт с разделителем.

Разделитель по умолчанию - нижнее подчеркивание, но его можно изменить в Tools > Options > File Operating > Divider for file group operation: [ _ ].

Импорт аудио доступен во вкладке Sound. *Import File – импорт аудио-файла в открытую папку *Import Folder – импорт папки аудио-файлов в корень каталога

Поддерживаются форматы

  • mp3 (с фиксированным и переменным битрейтом)
  • wav со следующими кодеками:
    • PСM (глубина звука 8 или 16 бит, частота дискретизации от 8 до 96 кГц)
    • IMA ADPCM (глубина звука 8 или 16 бит, частота дискретизации от 8 до 96 кГц)
    • MS ADPCM (глубина звука 8 или 16 бит, частота дискретизации от 8 до 96 кГц)

Editor_window_Gallery_add_item_to.png Чтобы добавить в галерею собственную кнопку или группу элементов, используйте “Add Item To Gallery” в меню правой кнопки мыши на элементе (элементах), или на странице в обзоре страниц.


Сохранение проектов iRidium в галерею

SaveProjectoGallery_1.png

Галерея позволяет хранить целые проекты iRidium:

  • Откройте проект в iRidium Studio
  • Откройте панель "Gallery", выберите вкладку "Graphics"
  • Создайте новую папку в дереве и выделите ее курсором мыши

SaveProjectoGallery_2.png

  • Перенесите проект из Project Overwiew в правую часть вкладке окна Gallery
  • В окне Export выберите превью проекта (файл **.png, .jpg ) или просто нажмите "ок"
  • Проект хранится в глобальной галерее *Editor\Gallery\My Projects* в формате *.irgl

База данных (Device Base)

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

Editor_window_Device_Base.png

Add – добавить драйвер из базы данных в проект. Добавление производится методом Drag&Drop: перетащите драйвер из вкладки Device во вкладку Project
width = "4%"|Editor_window_Device_Base_icon_Edit.pngEdit – изменить базу данных. Это профессиональный инструмент, который позволяет создавать собственные базы данных и изменять существующие. Нельзя использовать с основной базой данных iRidium.

Редактор базы данных (DataBase Editor)

Инструмент создания преднастроенных драйверов, команд и каналов на основе драйвера AV & Custom Systems.

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

Editor_window_Device_Base_icon_Edit.png Edit - открыть редактор базы данных

width = "4%"|Editor_window_Device_Base_icon_new.pngNew – создать новую базу данных. Используется для профессиональной настройки оборудования и создания собственных устройств на базе драйвера AV & Custom Systems
Editor_window_Device_Base_icon_Attach.pngAttach – добавить новую базу в список GUI Editor
Editor_window_Device_Base_icon_Detach.pngDetach – убрать выбранную базу из списка GUI Editor

Editor_window_Device_Base_small.png Editor_window_DB_Editor.png


Дерево устройств (Project Device Panel)

Cписок устройств, которыми необходимо управлять с помощью проекта iRidium. Здесь настраиваются параметры подключения к оборудованию, команды и каналы связи с оборудованием.


System Tokens

Это список системных переменных (например, текущие дата и время), которые можно использовать в проекте. Подробно о системных токенах читай в разделе iRIdium Studio: обработка данных и системные переменные


Project Tokens

В этом разделе можно создать список локальных переменных проекта, которые хранят данные (строка, число, массив) в процессе работы проекта и между запусками проекта. Подробно о токенах проекта читай в разделе iRIdium Studio: обработка данных и системные переменные


Drivers

Под этой вкладкой хранятся все драйверы, которые уже добавлены в ваш проект.

Editor_window_Project_Device_Panel.png

Editor_window_Project_Device_Panel_icon_Import.pngImport File - импорт устройств и команд из файла проекта
Editor_window_Project_Device_Panel_icon_Scan.pngScan Network – сканирование сети на предмет наличия оборудования HDL BUS-Pro, Lutron, DuoTecno
Editor_window_Project_Device_Panel_icon_Add.pngAdd – добавить новую команду, канал, токен, папку
Editor_window_Project_Device_Panel_icon_Add_Token.pngAdd Token – добавить новый токен
Editor_window_Project_Device_Panel_icon_Add_Command.pngAdd Command – добавить новую команду
Editor_window_Project_Device_Panel_icon_Del.pngDel – удалить драйвер, команду, канал, папку

Устройство, команда, канал, токен - настраиваются в окне Параметры устройств (Properties).


Параметры устройств (Properties)

Настройка подключения к оборудованию, команд, каналов обратной связи и токенов проекта.

Editor_window_Properties.png

В этом окне будут отражены свойства объекта, выбранного в Project Device Tree (настройки подключения к оборудованию – IP-адрес, порт, специфические параметры оборудования; параметры команд и каналов статуса).


GC Cloud (IR Database)

GC Cloud - это онлайн-база ИК команд для драйвера Global Cache.

Нажмите "Обновить" , чтобы загрузить список производителей и команд (обязательно подключение к Интернету)

GCDB_1.png

Структура базы:

  • Brands - производители оборудования
  • Device Types - категории оборудования у производителя
  • Codesets & Commands - модели, и соответствующие им ИК команды

Перетащите папку с командами на ИК выход драйвера Global Cache в вашем проекте. Команды настроены заранее, их не нужно редактировать:

GCD_11.png

Команды и папки можно перемещать между ИК выходами модулей GC в проекте перетаскиванием.


Эмулятор

Эмулятор (Emulator) - приложение для проверки работы проекта в редакторе iRidium Studio.

  • Эмулятор работает только после авторизации с использованием логина и пароля с сайта iRidium Mobile

Режимы работы Эмулятора настраиваем в Tools > Options > Emulator:

  • Client Fullscreen - запуск в полноэкранном режиме
  • Client Sound On - включить/выключить звук в приложении
  • Show log at Emuator Start - автоматически открывать окно лога (иначе лог можно открыть по нажатию F4)

Path_to_the_license.png

Горячие клавиши:

  • F4 - открыть лог
  • F5 - запустить Эмулятор
  • F7 - открыть меню управления аккаунтом и проектами
  • F8 - открыть системные настройки (введите пароль 2007 )

Шифрование проекта

Полное шифрование проекта (сохранение в защищенном формате)

GUIpirpz.png

Проект iRidium (**.irpz, .sirpz ) можно сохранить в защищенном формате, который не позволит третьим лицам получить доступ к изменению проекта, его настройкам и ресурсам (иконки, звуки, изображения, каналы оборудования).

Защищенный проект (.pirpz, '.psirpz ) нельзя открыть в Studio, но можно загрузить на панель управления, где приложение автоматически распакует и запустит интерфейс.

Кодирование проекта - необратимый процесс . Файл, сохраненный в формате *.pirpz нельзя превратить обратно в *.irpz, нельзя редактировать. Его можно только загрузить на панель управления. Кодированный проект сохраняется рядом с исходным, редактировать можно только исходный проект.


Также существуют методы защиты данных внутри проекта *.irpz, которые работают без кодирования всего проекта:

Кодирование файла скрипта

Ограничить просмотр и редактирование скрипта (iRidium Script) можно, установив пароль доступа:

GUIscriptCoder.png

Пароль на доступ к редактированию

В настройках проекта iRidium (*.irpz) вы можете установить пароль, который будет запрошет при каждом новом открытии проекта. Таким образом, проект сохраняет возможность редактирования. Учитывайте, что из проекта *.irpz возможно извлечение изображений и файлов скриптов (не забывайте кодировать скрипты).

GUIaccessCoder.png


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


Горячие клавиши

*Ctrl + N - новый проект *Ctrl + O - открыть проект *Ctrl + F4 - закрыть проект *Ctrl + S – сохранить проект

*Ctrl + Z – отменить действие *Ctrl + Shift + Z – повторить действие

*ЛКМ – выбрать элемент *ПКМ – перейти к свойствам элемента *Ctrl + C – копировать объект (группу объектов) *Ctrl + X - вырезать объект (группу объектов) *Ctrl + V – вставить объект (группу объектов) *Ctrl + A – выделить все объекты на странице

*Ctrl + G - сгруппировать выделенные элементы *Ctrl + H - разгруппировать выделенные элементы *Alt + G - включить / выключить текущую выбранную сетку

*Ctrl + ЛКМ – выделить несколько объектов *Shift + ЛКМ – клонировать объект на странице *Alt + ЛКМ - перебор перекрывающихся элементов *Клавиши ← ↑ → ↓ - перемещение выбранного объекта по рабочей зоне (на 1 пиксель) *Ctrl + клавиши ← ↑ → ↓ - перемещение выбранного объекта по рабочей зоне (на 10 пикселей) *Shift + клавиши ← ↑ → ↓ - увеличение/уменьшение размера выбранного объекта (на 1 пиксель) *Alt + ← ↑ → ↓ - выравнивание текста внутри элемента с помощью мыши (предварительно необходимо установить свойства графического элемента Text Align = Absolute и заполнить поле Text). *Ctrl + Home - поместить вперёд *Ctrl + End - поместить назад *Ctrl + Page Up - ближе *Ctrl + Page Down - дальше

*F2 – перейти в поле редактирования текста - в текущее состояние (State) *Shift+F2 – перейти в поле редактирования текста - во вкладку All States (изменяет текст на всех состояниях)

*F4 – открыть лог Эмулятора/iRidium App для Windows *F5 – запустить Эмулятор *F8 – открыть настройки Эмулятора/iRidium App для Windows


Решение проблем

Если редактор не запускается и выдает ошибку "List index out of bounds (1)" - зайдите в реестр (Выполнить > regedit) и удалите ветку HKEY_CURRENT_USER\Software\iRidium mobile Ltd.\iRidium\2\GUI

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

Не можете найти ссылку на поток с IP-камеры или DVR? Используйте открытые источники. Читать подробно >>

Открыли один попап, а другой при этом сам закрылся? Так работают Popup Groups в альтернативном дереве страниц. Переключите отображение дерева в правом верхнем углу Project Overview

Сделали Static List, но при листании, кнопки на нем нажимаются? Используйте событие Release вместо Press, постарайтесь не использовать Trigger Button.

Слишком часто отсылается команда с события Move? Добавьте перед ней задержку: Delay(100) ms, и команда будет уходить не чаще, чем раз в 100мс. Можно выбрать и другой интервал.

Написали в элементе текст, а он не отображается? Проверьте, что пишете в нужном состоянии (State) элемента, и что цвет текста непрозрачен (см. Text Color > ползунок справа: 255). Если ползунок по-умолчанию оказывается в положении 0, откройте также Tools > Options > Default Control Settings > настройка цвета, переведите ползунок прозрачности цвета в положение 255. Проблема будет решена.

Вывели на элемент значение, а оно отображается как 0.00000? Уберите привязку к "In Text" графического элемента и замените ее на In Value. В текстовом поле элемента напишите $V или др. шаблон.

Привязали команду к кнопке, а она не работает? Убедитесь, что в настройках кнопки (General > Hit) указано событие Active Touch или Bounding Box. Если указано Pass Through - кнопка будет "прозрачной", ненажимаемой.