The Cell control

ONLINE HELP
WINDEV, WEBDEV AND WINDEV MOBILE

Version:

Home | Sign in | English

This content has been translated automatically. Click here to view the French version.

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

Overview of the Cell control
Creating a Cell control
Cell with relative positioning
Swapping

WINDEV

WEBDEV

WINDEV Mobile

Others

See also

The Cell control

Overview of the Cell control

The Cell control contains controls.

In a WEBDEV site page, the Cell control can be used, for example, to:

define a color area. Controls can be positioned on this area.
The color (or the background image) of the cell can be selected in the "Style" tab of the description window of control.
move up the controls found below a Drawer control when it is collapsed.
communicate with the user.
Note: to communicate with the user, use Popup control.
define an HTML table in a static page, etc.

Remark: Fields are associated with a cell. The option "The control can be overlaid" must not be checked for the controls associated with the Cell control. Indeed, if this option is checked, the control will not be associated with the cell.

Creating a Cell control

To create a Cell control:

On the "Creation" tab, in the "Containers" group, click "Cell".
Click where the control will be created in the window or page. The control appears in the editor.

To view the characteristics of the control, select "Description" in the context menu.

New in version 2025

From version 2025 Update 1 onwards, it is possible to define the opacity of a Cell control via the control description window ("UI" tab) or via the Opacity property.

Cell with relative positioning

The Cell control can be used in "relative positioning" mode.

In this mode, the controls located inside the cell are dynamically positioned from left to right and from top to bottom according to their size. This mode is used to eliminate the empty space left by an invisible control.

To define a cell in "relative positioning" mode:

Display the description window of the cell.
On the "General" tab, specify the positioning of controls:
- Free (by default).
- Relative, from right to left.
- Relative, from left to right.
Type the size of inside margin of cell (in pixels) in the "Style" tab ("Margins" element).
Validate

Remark: In a relative positioning cell, expandable zone rules continue to apply.

Swapping

A Cell control can be created automatically from a selection:

Select the controls that must be included in the cell.
Under the "Modification" pane, in the "Transformations" group, pull down "Refactoring and swapping" and in the "Refactoring / create a field with selection" area, select "A Cell control".

Related Examples:

Unit examples (WEBDEV): The Cell control (Popup)

[ + ] This example explains how to display the details in a popup cell.
The details are displayed in a movable cell made visible during the click.

Unit examples (WEBDEV): Custom tooltip

[ + ] This example explains how to display a custom tooltip when an element is hovered by the mouse cursor.
The custom tooltip is a cell that is:
- displayed during the "Mouse over" event,
- hidden during the "Mouse out" event.

Unit examples (WEBDEV): The Cell control (Move)

[ + ] This example explains how to use a movable cell.
This cell is moved by the mouse or by programming.

Unit examples (WEBDEV): The Cell control (Animations)

[ + ] This example explains how to create "furtive cells" in your WEBDEV sites.
A furtive cell is a cell that appears at the bottom of the page and that remains displayed during a given time.
These cells can be used to display notifications, adverts...