Display modes of Tab control

ONLINE HELP
WINDEV, WEBDEV AND WINDEV MOBILE

Version:

Home | Sign in | English

Help / Developing an application or website / Controls, windows and pages / Controls: Available types / Tab control

Overview
Position of tabs
Display mode of tabs
The different modes
Shifting tab panes

WINDEV

WEBDEV

WINDEV Mobile

Others

See also

Display modes of Tab control

Overview

To optimize the style of your tabs, you have the ability to use images and colors. For more details, see Images and tab.

You also have the ability to use:

the position of tabs: at the bottom, at the top, on the left or on the right. This position can be combined with the orientation of the tab caption.
the display mode of the tabs.
the shift of panes in the editor.

Position of tabs

When creating a Tab control, the tab panes are positioned at the top of the control.

To modify this position:

Display the description window of Tab control.
In the "Details" tab, select the requested position:
- at the top,
- at the bottom,
- on the left,
- on the right.
Validate the control description window.

Remark: If you select a position on the left or on the right, the pane caption remains horizontal by default. To display this caption vertically, don't forget to modify the orientation of the caption in the "Style" tab of the control description:

Display the description window of Tab control.
In the "Style" tab, select the "Caption of active pane" element.
Modify the orientation of the font (0° by default).
Repeat operation 3 for the "Caption of inactive pane" element.

Display mode of tabs

The different modes

The Tab control proposes different display modes for the tabs:

the standard mode (by default): the tab panes are displayed on a line and if there is not enough space, the other tabs are displayed on an additional line:
the 3 panes mode with sliding: only 3 panes are displayed, and during the click on the first pane or on the last pane, this one moves in the middle:
the invisible panes mode: all the panes are invisible.
the standard mode with +/- buttons: the tab panes are displayed on a line and if there is not enough space, buttons appear, allowing the user to make the panes scroll. The style of these buttons can be modified in the "Style" tab of the control description ("Next/Previous buttons" element).

To define the display mode of tabs:

Display the description window of Tab control.
In the "Details" tab, select the requested display mode.
Validate the control description window.

Shifting tab panes

Regardless of the position of tab panes, you have the ability to shift them in the editor via a specific handle.

Therefore, if the tab panes are positioned:

At the top or at the bottom, they can be shifted to the right.
On the left or on the right, they can be shifted to the bottom.

The available space allows you to display a logo or a button used to expand options for example.

To shift the position of tab panes:

Select the Tab control.
A specific handle appears in the middle of the side of the first tab.
Select this handle and move it. The area found beside the first tab is enlarged and the different tabs are shifted (to the right or to the bottom according to the orientation of the panes).
The tab panes have been shifted.