awaitware_ui_utilities 4.0.6

A powerful Flutter UI toolkit with 1500+ chainable extension methods for beautiful, responsive UIs. Spacing, colors, typography, animations, and more.

example/lib/main.dart

import 'package:flutter/material.dart';
import 'package:awaitware_ui_utilities/awaitware_ui_utilities.dart';

// v1.0 Basic Examples
import 'examples/spacing_example.dart';
import 'examples/color_example.dart';
import 'examples/typography_example.dart';
import 'examples/sizing_example.dart';
import 'examples/decoration_example.dart';
import 'examples/layout_flex_example.dart';
import 'examples/transform_example.dart';
import 'examples/visibility_gesture_example.dart';

// v2.0 Advanced Examples
import 'examples/responsive_grid_example.dart';
import 'examples/gradient_example.dart';
import 'examples/animation_example.dart';
import 'examples/dark_mode_example.dart';
import 'examples/button_card_preset_example.dart';
import 'examples/custom_values_example.dart';

// v3.0 Component Examples
import 'examples/form_input_example.dart';
import 'examples/image_example.dart';
import 'examples/shimmer_skeleton_example.dart';
import 'examples/badge_chip_example.dart';
import 'examples/avatar_example.dart';
import 'examples/dialog_example.dart';
import 'examples/list_tile_example.dart';
import 'examples/divider_example.dart';
import 'examples/clip_shape_example.dart';
import 'examples/scroll_example.dart';
import 'examples/tooltip_popup_example.dart';
import 'examples/accessibility_example.dart';

// v4.0 Navigation & Advanced Examples
import 'examples/navigation_example.dart';
import 'examples/sliver_example.dart';
import 'examples/table_example.dart';
import 'examples/stepper_timeline_example.dart';
import 'examples/drag_drop_example.dart';
import 'examples/i18n_example.dart';
import 'examples/platform_adaptive_example.dart';

// Helpers & Real World
import 'examples/aw_helper_example.dart';
import 'examples/real_world_example.dart';

void main() => runApp(const MyApp());

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Awaitware UI Utilities Demo',
      theme: ThemeData(primarySwatch: Colors.blue, useMaterial3: true),
      home: const DemoHomePage(),
    );
  }
}

