Divider-V
The Divider-V widget is a divider that separates content with a vertical line.
Use it to place a vertical boundary between items laid out side by side.
Definition and role
The Divider-V widget draws a thin vertical line that visually separates the content on its left and right. Set the line's thickness and color, the space above and below it, and the horizontal width it occupies.
- Category: Dividers (dividers and spacing)
- On drop: a vertical divider is drawn inside a
100 × 100SizedBox. (This SizedBox appears as a part in the Styles panel.) Because the divider properties such as thickness and color are unset, the line itself is drawn with the app theme's default style.
Features
| Feature | Description |
|---|---|
| Vertical separation | Draws a vertical line between content laid out horizontally to divide the areas. |
| Line style | Sets the line's thickness (thickness) and color (color). |
| Spacing and width | Adjusts the space above (indent) and below (endIndent) the line, plus the horizontal width it occupies (width). |
How to use
- Open the Dividers category in the left widget palette.
- Drag and drop the Divider-V item onto the canvas.
- In the properties panel on the right, set the line's thickness (
thickness) and color (color) to the values you want. - If needed, set the space above and below the line (
indentandendIndent) and its horizontal width (width).
Properties
| Property | Description | Default | Value / Type |
|---|---|---|---|
width | Horizontal width the divider occupies — the line is centered within this width | Not set | Number (px) |
thickness | Thickness of the line that's actually drawn | Not set | Number (px) |
indent | Empty space above the line, at its start | Not set | Number (px) |
endIndent | Empty space below the line, at its end | Not set | Number (px) |
color | Line color | Not set | Color |
Notes and tips
Leave every property empty (unset) and the line is drawn with the app theme's default divider style. To make the line stand out, set thickness and color yourself.
width isn't the thickness of the line itself — it's the horizontal width the divider occupies. Adjust the actual line thickness with thickness; the line is centered within that width.
Learn more
For the full set of Widget Controls (Property, Method, and Event) that let you drive this widget from a script, see Divider-V Widget Control.