Element

The ControlElement plugin is a user interface component derived from ControlBase, designed to display and interact with a single CanvasElement. It provides extensive customization through per-state visual offsets, colors, and configurable input margins to adjust interactive boundaries.

#include <interface/element/include/TellusimControlElement.h>

Example

The following example creates a stylized star-like shape with visual effects and embeds it into a ControlElement:

// create shape
CanvasShape shape(canvas);
shape.setMode(CanvasElement::ModeGradient);
shape.setStrokeStyle(StrokeStyle(2.0f, 2.0f, Color::black));
shape.setGradientStyle(GradientStyle(2.0f, Vector2f(0.0f, 0.0f), Color::white, Color::black));
shape.setTexCoord(-32.0f, 32.0f, -32.0f, 32.0f);

Vector3f old_position;
float32_t radius = 28.0f;
for(uint32_t j = 0; j < 9; j++) {
	float32_t angle = Pi2 * i / 15.0f + Pi2 * j / 8.0f;
	Vector3f position = Vector3f(Tellusim::sin(angle) * radius, Tellusim::cos(angle) * radius, 0.0f);
	if(j) {
		shape.addPosition(old_position);
		shape.addPosition((old_position + position) * 1.1f);
		shape.addPosition(position);
	}
	old_position = position;
}

// create element
radius *= 1.7f;
auto element = makeAutoPtr(new ControlElement(&grid));
element->setStateColor(Control::StateNormal, Color::white);
element->setStateColor(Control::StateFocused, Color::white * 1.25f);
element->setStateOffset(Control::StateFocused, Vector2f(0.0f, 4.0f));
element->setAlign(Control::AlignExpand | Control::AlignAspect | Control::AlignCenter);
element->setElementRect(Rect(-radius, radius, -radius, radius));
element->setElement(shape);