Comment on page
Divider
The Divider widget is a horizontal line that is used to visually separate widgets. For example, you could use it when displaying a list of products and messages and separating a header section from the content section of a page, etc.
Divider
Here's how you add the Divider widget to your project:
Adding Divider widget
You can customize the appearance and behavior of this widget using the various properties available under the properties panel.
To change the height and thickness of the Divider:
- 1.Select the Divider widget > move the Properties Panel > Divider Properties.
- 2.Find the Height property and enter the value to change the height of an overall Divider.
- 3.Now, find the Thickness property (next to the Height property) and enter the value.
Changing height and thickness
To customize the divider style, select the Divider widget > move the Properties Panel > Divider Properties > choose the Line Style.
This property accepts one of the following values:
- Solid: creates a solid line.
- Dotted: creates a dotted line.
- Dashed: creates a dashed line.
- Dashdotted: creates a pattern of alternate dashes and dots.
Choosing line style
To change the color, select the Divider widget > move the Properties Panel > Divider Properties > use the Color property.
Changing the Color
Sometimes you might want to add a little padding around Divider. Using the Indent and End-Indent properties, you can add left and right padding.
To add left and right padding:
- 1.Select the Divider widget > move the Properties Panel > Divider Properties.
- 2.Find the Indent property and enter the value. This will add left padding to the Divider.
- 3.Similarly, set the End-Indent property to add the right padding on Divider.
Adjust left and right padding
To control the width of the divider, select the Divider widget > move the Properties Panel > Divider Properties > use the Width property.
Controlling width
Last modified 4mo ago