Transform

Fission

Product

▾

Setup

›

›

Transform is the low-level matrix-transform wrapper.

It applies a raw 4x4 transform matrix to one child. This is useful when you already have matrix math from another part of the system and want to feed that matrix directly into the widget tree.

Most app authors should not reach for Transform first. If you want common presentation effects such as opacity, translation, scale, or rotation, Composite is usually easier to read and easier to animate.

Example

use fission::prelude::*;
let matrix = [
    1.0, 0.0, 0.0, 12.0,
    0.0, 1.0, 0.0,  0.0,
    0.0, 0.0, 1.0,  0.0,
    0.0, 0.0, 0.0,  1.0,
];

let widget: Widget = Transform::new(
    Text::new("Translated visually").into(),
    matrix,
)
.into();

Field table

Field	Type	Meaning	Notes / default behavior
id	Option<WidgetId>	Stable widget identity.	Defaults to None.
transform	[f32; 16]	Raw 4x4 transform matrix.	Defaults to the identity matrix.
child	Widget	The transformed child.	Required. Default uses an empty spacer child.

Behavior and advice

Transform forwards the same layout constraints to its child and applies the matrix as a visual transform. Like Composite, it does not relayout siblings around the transformed result.

That makes it appropriate for advanced rendering flows, but also easier to misuse than higher-level helpers. If the transformation is really part of layout rather than presentation, change the layout tree instead.

Specific advice

Prefer Composite unless you already need raw matrix control. Matrix-heavy code is harder for teammates to scan, so it is worth paying that complexity cost only when it buys something real.

Production checklist

For Transform, review the fields that change behavior before treating the widget as finished: id, transform, child. The goal is to make the product rule visible in state and actions, not hidden inside ad-hoc construction code.

•

If this widget appears inside an interactive flow, keep the surrounding action binding in the parent component and test that the flow still has one clear reducer path.

•

When child widgets are generated from data, give reordered or filtered rows an explicit WidgetId so retained local state and scroll behavior do not drift between items.

•

Set id only when identity must be stable across filtering, reordering, diagnostics, or tests; otherwise let Fission derive identity from structure.

•

Check the semantics tree for the user-facing label or role that makes this widget understandable without relying only on pixels.

•

Add at least one component or harness test that confirms the visible text, semantic role, action dispatch, and layout constraint that matter for this widget in context.

If a screen starts repeating the same Transform setup, extract a named component around this widget. That keeps the reference API small while making product code easier to read and safer for generated code to copy.

Composite, Clip, and Container.