flexalon.com | Documentation | Playground | Templates | Discord
Version 4.0 - UI Update: You can now use Flexalon to build UI under a Canvas, animate your layouts, and add click/drag interactions. Learn More.
Let’s reimagine how we build 3D experiences.
Flexalon components let you quickly arrange objects in adjustable 3D patterns at edit time and/or runtime. The power of layout doesn't need to be limited to 2D. Try it out in your browser by visiting the playground.
Design with Superpowers
Use Flexalon Animator Components to create immersive motion graphics that bring life to your games, interfaces, and cutscenes.
Effortless Integration
Flexalon won’t break your existing workflow, and doesn’t have any dependencies. Flexalon will only edit objects with Flexalon Layout Components attached.
You’re in Control
Choose if Flexalon should run at edit time, in game, or manually whenever you decide.
Flexalon Template Pack: A FREE addon to Flexalon that helps you get started quickly, with 16 working examples that you can study from and copy into your scenes! Download it at flexalon.com/templates.
=== FEATURES ===
Flexalon Objects
- Sizing: Precisely control width, height, and depth of objects.
- Fill & Shrink: Automatically size objects and layouts to fit the available space.
- Min / Max: restrict the size for objects and layouts.
- Margins and padding: Add empty space around objects and inside layouts.
Layouts
- Flexible Layout: Stack children linearly along the x, y, or z axis, with optional wrapping, alignment, gaps, and shrinking. Think CSS Flexbox in 3D.
- 3D Grid Layout: Arrange objects in evenly spaced rows, columns, and layers with rectangular or hexagonal cells.
- Circle Spiral Layout: Arrange objects in a circle, spaced evenly or at fixed intervals, with additional options to create a spiral or concentric circles.
- Curve Layout: Arrange objects along a line or Bézier curve with any number of points. Repeat the curve infinitely with 4 extension options.
- Random Layout: Randomize position, rotation, and size. Sometimes, you just need to make a mess.
- Align Layout: Align all children to any face, edge, or corner of the parent.
- Shape Layout: Arrange children in a shape formation with a specified number of sides. Great for unit formations and crowds.
- Constraints: Attach one object or layout to another, even if they are in different hierarchies.
- Custom Layouts: Create your own layouts by extending a base component.
Animators
- Curve Animator: Animate objects between layout positions with an adjustable animation curve.
- Lerp Animator: Animate objects between layout positions using linear interpolation.
- Rigid Body Animator: Animate rigid bodies towards layout positions using forces.
- Custom Animators: Create your own animation strategy by implementing an interface.
Click and Drag
- Flexalon Interactable: Add click and drag interactions which let users add, remove, and swap objects in layouts.
- XR Interactions: Built-in support for Oculus Interaction SDK and XR Interaction Toolkit. Drag objects with hands or controllers between layouts.
Data Binding
- Cloner: Generate objects based on a data source
- Data Binding: Implement an interface to update objects with data items.
Adapters
- Flexalon automatically works with:
- Mesh Renderer
- Sprite Renderer
- TextMeshPro
- Rect Transform (Including Canvas)
- Collider & Collider2D
- Custom Adapters: Implement an interface to make Flexalon work with your own components.
Attributions:
The 3D models and materials in the marketing videos are NOT included in the Flexalon 3D Layouts package. They come from other wonderful creators on the asset store, including:
