CNFloatingIsland class

A floating pill widget inspired by Apple's Dynamic Island.

The floating island can morph between a compact and expanded state with smooth spring animations. It's perfect for notifications, music controls, or any floating UI element.

Example:

CNFloatingIsland(
  collapsed: Row(
    children: [
      Icon(Icons.music_note),
      SizedBox(width: 8),
      Text('Now Playing'),
    ],
  ),
  expanded: Column(
    children: [
      Image.asset('album_art.png'),
      Text('Song Title'),
      MusicControls(),
    ],
  ),
  onTap: () => controller.toggle(),
)
Inheritance
Available extensions

Constructors

CNFloatingIsland({Key? key, required Widget collapsed, Widget? expanded, bool isExpanded = false, VoidCallback? onTap, ValueChanged<bool>? onExpandStateChanged, CNFloatingIslandPosition position = CNFloatingIslandPosition.top, double collapsedHeight = 44.0, double? collapsedWidth, double? expandedHeight, double? expandedWidth, double? cornerRadius, Color? tint, Duration animationDuration = const Duration(milliseconds: 400), double springDamping = 0.8, double springResponse = 0.4, EdgeInsets margin = const EdgeInsets.all(16), CNFloatingIslandController? controller})
Creates a floating island.
const

Properties

animationDuration Duration
Duration of the expand/collapse animation.
final
collapsed Widget
Content shown when collapsed (compact mode).
final
collapsedHeight double
Height when collapsed.
final
collapsedWidth double?
Width when collapsed. If null, uses intrinsic width.
final
controller CNFloatingIslandController?
Controller for programmatic control.
final
cornerRadius double?
Corner radius. Defaults to half of collapsedHeight for pill shape.
final
expanded Widget?
Content shown when expanded. If null, only collapsed content is shown.
final
expandedHeight double?
Height when expanded. If null, uses intrinsic height.
final
expandedWidth double?
Width when expanded. If null, fills available width minus margins.
final
hashCode int
The hash code for this object.
no setterinherited
isExpanded bool
Whether the island is currently expanded.
final
key Key?
Controls how one widget replaces another widget in the tree.
finalinherited
margin EdgeInsets
Margin around the floating island.
final
onExpandStateChanged ValueChanged<bool>?
Called when the expand state changes.
final
onTap VoidCallback?
Called when the island is tapped.
final
position CNFloatingIslandPosition
Position of the floating island.
final
runtimeType Type
A representation of the runtime type of the object.
no setterinherited
springDamping double
Spring damping for the animation (0.0 - 1.0).
final
springResponse double
Spring response time for the animation.
final
tint Color?
Tint color for the glass effect.
final

Methods

createElement() StatefulElement
Creates a StatefulElement to manage this widget's location in the tree.
inherited
createState() State<CNFloatingIsland>
Creates the mutable state for this widget at a given location in the tree.
override
debugDescribeChildren() List<DiagnosticsNode>
Returns a list of DiagnosticsNode objects describing this node's children.
inherited
debugFillProperties(DiagnosticPropertiesBuilder properties) → void
Add additional properties associated with the node.
inherited
liquidGlass({CNGlassEffect effect = CNGlassEffect.regular, CNGlassEffectShape shape = CNGlassEffectShape.capsule, double? cornerRadius, Color? tint, bool interactive = false}) Widget

Available on Widget, provided by the LiquidGlassExtension extension

Applies a Liquid Glass effect to this widget.
noSuchMethod(Invocation invocation) → dynamic
Invoked when a nonexistent method or property is accessed.
inherited
toDiagnosticsNode({String? name, DiagnosticsTreeStyle? style}) DiagnosticsNode
Returns a debug representation of the object that is used by debugging tools and by DiagnosticsNode.toStringDeep.
inherited
toString({DiagnosticLevel minLevel = DiagnosticLevel.info}) String
A string representation of this object.
inherited
toStringDeep({String prefixLineOne = '', String? prefixOtherLines, DiagnosticLevel minLevel = DiagnosticLevel.debug, int wrapWidth = 65}) String
Returns a string representation of this node and its descendants.
inherited
toStringShallow({String joiner = ', ', DiagnosticLevel minLevel = DiagnosticLevel.debug}) String
Returns a one-line detailed description of the object.
inherited
toStringShort() String
A short, textual description of this widget.
inherited

Operators

operator ==(Object other) bool
The equality operator.
inherited