Triangle
A simple colored triangle shape that fits within the specified dimensions.
Triangle extends Mesh to provide an easy way to create triangular graphics. The triangle points upward and automatically adjusts its vertices when width or height changes.
Vertex layout:
- Bottom-left corner at (0, height)
- Top center at (width/2, 0)
- Bottom-right corner at (width, height)
Common uses:
- UI arrows and indicators
- Play buttons
- Direction indicators
- Simple decorative elements
- Tooltips and speech bubble tails
// Create a simple triangle
var triangle = new Triangle();
triangle.size(50, 40);
triangle.color = Color.RED;
// Create a play button icon
var playButton = new Triangle();
playButton.size(30, 30);
playButton.rotation = 90; // Point right
playButton.color = Color.WHITE;
// Animated direction indicator
var arrow = new Triangle();
arrow.size(20, 30);
arrow.anchor(0.5, 0.5);
arrow.color = Color.YELLOW;
app.onUpdate(this, delta -> {
arrow.y = arrow.y + Math.sin(Timer.now * 2) * 2;
});
See: Mesh
Instance Members
new(): Void
Creates a new triangle.
The triangle is initialized with white color and vertices that will be positioned based on width/height.
Private Members
updateVertices(): Void
Updates vertex positions based on current width and height.
Positions the three vertices to form an upward-pointing triangle that fits exactly within the bounds.
Metadata
Name | Parameters |
---|---|
:build |
ceramic.macros.EntityMacro.buildForCompletion() |
:autoBuild |
ceramic.macros.EntityMacro.buildForCompletion() |
:build |
tracker.macros.EventsMacro.build() |
:autoBuild |
tracker.macros.EventsMacro.build() |