P.1 First steps
P.2 Creating a graphic interface »
P.3 Working with drivers »
This section describes work with iRidium Studio when creating graphic interfaces for control panels.
Graphic interfaces can work with equipment directly or via iRidium Server.
Create a new project for your control panel:
iRidium Studio > File > New > New Panel Project
iRidium Studio > File > New > New Panel Project
After starting iRidium Studio and creating of Panel Project you can see the workspace which consists of:
Workspace - space for creating and positioning project graphic items.
Using Tool Box, you can set up Workspace scale, grid displaying, add or remove item states, switch between the item states and set up particular item properties:
It is a convenient tool both for beginners and experienced users. It helps to create items and blocks of interface items fast, selecting them from the ready list of templates. The templates can be created in different styles and items added from them can be scaled.
The panel is located on the left side of iRidium Studio. Working with the panel includes three stages:
When the tool is set up and selected, you can go to the editor workspace, on a project page or popup and start creating items the same way it is done with the standard tool for drawing buttons.
On the iRidium mobile web site you can download and buy ready visualization interfaces on the basis of which you can set up control of any iRidium supported equipment:
When working with the editor you can select which graphic item properties you want to display in Workspace. The selection is made in the dropdown list of the View Info button in Studio Tool Box:
Displaying Workspace items
- the grid in Workspace helps to allign graphic items with the selected spacing
- changing the Workspace scale. It is a convenient tool when working with interfaces with FullHD or Retina resolutions as they do not fit in the Workspace.
Tool Box contains buttons for activating editor tools and settings. It also includes the side buttons which activate Studio panels – the windows which can be hidden.
Undo the action
Redo the action
Delete unused graphic items
All settings of the opened iRidium project
Show the grid in the editor Workspace
Zoom in Workspace
Zoom out of Workspace
Select properties for their displaying on graphic items in Workspace
Create a Workspace item
Open the table of special symbols
Delete an item state
Go to the next item state
Open the Java Script editor
Show all relations between project objects
Align the group of items relative to the common axes
Align the item relative to the page/popup border
Set the distance between GUI objects of the selected group
Align the text relative to the item
Create an effect on pressing for the 2nd state of the selected item
Select a Workspace object
Add an item state
Go to the previous state
Adjust the selected item to the preset size
Show the current item state
Upload the GUI on control panels via Transfer
Start the GUI emulation mode
Show the selected scale of Workspace
You can open the settings using one of the following ways:
List of open project settings:
To change the project resolution, for example from 2048х1536 to 1024x768, indicate the required resolution in the project properties. At that it is recommended to change resolution from higher to lower to avoid image degradation in the project.
After saving the project with the new resolution two dialog windows will appear:
1. Confirm scaling
2. Select if you need to change the size of popups and graphic items of the project
3. Save the scaled project to secure the changes.
After the saving the project can be edited or merged with other projects.
Aspects of scaling:
If in the project with new resolution side proportions differ from the initial ones, then the project can look too stretched or shrunk.
You can improve its appearance by changing the resolution in 2 stages: first change the project without changing proportions. In order to do that take the final height of the project and calculate the width which will allow you to keep its initial proportions. Confirm that you want to change sizes of project items and popups.
Now the project can be given the final proportions. In order to do that change only its width. Do not change the sizes of project items and popups.
Now you have the project of the required resolution and its items keep their initial proportions. In the right area there is empty space or on the contrary not all items can be fitted on the page. You can arrange the items again.
It is a tool for creating programs in the Java Script language using iRidium API - Java Script methods and evenr in iRidium. Programs created in such a way can control iRidium project interfaces, project drivers. It also can help you to create custom drivers.
open the editor of iRidium scripts
The Delete Unused Files tool - fast deletion of images which were added in the project but are not actually used.
Such images lengthen the time of upload and increase the project size. The frequent reason for appearance of such images is item scaling as the copies of images in the new size are created at that.
Make sure your project doesn’t have unused files before uploading it on your control panels:
It is a tool for automatic creation of animation effects on the basis of the first (inactive) button state.
Add an image in the project and press on the «Fast effect» button in Tool Box. In the properties of the modified state indicate:
- Align Group. Align the group of items relative to the common axes.
In order to use it, select several items on the page and align them in one of the ways you see in the drop-down list.The items will be aligned relative to their sides or middle.
- Align Element. Align the item relative to the page or popup border.
Select one or several items, align them using one of the ways from the drop-down list. All items will be moved to the page side or middle depending on the selected way of alignment.
- Interval. Set the distance between objects of the selected group
Select several items which approximately form one vertical or horizontal line. For the vertical line, select the vertical interval, for the horizntal line - horizontal. The space between the items will be equal, the side groups will not change their position.
- Align Text. Align the text relative to the item.
Select one or several items. Align the text - it will affect ALL states of the items.
- Specified Size. Adjust the selected item to the preset size.
Select one or several items. Use the Specified Size tool for the size of the selected items to become:
32х32, 64х64, 96х96, 128х128, 256х256
- Char Map. Open the table of special symbols. It helps to see all available symbols in the used fonts.
It is convenient for use when working with icon fonts: select the required symbol, copy it and paste into the item text field.
For the symbol to be displayed the same way as in the table, select the same font in the settings of the graphic item.
Select a graphic item in Workspace. It contains from 1 to several states which can be controlled with the help of Tool Box or via the tab Object Properties > States
Object Properties > States
The "Undo" and "Redo" commands work only in the Workspace window and only for graphic items. Changes of object properties or states (color, text, image...) cannot be undone/redone with these commands.
Graphic items, pages, popups, equipment channels and tokens can be related in the project and communicate. You can see all relations in the All Relations window. Here you can also add "a relation" to send data from one object to another:
All Relations - open the All Relations window
- for example, with the help of the value received from the slider of Item 1 you can change the coordinate of Item 2.
- to upload the GUI on control panels via the iRidium Tranfser application.
When clicking on the button for the first time, iRidium Tranfser will open (if it was closed) and offer to select the control panel for uploading the graphic interface opened in the editor:
Click OK to start the upload.
For the list of panels not to be empty, click on the Panel Search button in iRidium Transfer beforehand.
Project Overview enables creation of new Pages and Popups. It is opened with the help of the button on the left side editor panel.
The page or popup selected in Project Overview will appear in Workspace.
To program behavior of interface items and their communication with equipment use different types of graphic items.
Select the item type in Object Properties. Set up item properties which depend on its type
GeneralItem type, position and size in Workspace
ProgrammingSetting up connection with equipment, navigation commands, etc.
StatesItem appearance, color, text, etc.
General properties of interface objects for all iRidium items by the example of Button:
Specifics - unique item properties defined by its type:
Settings for communication between graphic items and controlled equipment similar for all interface items used by iRidium:
Relations, Press, Release, Hold, Move – he interface events. By activating these events you can send commands and display feedback. Command creation is performed by dragging them from and Project Device Panel in the Macros editor.
Appearance of graphic items is set up in the States tab. Here you can set up properties similar for all states and unique properties of each state:
All States – the properties which define the appearance of all states of the graphic item
State 1…n – the properties unique for each state
Images and Borders:
Stretch And Filtration
To create or delete states of graphic items and move fast from one state to another, use the tools of the editor top panel:
To create or delete a state of a graphic item and to switch states use Object Properties > States:
Gallery can contain:
Gallery is divided into Gallery and Project Gallery. Project Gallery contains only the objects used in the project.
(the right upper corner of the «Gallery» window):
Setting up of dynamic images (links to IP cameras) is performed in the Project Gallery tab, the Dynamic Images section.
Use the import tool which is available in the right-click mouse menu:
For creating objects with several states use the divider of group operations. Separate object states - images with the same name, divider and the state number after it - are united in one object at import.
Template: <name>_<state №>.png
Example: image_1.png, image_2.png, … , image_n.png
image_1.png, image_2.png, … , image_n.png
When importing agree to import with the divider.
The divider is underscore by default. But it can be changed in the menu Tools > Options > File Operating > Divider for file group operation: [ _ ].
Importing audio is available in the Sound tab.
Gallery allows you to store iRidium projects:
It is a database of drivers, commands and script modules for controlling different equipment. All iRidium supported devices which you can use in your projects are stored here.
It is a tool for creating preset drivers, commands and channels on the basis of the AV & Custom Systems driver.
It is a professional tool which allows to set up control of any AV equipment, media server, converter or another device. More information in the data processing section.
Edit - to open the database editor
It is a list of devices you want to control with the help of your iRidium project.
Properties of connection to equipment, commands and channels of connection with equipment are set up here.
It is a list of system variables (for example, the current date and time) which can be used in projects. See more information about system tokens in the section iRidium Studio: data processing and system tokens
In this section you can create a list of project variables which store data (strings, numbers, arrays) during project work and between project launches.
See more information about project tokens in the section iRidium Studio: data processing and system tokens
This tab stores all drivers added in your project.
Devices, commands, channels and tokens are set up in the Properties window.
Setting up of connection to equipment of commands, feedback channels and project tokens.
This window displays properties if the object selected in Project Device Tree (settings for connection to equipment – IP-address, port, specific equipment properties; properties of commands and status channels).
GC Cloud is an online database of IR commands for the Global Cache driver.
Click "Update" to download the list of manufacturers and commands (connection to the Internet is required)
The database structure:
Drag the folder with commands on the IR output of the Global Cache driver in your project. The commands are preset - you do not need to edit them:
Commands and folders can be moved from one IR output of GC modules to another by dragging.
Emulator - an application launched in iRidium Studio to test the project work.
Emulator work modes see in iRidium Studio > Tools > Options > Emulator:
Full encryption of projects (saving in the protected format)
iRidium projects (*.irpz, *.sirpz) can be saved in the protected format which will not allow other parties to get access to project editing, its settings and resources (icons, sounds, images, equipment channels).
Protected projects (*.pirpz, '*.psirpz) cannot be opened in Studio but they can be uploaded on control panels where the application will automatically unpack and start the interface.
Project encryption is an irreversible process. Files saved in the *.pirpz format cannot be turned back to *.irpz or edited. They can be only uploaded on control panels. Encrypted projects are saved together with the original ones. You can edit original projects only.
There are also means for protecting data inside *.irpz projects which work without encrypting the whole project:
Encryption of script files
You can limit iRidium Script viewing and editing by assigning an access password to it:
Password for editing
In the settings of iRidium projects (*.irpz) you can set up the password which will be required at each opening of the project. Thus, the project saves the possibility to be edited. Keep in mind that it is possible to import images and script files (do not forget to encrypt them) from *.irpz projects.
If the editor cannot be launched and writes "List index out of bounds (1)" – go to the register (Execute > regedit) and remove HKEY_CURRENT_USER\Software\iRidium mobile Ltd.\iRidium\2\GUI
If at project Emulation all fonts suddenly disappeared it is possible that you renamed or moved somewhere the initial project file. If you try to save such a file the fonts can be damaged. In this case you have to open the *.irpz project as a ZIP archive and delete the Fonts folder in the archive. At the next launch everything will be all right.
If you cannot find a link to the stream from the IP-camera or DVR, use open resources. More >>
You opened one popup and the other one closed automatically. It is how Popup Groups work in the alternative tree of pages. Change the way of displaying the tree in the right upper corner of Project Overview
You created Static List but buttons cannot be pressed when scrolling it. Use the Release event instead of Press and try not to use Trigger Button.
The command from the Move event is sent too often. Add Delay(100) ms before it and the command will be sent once in 100 ms. You can also select another interval.
You wrote a text in the item but it is not shown. Check that you write the text in the required State of the item and the text color is not transparent (see Text Color > the slider to the right: 255). If the slider is in position 0 by default, open Tools > Options > Default Control Settings > color settings and move the slider of color transparency to position 255. The problem will be solved.
You output the value on the item but it is shown as 0.00000. Change the tag "In Text" when assigning to the graphic item to In Value. In the text field write $V or another template.
You assigned a command to the button and it doesn’t work. Make sure that the events Active Touch or Bounding Box are indicated in the button settings (General > Hit). If you indicated Pass Through – the button will be "transparent", non-clickable.
Commands available in the drop-down lists File Project Tools Help View
File > New > New Panel Project
File > New > New Server Project
Open the settings: Tools > Options
"Emulator" - settings of Emulator in the editor
The mode of work with Emulator ( with connection to equipment or without it) is set up in the Client License section
"Showing" - settings of displaying in the editor workspace
"Scan" - settings of HDL Buspro network scanning
"File Operating" - settings of project auto save and backup, editor update and file import in Gallery
"Default Control Settings" - font settings for new items created with the help of the "Draw Item" tool