Widget Designer > Widgets > Shape

Shape

Navigation:  Widget Designer > Widgets >

Shape

prev main next

Navigation:  Widget Designer > Widgets >

Shape

prev main next

Please wait. Due to its content this page might take a while to load...

Shapes can be used for highlighting elements in the user interface, to group widgets, to subdivide areas or simply as a decorative item.

wd_widget_shape

To create a Shape widget choose "Widgets > Shapes > Ellipse or Rectangle or Rounded Rectangle". The mouse cursor changes to a crosshairs icon, indicating the create mode. With a left-click anywhere on the empty main background window you add the selected widget to the current page. Left-click again if you like to add one more. To quit the create mode, you can switch to the run mode with [F8], where you can use all widgets.

To edit the Shape parameters simply right-click on the desired Shape Widget and choose the menu entry "Item Properties", press [ALT+P] whilst the mouse is hovering above it or double-click on it when being in the edit / move mode ([F9]). The Shape Property Dialog opens up.

wd_widget_shape-properties

General Widget Settings

Name:

A unique name can be entered to identify the widget via the Object and Member Notation. The default name is based on the widget type and ID.

Page:

This drop-down offers all available pages to place the widget on.

ID:
The Shape’s ID may be changed by entering a new one in the text field top left. If you change it, you will be asked if you also want to adapt the name to the new ID.

Notes:

A short note can be added here. It is not displayed outside the widget but can be set and retrieved with the WidgetID.Note property member.

Visible:

Uncheck this box to hide the widget.

Fix:
When the option “Fix” is checked, the Shape will be displayed on every page.

Size:

Enter a pixel size for the Shape's size.

X and Y:

Enter the location of the widget (upper left corner) in pixels

Shape Properties

Style:

You can choose one out of three designs: ellipse, rectangle and rounded rectangle

Fill Color:

Check this box to activate the fill color, a color picker for changing the hue will open when you click on the small box on the right.

Line Color:

Check this box to activate the line color, a color picker for changing the hue will open when you click on the small box on the right.

Line Size:

Enter here the thickness of the outline in pixels.

Opacity:

Enter the transparency for the widget, "255" equals not transparent at all while "0" means completely transparent.

Corner:

This parameter is only available for rounded rectangle Shapes and specifies the rotundity of the corners. A value of "0" would be a straight rectangle, increasing the value leads to more rounded corners.

Prevent Selection:

Check this box to avoid selecting the widget. It then can't be selected when in moving mode, except with a right-click directly on the Shape. Ticking this box also has the effect that the Shape's Z-position is being sent to the back.

Ui Effects & Animations

CSS based effects and animations can be applied to this widget. Please refer to the topic Effects & Animations for more information.