Skip to main content
Version: Next

Shapes

Shapes are static objects that can be added to 4D forms.

4D forms support the following basic shapes:

  • rectangles
  • lines
  • ovals

Rectangle

A static rectangle is a decorative object for forms. Rectangles are constrained to squared shapes.

The design of rectangles is controlled through many properties (color, line thickness, pattern, etc.). Specifically, the roundness of its corners can be defined.

JSON Example:

	"myRectangle": {
"type": "rectangle", //define the type of object
"left": 60, //left position on the form
"top": 160, //top position on the form
"width": 100, //width of the object
"height": 20, //height of the object
"borderRadius": 20 //define the roundness of the corners
}

Supported Properties

Bottom - Class - Corner radius - Dotted Line Type - Fill Color - Height - Horizontal Sizing - Left - Line Color - Line Width - Object Name - Right - Top - Type - Vertical Sizing - Visibility - Width

Line

A static line is a decorative object for forms, drawn between two plots. Lines can be horizontal, vertical, or of any angle shapes.

The design of lines is controlled through many properties (color, line thickness, etc.).

startPoint property

The startPoint JSON property defines from which coordinate to draw the line (see example).

the startPoint property is not exposed in the Property List, where the line drawing direction is visible.

JSON Examples:

	"myLine": {
"type": "line",
"left": 20,
"top": 40,
"width": 100,
"height": 80,
"startPoint": "topLeft", //first direction
"strokeDashArray": "6 2" //dashed
}

Result:

	"myLine": {
"type": "line",
"left": 20,
"top": 40,
"width": 100,
"height": 80,
"startPoint": "bottomLeft", //2nd direction
"strokeDashArray": "6 2" //dashed
}

Result:

Supported Properties

Bottom - Class - Dotted Line Type - Height - Horizontal Sizing - Left - Line Color - Line Width - Object Name - Right - startPoint - Top - Type - Vertical Sizing - Visibility - Width

Oval

A static oval is a decorative object for forms. Oval objects can be used to draw circular shapes (when width and height properties are equal).

JSON Example:

	"myOval": {
"type": "oval", //define the type of object
"left": 60, //left position on the form
"top": 160, //top position on the form
"width": 100, //width of the object
"height": 20, //height of the object
"fill": "blue" //define the background color
}

Supported Properties

Bottom - Class - Dotted Line Type - Fill Color - Height - Horizontal Sizing - Left - Line Color - Line Width - Object Name - Right - Top - Type - Vertical Sizing - Visibility - Width