class DemoHomePage extends StatelessWidget {
  const DemoHomePage({super.key});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('Awaitware UI Utilities'),
        backgroundColor: Colors.blue.shade600,
        foregroundColor: Colors.white,
      ),
      body: ListView(
        children: [
          // Header
          Column(
            children: [
              const Text('Awaitware UI Utilities')
                  .text3Xl()
                  .fontBold()
                  .textWhite()
                  .textCenter(),
              const Text('1500+ Extension Methods')
                  .textLg()
                  .textWhite()
                  .textCenter()
                  .pt1(),
              const Text('Tap any category to see examples')
                  .textSm()
                  .textWhite()
                  .textCenter()
                  .pt1(),
            ],
          ).p6().bgBlue600().roundedXl().m4(),

          // v1.0 Basic
          _sectionHeader('v1.0 — Basic Utilities'),
          _exampleTile(context, Icons.space_bar, 'Spacing',
              'Padding & Margin (p4, mx4, etc.)', const SpacingExample()),
          _exampleTile(context, Icons.palette, 'Colors',
              'Background & Text colors', const ColorExample()),
          _exampleTile(context, Icons.text_fields, 'Typography',
              'Font sizes, weights, alignment', const TypographyExample()),
          _exampleTile(context, Icons.photo_size_select_large, 'Sizing',
              'Width, height, constraints', const SizingExample()),
          _exampleTile(context, Icons.rounded_corner, 'Decoration',
              'Borders, shadows, radius, opacity', const DecorationExample()),
          _exampleTile(context, Icons.view_quilt, 'Layout & Flex',
              'Row, Column, Stack, Wrap, alignment', const LayoutFlexExample()),
          _exampleTile(context, Icons.transform, 'Transform',
              'Rotate, scale, translate, flip', const TransformExample()),
          _exampleTile(
              context,
              Icons.visibility,
              'Visibility & Gestures',
              'Show/hide, tap, hover, cursor',
              const VisibilityGestureExample()),

          // v2.0 Advanced
          _sectionHeader('v2.0 — Advanced Features'),
          _exampleTile(context, Icons.devices, 'Responsive & Grid',
              'Breakpoints, responsive grid', const ResponsiveGridExample()),
          _exampleTile(context, Icons.gradient, 'Gradients',
              'Linear, radial, preset gradients', const GradientExample()),
          _exampleTile(context, Icons.animation, 'Animations',
              'Fade, slide, scale, spin, bounce', const AnimationExample()),
          _exampleTile(context, Icons.dark_mode, 'Dark Mode',
              'Theme-aware styling', const DarkModeExample()),
          _exampleTile(
              context,
              Icons.smart_button,
              'Button & Card Presets',
              'Pre-styled buttons and cards',
              const ButtonCardPresetExample()),
          _exampleTile(context, Icons.tune, 'Custom Values',
              'Hex colors, custom spacing/sizing', const CustomValuesExample()),

          // v3.0 Components
          _sectionHeader('v3.0 — UI Components'),
          _exampleTile(context, Icons.input, 'Form Inputs',
              'Text fields, validation, AwInput', const FormInputExample()),
          _exampleTile(context, Icons.image, 'Images',
              'Circle, rounded, effects, AwImage', const ImageExample()),
          _exampleTile(
              context,
              Icons.hourglass_empty,
              'Shimmer & Skeleton',
              'Loading placeholders',
              const ShimmerSkeletonExample()),
          _exampleTile(context, Icons.new_releases, 'Badges & Chips',
              'Badges, dot badges, chips', const BadgeChipExample()),
          _exampleTile(context, Icons.account_circle, 'Avatars',
              'Initials, status, groups', const AvatarExample()),
          _exampleTile(context, Icons.message, 'Dialogs',
              'Alert, confirm, snackbar', const DialogExample()),
          _exampleTile(context, Icons.list, 'List Tiles',
              'Settings, contact, notification', const ListTileExample()),
          _exampleTile(context, Icons.horizontal_rule, 'Dividers',
              'Thin, dashed, dotted, with text', const DividerExample()),
          _exampleTile(context, Icons.hexagon, 'Clip Shapes',
              'Triangle, diamond, hexagon, star', const ClipShapeExample()),
          _exampleTile(context, Icons.swipe, 'Scroll Effects',
              'Fade, bounce, snap, page view', const ScrollExample()),
          _exampleTile(
              context,
              Icons.info_outline,
              'Tooltips & Popups',
              'Tooltip, popup menu, popover',
              const TooltipPopupExample()),
          _exampleTile(context, Icons.accessibility, 'Accessibility',
              'Semantics, focus, AwA11y', const AccessibilityExample()),

          // v4.0 Navigation & Advanced
          _sectionHeader('v4.0 — Navigation & Advanced'),
          _exampleTile(context, Icons.menu, 'Navigation',
              'AppBar, drawer, bottom nav', const NavigationExample()),
          _exampleTile(context, Icons.view_day, 'Slivers',
              'Sliver list, grid, app bar', const SliverExample()),
          _exampleTile(context, Icons.table_chart, 'Tables',
              'Simple, striped, bordered, compact', const TableExample()),
          _exampleTile(
              context,
              Icons.timeline,
              'Stepper & Timeline',
              'Progress, vertical, numbered',
              const StepperTimelineExample()),
          _exampleTile(context, Icons.drag_indicator, 'Drag & Drop',
              'Draggable, drop target, reorder', const DragDropExample()),
          _exampleTile(context, Icons.language, 'i18n & RTL',
              'RTL support, directional spacing', const I18nExample()),
          _exampleTile(
              context,
              Icons.phone_iphone,
              'Platform Adaptive',
              'Material/Cupertino adaptive',
              const PlatformAdaptiveExample()),

          // Extras
          _sectionHeader('Extras'),
          _exampleTile(context, Icons.build, 'aw Helper Class',
              'Widget creators, layout builders', const AwHelperExample()),
          _exampleTile(context, Icons.rocket_launch, 'Real World Examples',
              'Product card, chat, dashboard', const RealWorldExample()),

          const SizedBox(height: 24),
        ],
      ).p4(),
    );
  }

  Widget _sectionHeader(String title) {
    return Text(title)
        .textLg()
        .fontBold()
        .textGray700()
        .pt4()
        .pb2()
        .px2();
  }

  Widget _exampleTile(BuildContext context, IconData icon, String title,
      String subtitle, Widget page) {
    return ListTile(
      leading: Icon(icon, color: Colors.blue.shade600),
      title: Text(title),
      subtitle: Text(subtitle),
      trailing: const Icon(Icons.chevron_right),
      onTap: () => Navigator.push(
        context,
        MaterialPageRoute(builder: (_) => page),
      ),
    );
  }
}