Hierarchical Editor features

SmartDevicesPlus hierarchical editor works for both "Panel for Smart Devices" and "Work With for Smart Devices" pattern.

This editor contains a tree view which combined with GeneXus default layout editor provides several new functionalities.

In this section we describe some of the funcionalities available in the editor's tree view.

Edit the applied template option:

With this option you can change the applied template for the layout:

PowerInEditorImg04

Add items directly in the tree:

This functionality allows user to add controls in the panel's layout in a simple way:

PowerInEditorImg01

Drag and Drop in the tree:

This functionality allows the user to move nodes directly in the hierarchical tree and see the change reflected in the layout.

For example we have the following "Panel for Smart Devices". When you move the textblock Filter1Text, the change is reflected in the layout:

PowerInEditorImg02

PowerInEditorImg03

Reorder controls in table

Moving controls inside a table can be very difficult using the default layout editor. SmartDevicesPlus provides two mechanisms to simplify this task:

Drag and Drop

User can drag and drop any control inside a table using the mouse. Once the the control is dropped in the destination, SmartDevicesPlus will reorder the controls so that the dragged control is placed in the position where it was dropped, keeping the rest of the controls ordered as before.

In the following example, user wants to move the ProductPhotoH attribute  up, so it becames the first attribute in the table.

Simply drag the ProductPhotoH attribute in the tree view, and drop it over the ProductId attribute.

EditorKeyFunctionalitiesImg01

Then, SmartDevicesPlus will rearrange the controls, producing the following outcome:

EditorKeyFunctionalitiesImg02

Keyboard reorder 

User can also reorder controls in a table using the keyboard.

For this, select the control that wants to be moved and press ctrl + UP to move the control up, and ctrl + DOWN to move the control down (UP and DOWN are the standard keyboard keys)

Using the keyboard allows user to move controls one position at a time.

EditorKeyFunctionalitiesImg03

Number of columns

SmartDevicesPlus editor allows the user to change the number of columns in a table, rearranging the content of the table according the the content and the new columns amount.

To change the number of columns in a table select the table in SmartDevicesPlus tree view editor. This will display a new property in GeneXus properties grid editor.

EditorKeyFunctionalitiesImg04

Change the value of the Number of columns property and then SmartDevicesPlus will automatically rearrange the controls.

In the following example, user wants to display the attributes using 2 columns instead of 1:

EditorKeyFunctionalitiesImg05

Column width and row height

SmartDevicesPlus editor allow user to easily view and edit the width of the column and the height of the row that contains the selected control.

Row height can't be modified if control's Row Span property is greater than "1".

Column width can't be modified if control's Col Span property is greater than "1".

In the following example, user sets the "Row height" property to "35dip" to the ProductName attribute.

EditorKeyFunctionalitiesImg06

This will automatically change the height of the second row in ProductPrice parent table (SectionData1_1 )

EditorKeyFunctionalitiesImg07

Visible Condition

SmartDevicesPlus Hierarchical Editor allows to define whether an attribute/variable will be visible or not:

EditorKeyFunctionalitiesImg08

When you define a Visible Condition, SmartDevicesPlus is going to automatically create a Sub called EvalVisibleConditons where every condition is verified:

EditorKeyFunctionalitiesImg09

You can call this Sub, for example, from the event “ControlValueChanged” or in any other event where you may need it.
In addition, SmartDevicesPlus sets the “Invisible Mode” of the control to “Collapse space” so the user won’t see “blank” spaces when the control is hidden:

EditorKeyFunctionalitiesImg10

Is Required

SmartDevicesPlus Hierarchical Editor allows to define whether an attribute/variable will be mandatory or not:

EditorKeyFunctionalitiesImg11

When this property is set to “True”, SmartDevicesPlus is going to automatically create a Sub called CheckRequired where is verified if every required attribute was fulfilled by the user or not:

EditorKeyFunctionalitiesImg12

You should call this subroutine before saving data, for example:

EditorKeyFunctionalitiesImg13

In addition, SmartDevicesPlus sets the “Invite Message” of the so the user, in runtime, can visualize that the field is required:

EditorKeyFunctionalitiesImg14

Search in Hierarchical Editor

The possibility to search within the items of the Hierarchical Editor was added. 

By using this features will be able to easily find the controls and items of your layout and so edit them:

EditorKeyFunctionalitiesImg15