-
-
Notifications
You must be signed in to change notification settings - Fork 26
Shape
Slab offers functions to draw basic shapes to a window. These shapes can complement the controls and provides some flexibility in the look the UI. For example usage of these shapes, refer to the Shapes section of the SlabTest window.
The rectangle shape is defined by its width and height. This shape can complement the button control by making the button invisible. The rounding for each corner can be defined as well.
Circles are drawn by defining a radius. Along with the color the number of segments can be set as well.
Triangles are drawn by defining a radius, which is the length from the center of the triangle to the 3 points. A rotation in degrees can be specified to rotate the triangle.
Lines are defined by two points. The function only takes in a single point which defines the end point while the start point is defined by the current cursor position. Both the line width and color can be defined.
Bezier curves can be defined through a set of points and added to a Slab window. The points given must be in local space. Slab will translate the curve to the current cursor position. Along with the ability to draw the curve, Slab offers functions to query information about the curve, such as the number of control points defined, the position of a control point, and the ability to evaluate the position of a curve given a Time value. There is also a function to evaluate the curve with the current X mouse position.
Polygons can be drawn by passing in a list of points into the Polygon function. The points, like the curve, should be defined in local space. Slab will then translate the points to the current cursor position.
Below is the list of functions for drawing shapes.
Draws a rectangle at the current cursor position for the active window.
Parameter | Type | Description |
---|---|---|
Options | Table\List of options that control how this rectangle is displayed. |
Option | Type | Description |
---|---|---|
Mode | String | Whether this rectangle should be filled or outlined. The default value is 'fill'. |
W | Number | The width of the rectangle. |
H | Number | The height of the rectangle. |
Color | Table | The color to use for this rectangle. |
Rounding | Number or Table | This value can either be a number or table. [Number] Amount of rounding to apply to all corners. [Table] Define the rounding for each corner. The order goes top left, top right, bottom right, and bottom left. |
Outline | Boolean | If the Mode option is 'fill', this option will allow an outline to be drawn. |
OutlineColor | Table | The color to use for the outline if requested. |
Segments | Number | Number of points to add for each corner if rounding is requested. |
Draws a circle at the current cursor position plus the radius for the active window.
Parameter | Type | Description |
---|---|---|
Options | Table | List of options that control how this circle is displayed. |
Option | Type | Description |
---|---|---|
Mode | String | Whether this circle should be filled or outlined. The default value is 'fill'. |
Radius | Number | The size of the circle. |
Color | Table | The color to use for the circle. |
Segments | Number | The number of segments used for drawing the circle. |
Draws a triangle at the current cursor position plus the radius for the active window.
Parameter | Type | Description |
---|---|---|
Options | Table | List of options that control how this triangle is displayed. |
Option | Type | Description |
---|---|---|
Mode | String | Whether this triangle should be filled or outlined. The default value is 'fill'. |
Radius | Number | The distance from the center of the triangle. |
Rotation | Number | The rotation of the triangle in degrees. |
Color | Table | The color to use for the triangle. |
Draws a line starting at the current cursor position and going to the defined points in this function.
Parameter | Type | Description |
---|---|---|
X2 | [Number | The X coordinate for the destination. |
Y2 | [Number | The Y coordinate for the destination. |
Option | [Table | List of options that control how this line is displayed. |
Option | Type | Description |
---|---|---|
Width | Number | How thick the line should be. |
Color | Table | The color to use for the line. |
Draws a bezier curve with the given points as control points. The points should be defined in local space. Slab will translate the curve to the current cursor position. There should two or more points defined for a proper curve.
Parameter | Type | Description |
---|---|---|
Points | Table | List of points to define the control points of the curve. |
Options | Table | List of options that control how this curve is displayed. |
Option | Type | Description |
---|---|---|
Color | Table | The color to use for this curve. |
Depth | Number | The number of recursive subdivision steps to use when rendering the curve. If nil, the default LÖVE 2D value is used which is 5. |
Returns the number of control points defined with the last call to Curve.
Return | Description |
---|---|
Number | The number of control points defined for the previous curve. |
Returns the point for the given control point index. This point by default will be in local space defined by the points given in the Curve function. The translated position can be requested by setting the LocalSpace option to false.
Return | Description |
---|---|
Number, Number | The translated X, Y coordinates of the given control point. |
Returns the point at the given time. The time value should be between 0 and 1 inclusive. The point returned will be in local space. For the translated position, set the LocalSpace option to false.
Parameter | Type | Description |
---|---|---|
Time | Number | The time on the curve between 0 and 1. |
Options | Table | A list of options that control what is returned by this function. |
Option | Type | Description |
---|---|---|
LocalSpace | Boolean | Returnes either the translated or untranslated control point. This is true by default. |
Return | Description |
---|---|
Number, Number | The X and Y coordinates at the given time on the curve. |
Returns the point on the curve at the given X-coordinate of the mouse relative to the end points of the curve.
Parameter | Type | Description |
---|---|---|
Options | Table | A list of options that control what is returned by this function. See the list of options under the EvaluateCurve function. |
Return | Description |
---|---|
Number, Number | The X and Y coordinates at the given X mouse position on the curve. |
Renders a polygon with the given points. The points should be defined in local space. Slab will translate the position to the current cursor position.
Parameter | Type | Description |
---|---|---|
Points | Table | List of points that define this polygon. |
Options | Table | List of options that control how this polygon is drawn. |
Option | Type | Description |
---|---|---|
Color | Table | The color to render this polygon. |
Mode | String | Whether to use 'fill' or 'line' to draw this polygon. The default is 'fill'. |