Containers
Action Sheets
LiqActionSheet renders a translucent rounded panel of full-width action
rows. When cancelAction is provided, it is shown in a separate surface
below the main actions — matching the native iOS action sheet pattern.
Default
// ignore_for_file: file_names // hyphenated name required by snippet manifest conventionimport 'package:docs_snippets/src/snippet_frame.dart';import 'package:flutter/widgets.dart';import 'package:liqkit_ui/liqkit_ui.dart';/// Snippet builder consumed by `apps/docs_snippets/lib/src/routes.g.dart`.Widget actionSheetDefaultBuilder(BuildContext context) { return const _ActionSheetDefaultDemo();}class _ActionSheetDefaultDemo extends StatefulWidget { const _ActionSheetDefaultDemo(); @override State<_ActionSheetDefaultDemo> createState() => _ActionSheetDefaultDemoState();}class _ActionSheetDefaultDemoState extends State<_ActionSheetDefaultDemo> { bool _presented = true; @override Widget build(BuildContext context) { return SnippetFrame( maxWidth: 420, height: 410, surface: SnippetFrameSurface.liquidThemed, surfacePadding: EdgeInsets.zero, child: Stack( alignment: Alignment.bottomCenter, children: <Widget>[ _ShareSource(onPressed: () => setState(() => _presented = true)), AnimatedSlide( offset: _presented ? Offset.zero : const Offset(0, 1.08), duration: LiqMotion.normal, curve: LiqMotion.snappy, child: AnimatedOpacity( opacity: _presented ? 1 : 0, duration: LiqMotion.fast, child: LiqActionSheet( title: 'AirDrop', description: 'Share “Design Notes” with nearby people.', actions: <LiqAlertAction>[ LiqAlertAction( label: 'Share via AirDrop', onPressed: () => setState(() => _presented = false), ), LiqAlertAction( label: 'Copy Link', onPressed: () => setState(() => _presented = false), ), LiqAlertAction( label: 'Add to Reading List', onPressed: () => setState(() => _presented = false), ), ], ), ), ), ], ), ); }}class _ShareSource extends StatelessWidget { const _ShareSource({required this.onPressed}); final VoidCallback onPressed; @override Widget build(BuildContext context) { final isDark = LiqTheme.maybeOf(context)?.brightness == Brightness.dark; return Padding( padding: const EdgeInsets.all(20), child: Column( crossAxisAlignment: CrossAxisAlignment.stretch, children: <Widget>[ Text( 'Design Notes', textDirection: TextDirection.ltr, style: TextStyle( color: isDark ? const Color(0xFFF5F5F7) : const Color(0xFF000000), fontSize: 28, fontWeight: FontWeight.w700, ), ), const SizedBox(height: 12), Expanded( child: DecoratedBox( decoration: BoxDecoration( color: isDark ? const Color(0xCC1C1C1E) : const Color(0xCCFFFFFF), borderRadius: const BorderRadius.all(Radius.circular(22)), ), child: Padding( padding: const EdgeInsets.all(18), child: Text( 'A short document preview stays visible underneath the ' 'action sheet.', textDirection: TextDirection.ltr, style: TextStyle( color: isDark ? const Color(0xB2EBEBF5) : const Color(0xFF6E6E73), fontSize: 15, height: 1.35, ), ), ), ), ), const SizedBox(height: 14), LiqButton(label: 'Share', onPressed: onPressed), ], ), ); }}
With Cancel
// ignore_for_file: file_names // hyphenated name required by snippet manifest conventionimport 'package:docs_snippets/src/snippet_frame.dart';import 'package:flutter/widgets.dart';import 'package:liqkit_ui/liqkit_ui.dart';/// Snippet builder consumed by `apps/docs_snippets/lib/src/routes.g.dart`.Widget actionSheetWithCancelBuilder(BuildContext context) { return const _ActionSheetWithCancelDemo();}class _ActionSheetWithCancelDemo extends StatefulWidget { const _ActionSheetWithCancelDemo(); @override State<_ActionSheetWithCancelDemo> createState() => _ActionSheetWithCancelDemoState();}class _ActionSheetWithCancelDemoState extends State<_ActionSheetWithCancelDemo> { bool _presented = true; @override Widget build(BuildContext context) { return SnippetFrame( maxWidth: 420, height: 410, surface: SnippetFrameSurface.liquidThemed, surfacePadding: EdgeInsets.zero, child: Stack( alignment: Alignment.bottomCenter, children: <Widget>[ _PhotoSource(onPressed: () => setState(() => _presented = true)), AnimatedSlide( offset: _presented ? Offset.zero : const Offset(0, 1.08), duration: LiqMotion.normal, curve: LiqMotion.snappy, child: AnimatedOpacity( opacity: _presented ? 1 : 0, duration: LiqMotion.fast, child: LiqActionSheet( title: 'Share', actions: <LiqAlertAction>[ LiqAlertAction( label: 'Copy Link', onPressed: () => setState(() => _presented = false), ), LiqAlertAction( label: 'Save to Files', onPressed: () => setState(() => _presented = false), ), ], cancelAction: LiqAlertAction( label: 'Cancel', onPressed: () => setState(() => _presented = false), ), ), ), ), ], ), ); }}class _PhotoSource extends StatelessWidget { const _PhotoSource({required this.onPressed}); final VoidCallback onPressed; @override Widget build(BuildContext context) { final isDark = LiqTheme.maybeOf(context)?.brightness == Brightness.dark; return Padding( padding: const EdgeInsets.all(20), child: Column( crossAxisAlignment: CrossAxisAlignment.stretch, children: <Widget>[ Text( 'Photo', textDirection: TextDirection.ltr, style: TextStyle( color: isDark ? const Color(0xFFF5F5F7) : const Color(0xFF000000), fontSize: 28, fontWeight: FontWeight.w700, ), ), const SizedBox(height: 12), const Expanded( child: DecoratedBox( decoration: BoxDecoration( borderRadius: BorderRadius.all(Radius.circular(22)), gradient: LinearGradient( begin: Alignment.topLeft, end: Alignment.bottomRight, colors: <Color>[ Color(0xFFFF6B8A), Color(0xFF2F8DFF), Color(0xFF58D68D), ], ), ), ), ), const SizedBox(height: 14), LiqButton(label: 'Open actions', onPressed: onPressed), ], ), ); }}
Standard
// ignore_for_file: file_namesimport 'package:docs_snippets/src/snippet_frame.dart';import 'package:flutter/widgets.dart';import 'package:liqkit_ui/examples.dart';Widget actionSheetStandardBuilder(BuildContext context) { return const SnippetFrame(child: ActionSheetStandardExample());}
With Title
// ignore_for_file: file_namesimport 'package:docs_snippets/src/snippet_frame.dart';import 'package:flutter/widgets.dart';import 'package:liqkit_ui/examples.dart';Widget actionSheetWithTitleBuilder(BuildContext context) { return const SnippetFrame(child: ActionSheetWithTitleExample());}
Destructive
// ignore_for_file: file_namesimport 'package:docs_snippets/src/snippet_frame.dart';import 'package:flutter/widgets.dart';import 'package:liqkit_ui/examples.dart';Widget actionSheetDestructiveBuilder(BuildContext context) { return const SnippetFrame(child: ActionSheetDestructiveExample());}
With Icons
// ignore_for_file: file_namesimport 'package:docs_snippets/src/snippet_frame.dart';import 'package:flutter/widgets.dart';import 'package:liqkit_ui/examples.dart';Widget actionSheetWithIconsBuilder(BuildContext context) { return const SnippetFrame(child: ActionSheetWithIconsExample());}
Scrollable
// ignore_for_file: file_namesimport 'package:docs_snippets/src/snippet_frame.dart';import 'package:flutter/widgets.dart';import 'package:liqkit_ui/examples.dart';Widget actionSheetScrollableBuilder(BuildContext context) { return const SnippetFrame(child: ActionSheetScrollableExample());}
Compact
// ignore_for_file: file_namesimport 'package:docs_snippets/src/snippet_frame.dart';import 'package:flutter/widgets.dart';import 'package:liqkit_ui/examples.dart';Widget actionSheetCompactBuilder(BuildContext context) { return const SnippetFrame(child: ActionSheetCompactExample());}