Danfoss IKUGRAPH Operating guide

User Manual
IKUGRAPH Application
User Interface Design Tool
www.danfoss.com
User Manual
Revision history Table of revisions
Date Changed Rev
July 2019 First edition. 0101
2 | © Danfoss | July 2019 AQ307202838481en-000101
User Manual

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

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
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
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.

Navigator bar

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).
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
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
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

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
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...
+ 22 hidden pages