Danfoss IKUGRAPH Operating guide
User Manual
IKUGRAPH Application
User Interface Design Tool
www.danfoss.com
User Manual
IKUGRAPH User Interface Design Tool
Revision history |
Table of revisions |
|
|
|
|
|
|
|
Date |
Changed |
Rev |
|
|
|
|
|
July 2019 |
First edition. |
0101 |
|
|
|
|
2 | © Danfoss | July 2019 |
AQ307202838481en-000101 |
User Manual |
|
IKUGRAPH User Interface Design Tool |
|
Contents |
|
Introduction |
|
General Information........................................................................................................................................................................ |
4 |
Overview.............................................................................................................................................................................................. |
4 |
Menu bar.............................................................................................................................................................................................. |
5 |
Toolbox................................................................................................................................................................................................ |
6 |
Navigator bar..................................................................................................................................................................................... |
6 |
Canvas.................................................................................................................................................................................................. |
7 |
Properties panel................................................................................................................................................................................ |
8 |
Working with UI controls |
|
XPos – YPos Properties................................................................................................................................................................... |
9 |
XSize – YSize Properties............................................................................................................................................................... |
10 |
Delete key......................................................................................................................................................................................... |
10 |
Window tab properties |
|
General tab window...................................................................................................................................................................... |
11 |
Window view................................................................................................................................................................................... |
12 |
UI Controls |
|
Text...................................................................................................................................................................................................... |
13 |
Value................................................................................................................................................................................................... |
14 |
ProgressBar....................................................................................................................................................................................... |
15 |
Image.................................................................................................................................................................................................. |
16 |
IconMenu.......................................................................................................................................................................................... |
17 |
Input.................................................................................................................................................................................................... |
19 |
IconArray........................................................................................................................................................................................... |
20 |
TextMenu.......................................................................................................................................................................................... |
22 |
ImageFile........................................................................................................................................................................................... |
23 |
FileText............................................................................................................................................................................................... |
24 |
ImageTextCombo.......................................................................................................................................................................... |
25 |
Speedometer................................................................................................................................................................................... |
26 |
File Upload Through F2B |
|
Configuration file upload to TFT............................................................................................................................................... |
29 |
© Danfoss | July 2019 |
AQ307202838481en-000101 | 3 |
User Manual
IKUGRAPH User Interface Design Tool
Introduction
General Information
IKUGRAPH is a desktop application for Windows systems. This application is a user interface design tool to create definitions of the set of windows to use in the embedded equipment distributed by Danfoss RCT.
This document contains the full description of the interface and functionality included in the IKUGRAPH application. Each xml file represents one project and can contain many elements (windows, text, value, etc). The different elements that can be used are described in the document API_Ikugraph_v14.docx
•To launch the application, run this executable: Ikusi.Ikugraph.Desktop.exe
•To create a new project, select File > New from the menu bar.
•To load an existing project, select File > Open from the menu bar.
Overview
The Ikugraph user interface is made up of five primary areas: Menu and Navigation bars, Canvas, Toolbox and Properties panels.
Ikugraph user interface
4 | © Danfoss | July 2019 |
AQ307202838481en-000101 |
User Manual
IKUGRAPH User Interface Design Tool
Introduction
Menu bar
The menu bar contains the two main menu options: File and .
File menu
File menu performs actions on projects (create new, open previous project, save, etc). Each option is enabled depending of the project’s state.
New Starts a new project. If there is a project loaded, ask the user to save it.
Open Shows the explorer to select a XML/TCM file that contains a project definition. If there is a project loaded, ask the user to save it.
Save Shows the explorer to select a XML/TCM file that contains a project definition. If there is a project loaded, ask the user to save it.
Save as The user is prompted for a new file name, and the project is saved in that file. It can be saved in XML or TMC format.
Summary Obtain a word document with the API documentation, and the summary of the current project, containing the windows, components and commands available in the project.
Close Closes the application.
View menu
View menu changes the visibility of the areas in the interface. If the option is checked, the area is visible. In other case this area is hidden.
Toolbox |
Shows or hides the Toolbox panel. |
General |
Shows or hides the General tab in Properties panel. |
Window |
Shows or hides the Ventana tab in Properties panel. |
Control |
Shows or hides the Control tab in Properties panel. |
© Danfoss | July 2019 |
AQ307202838481en-000101 | 5 |
User Manual
IKUGRAPH User Interface Design Tool
Introduction
Toolbox
The Toolbox Panel is the long strip of UI controls in the left part of the window. It lists all of the UI control types that can be used in the design.
The main goal of the Toolbox Panel is to let you add UI controls to the canvas. To add a new UI control to the canvas, select the control type you wish to add then either drag it to the central canvas.
The Toolbox panel can be toggled on and off in several ways:
•clicking the icon X to the right of the panel (hide panel), 
•using the toggle option 
(minimize panel), or
•by selecting View > Toolbox from the application menu (hide/show panel).
Navigator bar
The navigator bar below toolbar shows the list of windows in your project.
The currently visible window is highlighted. The window with the “Visibility” property set to 1 is bordered with a yellow square.
The + button in the right side adds a new window to the project.
6 | © Danfoss | July 2019 |
AQ307202838481en-000101 |
User Manual
IKUGRAPH User Interface Design Tool
Introduction
Canvas
This is the main working area of the designer. Once you add UI controls to it, you can move them, resize them and tweak them until your UI design is ready.
To move items, it can be used the drag and drop option (by clicking the item to move and drag&drop it), or select the item and move it with the scroll keys of the keyboard.
You can select an item in the canvas by clicking it, moving between items with the tab key or selecting the item in the control list in the Window tab in properties panel.
To remove a window, use the Delete button in the Window properties panel.
The size of the window canvas is fixed, but it can be extended with a zoom option by clicking Ctrl + mouse central button.
© Danfoss | July 2019 |
AQ307202838481en-000101 | 7 |
User Manual
IKUGRAPH User Interface Design Tool
Introduction
Properties panel
The panel on the right side of the application (when shown) displays properties for the current project, selected window or control.
General, Window and Control properties panels
Depending on which control is selected it shows different properties.
It can be hidden by de-selecting both General, Window and Control in the View menu. It can be toggled with the icons on the right top of the panel 
8 | © Danfoss | July 2019 |
AQ307202838481en-000101 |
User Manual
IKUGRAPH User Interface Design Tool
Working with UI controls
To add UI controls to your canvas, click and drag a control from the Toolbox panel.
There are three different ways to select UI control from a canvas:
•clicking on the control
•using the keyboard’s TAB key the focus change between the controls inside the canvas.
•selecting the control in the control list in the windows properties panel
XPos – YPos Properties
Once you have selected one control, there are a few different ways to move it on the canvas:
•drag it with your mouse
•move it with your keyboard’s UP/DOWN/LEFT/RIGHT keys
•modify the XPOS – YPOS properties in the control properties panel
© Danfoss | July 2019 |
AQ307202838481en-000101 | 9 |
User Manual
IKUGRAPH User Interface Design Tool
Working with UI controls
XSize – YSize Properties
To resize the selected control there are two ways:
•you can just grab bottom right corner of the item and drag it.
•change the XSize – YSize properties in the control properties panel.
Delete key
To remove some UI control from the canvas, select it and hit the Delete key. Alternatively you can select Delete from the control properties panel.
10 | © Danfoss | July 2019 |
AQ307202838481en-000101 |
Loading...