Tab

Kalipso - Developing - Form - Controls - Type - Tab

The Tab control allows you to add content to your Form, organized in different tabs. Only the content of one Tab will be visible at a time. The user can switch between Tabs either by clicking on corresponding the Tab header, or by swiping Left/Right over the Tab content.

Properties

Tab - General

Common

• Name - Name of the Control. This Name will be used to identify the Control throughout the Project. The name of the Control can only contain letters, digits or underscore (_).

• Text - Not applicable to this control.

• Description - Not applicable to this control.

• Plane - Plane of the Form where the Control should be created. Check the Planes chapter for more information.

• Visible - With this option selected, the control is (or is not) visible.

• Enabled - With this option selected, the control is (or is not) enabled. It may be visible (previous option), but it may not be enabled. In this case an event associated with the control is not executed

Layout

• X - x position of the Control from left

• Y - y position of the Control from top

• Width - Width of the Control.

• Height - Height of the Control

Miscellaneous

• Tab Title Position - Can be "Top" or "Bottom"

• Swipable - Activates the ability of the tab to be switched using a swipe of the finger across the device screen. It can be yes or no.

Style Appearance

• Background - Background color of the Control. You can set the color for the background.

You can set this value is runtime via the “Set Property” Action. You can retrieve this value in runtime via the “Get Property” Action.

On the right side of the Style section, you can choose templates with pre-defined styles or configurable ones. By clicking on this option, the following style possibilities for the label appear:

• Styles

  • None

  • Base

Text

• Font – Font of the displayed Text

• Size – Font size of the displayed Text

• Color - Font color of the displayed Text

• Properties – Font properties of the displayed Text (bold, italic, underline)

Border

• Border - Yes or No

Selection

• Line - Tab base selected row color

• Text - Tab base selected text color

Tab - Content

• Title height - Tab height is defined.

• Mode - Change mode to landscape or portrait.

In this area there are buttons available to add, edit and delete tabs.

Clicking on add or edit a tab the following window appears:

There you can create or edit the tab and define the style for it. You can also add an external icon.

Tab - Actions

For each control, actions can be associated. For this, with the control selected, it is possible to access this tab and associate an action to the control. For more information on the actions available and how to use them click here.‌‌‌‌‌

Shortcuts‌‌

• F2 - Actions

• F3 - General Properties