Composite
Composite is the visual-effects wrapper in the core widget set.
It lets you change how a child is presented after layout: opacity, translation, scale, rotation, clipping to bounds, and repaint boundaries all live here. That makes it the right tool for many animations and presentation effects, because the layout tree can stay stable while the composited appearance changes.
Use Composite when the change is visual rather than structural. Do not use it when the real problem is layout size or sibling arrangement. If the child needs different constraints or positioning, use layout widgets first.
Example
use fission::core::ui::{Composite, Text};
let node = Composite::new(Text::new("Saving...").into_node())
.opacity(0.72)
.translate_y(-4.0)
.into_node();
This changes presentation without changing where the surrounding layout thinks the child lives.
Field table
| Field | Type | Meaning | Notes / default behavior |
|---|---|---|---|
id | Option<NodeId> | Stable node identity. | Defaults to None. |
style | CompositeStyle | Visual presentation settings for the child. | Defaults to CompositeStyle::default(), which means no extra effect. |
child | Box<Node> | The wrapped child node. | Required. Composite::default() uses an empty spacer child. |
CompositeStyle fields
| Field | Type | Meaning | Notes / default behavior |
|---|---|---|---|
opacity | Option<CompositeScalar> | Alpha multiplier for the child. | None means fully opaque. |
translate_x | Option<CompositeScalar> | Horizontal visual translation. | Does not relayout siblings. |
translate_y | Option<CompositeScalar> | Vertical visual translation. | Does not relayout siblings. |
scale | Option<CompositeScalar> | Uniform visual scale. | None means 1.0. |
rotation | Option<CompositeScalar> | Visual rotation value. | Stored as a composited scalar rather than a full matrix. |
clip_to_bounds | bool | Whether compositing should respect the child's bounds as a clip. | Defaults to false. |
repaint_boundary | bool | Hint that the subtree should behave as its own repaint boundary. | Defaults to false. |
Behavior and advice
Composite lowers to a structural group with composite styling. That makes it a strong match for animated opacity, slide, and scale effects driven by stable widget identities. It is also usually easier to read than a raw Transform when you only need a common presentation effect.
Prefer Composite over Transform when the effect is one of the built-in named visual adjustments. Prefer Transform only when you already have a real 4x4 matrix or need matrix-level control.
Specific advice
Because Composite does not relayout siblings, it is easy to create a visual overlap by accident. That is often the right result for a fade or slide animation, but not for layout changes. When something should actually take more or less space, change the layout tree instead of trying to fake it with compositing.