Action Bar of a window

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 / Action Bar control

Overview of Action Bar
Creating and configuring an Action Bar
Bar style

WINDEV

WEBDEV

WINDEV Mobile

Others

See also

Action Bar of a window

Overview of Action Bar

Action Bars replace the title bar of a window and display different types of information:

the application icon,
the window title,
some menu options,
the drop-down menu of your window.

Creating and configuring an Action Bar

By default, windows are created with an Action Bar.

You can configure the bars used in the window:

Open the window description ("Description" option in the context menu).
On the "Style" tab, specify the content of the top bar:
- Full screen: no strikethrough,
- System bar only: Only the system bar is displayed.
- System Bar + Action Bar: System Bar and Action Bar are displayed.
- Action Bar only: Only the Action Bar is displayed.
- Sheet mode (iOS13 and +): if this type of bar is selected, the window can open from the bottom of the screen. The window remains "cascaded": it does not completely cover the window below. It can be closed simply by swiping it down.
  If this option is selected:
  the window has no bars in the editor.
  the "Allow closing" event is automatically associated with the window. If this event returns:
  True, the window is closed.
  False, the window is reactivated.
  Note: If this window is used in a version lower than iOS 13, the window is maximized and the close swipe has no effect.

Depending on the type of bar selected, the "Edit bar style" button allows you to set the style options used (color and font).

Remarks:

If you use the system bar, you can configure the system bar transparency on iOS 7 and later.
For iPhone X, you can shift the bars according to the sensor area.
Up to version 25Action Bar control fields are 48 px high by default.
Starting with new projects created in version 26Action Bar control height is set to 56 px by default. The default height can be selected in the project configuration description window: option "Action bar height" in the "General" tab.
Remarks:
- If the height is modified, the new height applies to all windows in the project.
- For more details on project configurations, see Project configuration.

Bar style

The "Edit bar style" button allows you to define the style options of the selected bars:

System bar.
Action Bar.
Navigation Bar.

If you use the system bar, you can configure:

background color: this color can be:
- a specific color, a system color or transparent.
  If the color is "Transparent", the color of the system bar is that of the Action Bar. This option is taken into account only if the window contains an Action Bar.
- adapted to the Action Bar. In this case, if the "Material design" skin template is used, the system bar uses the same color as the Action Bar, with a darker tone. Otherwise, the color of the Action Bar is used.
the text color.
whether the bar should be in overlay mode. If the "Bar overlay" option is checked, the origin of the controls is modified and the Opacity property can be used on the Action Bar control. The bar will be displayed over the controls.

If you use the Action Bar, you can configure:

background color: this can be a specific or automatic color.
the Action Bar shadow.
the font color.
whether the font color should be applied to the active icons.
the background image of the Action Bar.
if the bar should be displayed over the controls. If the "Bar overlay" option is checked, the origin of the controls is modified and the Opacity property can be used on the Action Bar control. The bar will be displayed over the controls.

If you use the navigation bar, you can configure the colors used for active and inactive elements.

Remarks:

This system bar color configuration is only available in Android 5.0 and later.
The bar color cannot be changed on Nexus devices.
Use the SystemBarColor property to programmatically change this color.

Related Examples:

Cross-platform examples (WINDEV Mobile): WM ToDo List

[ + ] This example is a manager of To-Do Lists.
The project is using the gestures in the loopers in order to move and delete the lists and tasks.
The data is stored in a HFSQL database.