liqkit_ui
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());}