GlassSheet class

A glass morphism bottom sheet following Apple's iOS 26 design patterns.

GlassSheet provides a modal bottom sheet with liquid glass effect, drag indicator, and iOS-style dismiss behavior.

Key Features

• Liquid glass backdrop with blur effect
• Draggable dismissal
• Rounded top corners
• iOS-style drag indicator (pill)
• Safe area handling
• Customizable height and snap points
• Interaction suppression for child widgets (Smart Silence)

Usage

Basic Usage

GlassSheet.show(
  context: context,
  builder: (context) => const Column(
    mainAxisSize: MainAxisSize.min,
    children: [
      Text('Bottom Sheet Title'),
      Text('Content goes here'),
    ],
  ),
);

Smart Interaction (New)

To prevent the sheet from scaling when tapping internal buttons:

GlassSheet.show(
  context: context,
  suppressInteractionOnChildren: true,
  builder: (context) => Column(
    children: [
      GlassInteractionSilence(
        child: GlassButton(
          onTap: () => print('Button tapped without sheet scale!'),
          child: Text('Silent Button'),
        ),
      ),
    ],
  ),
);

Advanced Interactivity & Styling

Customise the look and feel with glow effects, scaling, and specific glass settings:

GlassSheet.show(
  context: context,
  borderRadius: 40,
  margin: const EdgeInsets.all(12),
  interactionScale: 1.05,
  enableInteractionGlow: true, // Glint follows finger
  enableSaturationGlow: true,  // Pulsation on touch
  settings: const LiquidGlassSettings(
    blur: 20,
    saturation: 1.8,
  ),
  builder: (context) => const Column(
    children: [
      Text('High Fidelity Glass'),
    ],
  ),
);

Solid Color Mode

Customize barrier and glass effect:

GlassSheet.show(
  context: context,
  settings: const LiquidGlassSettings(blur: 20, thickness: 40),
  barrierColor: Colors.black87,
  builder: (context) => const Text('Custom Glass'),
);