three_d_ui_builder library
three_d_ui_builder
Build futuristic 3D UIs with Flutter-native widgets. 3D buttons, flipping cards, circular menus, cube containers — all with a familiar Flutter-style API. No OpenGL knowledge required.
Quick start
import 'package:three_d_ui_builder/three_d_ui_builder.dart';
// 3D press button
ThreeDButton(
label: const Text('Press me'),
depth: 8,
faceColor: Colors.deepPurple,
onPressed: () {},
)
// Flip card
FlipCard3D(
front: FrontWidget(),
back: BackWidget(),
)
// Circular carousel
CircularList3D(
itemCount: 6,
radius: 200,
itemBuilder: (_, i) => ItemCard(i),
autoRotate: true,
)
Classes
- AxisGizmo
- A Widget that draws a 3-D axis gizmo (X/Y/Z arrows) in the centre of its parent, controlled by the current rotation matrix.
- CameraController
- Manages the view-space camera used by ThreeDSceneWidget.
- CanvasBridge
- Provides helpers that bridge Flutter's 2-D Canvas with the perspective transforms needed by 3-D widgets.
- CircularList3D
- A carousel that arranges its items on a circular ring in 3-D space.
- ContinuousRotationAnimation
- An Animation that continuously rotates around axis at radiansPerSecond.
- CoverFlow3D
- The classic iTunes CoverFlow effect: a horizontal list where adjacent cards are rotated around the Y-axis, giving depth to the selected item.
- CubeContainer
- An interactive 3-D cube where each of the six faces is an independent widget. The cube can be freely rotated by dragging, or programmatically navigated to show a specific face.
- CubeContainerState
- CubeController
- Programmatic control handle for CubeContainer.
- CylinderList
- A scrollable cylindrical picker where items are arranged on the surface of a vertical cylinder. Items in the centre of the visible arc appear full- size; items toward the edges wrap away and appear smaller with perspective.
- DebugBanner3D
- A banner-style overlay that shows performance / render debug information.
- DepthCard
- A card built from multiple stacked layers, each rendered at a different physical depth so hovering or tilting reveals genuine 3-D separation.
- DepthEntry
- A single layer in a Stack3D.
- DepthLayer
- A single depth layer in a DepthCard.
- DepthShadowStyle
- Describes how depth shadows are rendered on 3-D widgets.
- DepthSorter
- Sorts a list of ThreeDObjects by depth (Z-axis) so that objects farther from the viewer are drawn first (painter's algorithm).
- Drag3DRecognizer
- Converts a 2-D pointer drag into a 3-D arcball rotation.
- EdgePainter
- A CustomPainter that draws the visible edges of a 3-D wireframe polygon, projected onto 2-D using a simple perspective transform.
- ExtrudedText
- Renders text that appears to be physically extruded — i.e., it has real depth like raised lettering on a metal plate.
- FlipAnimationBuilder
- A builder widget that applies a perspective-corrected flip transform to frontChild and backChild based on animation.
- FlipCard3D
- A card that flips between a front and back face with a true perspective- corrected 3-D rotation animation.
- FlipCard3DController
- Programmatic control handle for FlipCard3D.
- FlipCard3DState
- FloatAnimation
- An Animation<double> that produces a sinusoidal float value in the range [-amplitude, +amplitude].
- Floater
- Convenience widget that applies a continuous float animation to child.
- FloatingAction3D
- A Floating Action Button variant with a 3-D depth slab and a continuous floating pulse animation.
- FloatingLabel
- A text label that continuously bobs up and down as if floating in zero gravity.
- GyroscopeTilt
- Listens to the device gyroscope and exposes a smoothed tilt offset as a ValueNotifier<Offset>.
- HitTest3D
- Provides hit-testing utilities for 3-D objects projected onto a 2-D screen.
- IconButton3D
- An icon button that rotates 360° around its vertical axis on each tap, with a 3-D depth slab and a subtle wobble on hover.
- LightSource
- Describes a light source in the 3-D scene.
- Material3D
- Describes the physical surface properties of a 3-D widget.
- Panel3D
- A flat panel with a convincing 3-D depth illusion created by:
- ParallaxCard
- A card whose background and content move at different speeds as the user tilts or drags, producing a window-through-a-scene parallax illusion.
- ParallaxLayer
- A single layer in a TiltCard parallax stack.
- PerspectiveUtils
- A collection of pure-function helpers for perspective calculations used throughout the widget and painter layers.
- PinchDepthRecognizer
- Converts a two-finger pinch gesture into a Z-depth (zoom) delta.
- Quat
- An immutable unit quaternion that represents a 3D rotation.
- ReflectionPainter
- A CustomPainter that draws a fake specular reflection streak on a surface.
- RenderPipeline
- Manages the per-frame update cycle for ThreeDScene-based rendering.
- RotationAnimation
- An Animation subclass that interpolates a rotation angle in radians, returning the result as a Quat.
- SceneRenderer
- A StatefulWidget that listens to a ThreeDScene and re-renders its children whenever the scene changes.
- ShadowPainter3D
- A CustomPainter that draws a dynamic contact shadow on the ground plane beneath a 3-D object.
- SphereMenu
- A radial menu whose items are distributed evenly across the surface of a virtual sphere using Fibonacci sphere packing.
- SphereMenuItem
- A single item in a SphereMenu.
- Spring3D
- Produces a physics-based spring animation between two Transform3D values.
- SpringTransform3D
- A convenience widget that plays a spring animation whenever targetTransform changes.
- Stack3D
- A Stack-like container that renders its children at distinct Z-depth positions, creating genuine spatial separation.
- ThreeDButton
- A button with a real 3-D depth effect that physically presses in on tap.
- ThreeDObject
- The base data class for every object living inside a ThreeDScene.
- ThreeDScene
- A ChangeNotifier that manages a collection of ThreeDObjects.
- ThreeDSceneWidget
- The root widget for a widget-based 3-D scene.
- ThreeDTheme
- An InheritedWidget that propagates ThreeDThemeData down the widget tree.
- ThreeDThemeData
- The immutable data object carried by ThreeDTheme.
- ThreeDWidget
- Abstract base class for every three_d_ui_builder widget that lives in 3-D space.
- TiltCard
- A card that tilts to follow either finger drag or the device gyroscope, creating a genuine parallax depth illusion.
- Transform3D
- Represents a full 3-D transform: position, rotation, and non-uniform scale.
- Transform3DTween
- A Tween that interpolates between two Transform3D values.
- Vec3
- A lightweight, immutable 3-component vector used throughout three_d_ui_builder.
Enums
- Axis3DRotation
- The axis around which IconButton3D spins.
- CubeFace
- Identifies one of the six faces of a CubeContainer.
- FlipAxis
- The rotation axis used by FlipCard3D.
- LightType
- The type of a LightSource.
- RotationDirection
- Auto-rotation direction for CircularList3D.
- TiltSource
- Controls where tilt data comes from.
Extensions
- Matrix4Ext on Matrix4
- Extension methods on Flutter's Matrix4 that simplify common 3-D operations needed by the widget layer.
- Vec3VectorMathExt on Vec3
-
Convenience extensions on Vec3 to convert to/from
vector_mathtypes. - Vector3ToVec3 on Vector3
-
Converts a
vector_mathvm.Vector3back to our Vec3.
Typedefs
- FrameCallback = void Function(Duration timestamp)
- A callback type received by RenderPipeline.addCallback.