awaitware_ui_utilities library
Awaitware UI Utilities - Powerful Flutter UI Toolkit
A comprehensive collection of 800+ extension methods for building beautiful, responsive Flutter UIs. Write cleaner, more maintainable UI code with chainable extension methods.
Features
Basic Utilities
- Spacing: Padding and margin utilities (p4, px2, m4, etc.)
- Colors: Background and text colors with Material shades
- Typography: Font sizes, weights, alignment, and decorations
- Sizing: Width, height, and size constraints
- Decoration: Border radius, borders, shadows, and opacity
- Layout: Alignment, expansion, aspect ratios, and scrolling
- Flex: Row, Column, Stack, Wrap with convenient builders
- Transform: Rotation, scaling, translation, and flipping
- Positioning: Absolute and relative positioning
- Visibility: Show/hide and pointer event control
Advanced Features (v2.0)
- Responsive: Breakpoint-based responsive design (sm, md, lg, xl)
- Grid System: CSS Grid-like layout with responsive columns
- Gradients: Linear, radial, and preset gradients
- Animations: Fade, slide, scale, spin, bounce, pulse, shake
- Dark Mode: Theme-aware styling with dark mode support
- Gestures: Tap, drag, hover, and interaction handlers
- Typography Presets: h1-h6, body, caption, label presets
- Button Presets: Primary, secondary, outline, danger, success
- Card Presets: Elevated, bordered, hoverable, gradient cards
- Custom Values: Hex colors, custom spacing, sizing, and more
Quick Start
import 'package:awaitware_ui_utilities/awaitware_ui_utilities.dart';
// Create a beautiful card with just a few extensions
Container()
.p6() // Padding: 24px
.bgWhite() // Background: white
.roundedXl() // Border radius: 12px
.shadowLg() // Large shadow
.m4(); // Margin: 16px
// Style text easily
Text('Hello World')
.text2Xl() // Font size: 24px
.fontBold() // Font weight: 700
.textBlue600() // Color: blue.shade600
.textCenter(); // Align: center
// Build layouts quickly
[
Text('Item 1'),
Text('Item 2'),
Text('Item 3'),
].gap(8).row(); // Row with 8px gaps
// Advanced: Responsive grid with animations
[card1, card2, card3, card4]
.gridResponsive(xsCols: 1, smCols: 2, lgCols: 4, gap: 16)
.fadeIn();
// Advanced: Gradient button with hover effect
Text('Get Started')
.textLg().fontSemibold().textWhite()
.px8().py4()
.gradientToR(colors: [Colors.blue, Colors.purple])
.roundedXl()
.hover(scale: 1.05)
.onTap(() => handleClick());
// Advanced: Using the aw helper class
aw.column([
aw.text('Hello').h1(),
aw.row([aw.text('Item 1'), aw.text('Item 2')]),
aw.card(child: Text('Card content')),
]);
// Custom values: Use any hex color, spacing, or size
Container()
.bgHex('#0f172a') // Custom hex color
.pCustom(20) // Custom 20px padding
.roundedCustom(16) // Custom 16px border radius
.wCustom(300); // Custom 300px width
Text('Hello')
.textHex('#3b82f6') // Custom hex text color
.fontSize(24); // Custom 24px font size
Extension Categories
All extensions are automatically available when you import this library. Chain them together for powerful, readable UI code!
Classes
- aw
- Awaitware UI Utilities - Short prefix class for easier access
- AwA11y
- Accessibility utility class
- AwAdaptive
- Helper class providing static factory methods for platform-adaptive widgets.
- AwAvatar
- Pre-built avatar widgets
- AwBadge
- Pre-built badge/chip helpers
- AwBreakpoints
- Tailwind CSS-inspired responsive utilities for Flutter Provides breakpoint-based responsive design Breakpoint values (matching Tailwind CSS)
- AwButton
- Pre-built button widgets
- AwCard
- Pre-built card widget
- AwCustom
- Utility class for creating widgets with custom values Provides a static API for common custom operations
- AwDialog
- Pre-built dialog and modal helpers
- AwDivider
- Pre-built divider widgets
- AwDragDrop
- Pre-built drag and drop components.
- AwFlex
- Flex container widget with full control
- AwGrid
- Advanced grid with span support
- AwI18n
- Utility helpers for querying and responding to the current text direction.
- AwImage
- Pre-built image widget helpers
- AwInput
- Pre-built input decoration presets
- AwListTile
- Pre-built list item widgets
- AwPopupItem
- Helper class for creating popup menu items
- AwResponsiveGrid
- Responsive grid widget
- AwSkeleton
- Static skeleton builders
- AwSliver
- Static helper methods for common sliver patterns
- AwTable
- Pre-built table factory methods for common table patterns
- AwTimeline
- Pre-built stepper and timeline widgets.
- AwTypography
- Typography presets as widgets
- ResponsiveBuilder
- Responsive widget builder that applies different widgets based on screen size
-
ResponsiveValue<
T> - Responsive value helper
- ThemeAware
- Theme-aware widget builder
- ThemeContainer
- Theme-aware container with preset dark mode styles
- ThemeIcon
- Theme-aware icon widget
- ThemeText
- Theme-aware text widget
Extensions
- AccessibilityExtensions on Widget
- Accessibility extensions for Flutter Provides semantic and accessibility utility methods
-
AdvancedFlexListExtensions
on List<
Widget> - Tailwind CSS-inspired advanced flexbox utilities for Flutter Provides comprehensive flex layout controls Advanced flex extensions for List of Widgets
- AdvancedFlexWidgetExtensions on Widget
- Advanced flex extensions for single Widget
- AnimationExtensions on Widget
- Tailwind CSS-inspired animation utilities for Flutter Provides transitions, hover effects, and pre-built animations
- AvatarExtensions on Widget
- Tailwind CSS-inspired avatar extensions for Flutter Provides pre-styled avatar variants and group layouts
- BadgeExtensions on Widget
- Tailwind CSS-inspired badge and chip extensions for Flutter Provides pre-styled badge and chip variants
- BadgeTextExtensions on Text
- Badge and chip extensions on Text widget
- ButtonPresetExtensions on Widget
- Tailwind CSS-inspired button presets for Flutter Provides pre-styled button variants
- CardPresetExtensions on Widget
- Tailwind CSS-inspired card presets for Flutter Provides pre-styled card variants
- ClipExtensions on Widget
- Clip and shape extensions for Flutter Provides various clipping shapes and custom clip paths
- ColorExtensions on Widget
- Tailwind CSS-inspired background color utilities for Flutter.
- CustomColorExtensions on Widget
- Custom color extensions for Widget
- CustomDecorationExtensions on Widget
- Custom decoration extensions for Widget
- CustomSizingExtensions on Widget
- Custom sizing extensions for Widget
- CustomSpacingExtensions on Widget
- Custom spacing extensions for Widget
- CustomTextColorExtensions on Text
- Custom text color extensions for Text widget
- CustomTransformExtensions on Widget
- Custom transform extensions for Widget
- CustomTypographyExtensions on Text
- Custom typography extensions for Text widget
- DarkModeExtensions on Widget
- Tailwind CSS-inspired dark mode utilities for Flutter Provides automatic theme-aware styling Dark mode color extensions for Widget
- DarkModeTextExtensions on Text
- Dark mode text color extensions for Text widget
- DecorationExtensions on Widget
- Tailwind CSS-inspired decoration utilities for Flutter Provides border radius, borders, shadows, and opacity
- DialogExtensions on Widget
- Dialog, modal, and snackbar extensions for Flutter Provides convenient methods to show dialogs and bottom sheets
- DividerExtensions on Widget
- Divider and separator extensions for Flutter Provides pre-styled divider variants
- DragDropExtensions on Widget
- Drag and drop utilities for Flutter Provides draggable wrappers, drop targets, reorderable lists, and pre-built drag/drop components
-
DragDropListExtensions
on List<
Widget> -
FlexExtensions
on List<
Widget> - Tailwind CSS-inspired flex utilities for Flutter Provides Row, Column, Stack, Wrap, and gap utilities
-
FormGroupExtensions
on List<
Widget> -
Extension on
List<Widget>for form groups - FormInputExtensions on Widget
- Tailwind CSS-inspired form & input styling extensions for Flutter Provides pre-styled input field variants and form utilities
- GestureExtensions on Widget
- Gesture and interaction utilities for Flutter Provides tap handlers, gestures, and interactive behaviors
- GradientExtensions on Widget
- Tailwind CSS-inspired gradient utilities for Flutter Provides linear, radial, and preset gradients
- GradientTextExtensions on Text
- Gradient text extension
-
GridExtensions
on List<
Widget> - Tailwind CSS-inspired grid utilities for Flutter Provides CSS Grid-like layout system Grid extensions for List of Widgets
- GridItemExtensions on Widget
- Grid item extensions for single widgets
- I18nExtensions on Widget
- Directional layout, padding, margin, and alignment extensions on Widget.
- I18nTextExtensions on Text
- Directional text alignment extensions on Text.
- IconColorExtensions on Icon
- Tailwind CSS-inspired icon color utilities for Flutter.
- ImageExtensions on Widget
- Tailwind CSS-inspired image styling extensions for Flutter Provides pre-styled image variants and utilities
- LayoutExtensions on Widget
- Tailwind CSS-inspired layout utilities for Flutter Provides alignment, expansion, aspect ratio, and scrolling
- ListTilePresetExtensions on Widget
- Tailwind CSS-inspired list tile/item presets for Flutter Provides pre-styled list item variants
- Navigation extensions for Flutter Provides convenient methods for drawers, bottom navigation, app bars, sidebars, and breadcrumbs
- PlatformAdaptiveExtensions on Widget
- Platform adaptive extensions for Flutter Provides utilities to render platform-appropriate widgets on iOS/macOS vs Android/Windows/Linux
- PositioningExtensions on Widget
- Tailwind CSS-inspired positioning utilities for Flutter Provides absolute and relative positioning for Stack children
- ResponsiveExtensions on Widget
- Responsive extensions for Widget
-
ResponsiveListExtensions
on List<
Widget> -
Extension for responsive column counts on
List<Widget> - RowColumnExtensions on Widget
- ScrollEffectExtensions on Widget
- Scroll effect extensions for Flutter Provides scroll-based animations and behaviors
-
ScrollListExtensions
on List<
Widget> -
Extension on
List<Widget>for scroll layouts - ShimmerExtensions on Widget
- Shimmer and skeleton loading extensions for Flutter Provides pre-styled loading placeholder variants
- SizingExtensions on Widget
- Tailwind CSS-inspired sizing utilities for Flutter Provides width, height, and size constraints
- SliverExtensions on Widget
- Sliver extensions for Flutter Provides convenient sliver wrappers and helpers for CustomScrollView usage
-
SliverListExtensions
on List<
Widget> - SpacingExtensions on Widget
- Tailwind CSS-inspired spacing utilities for Flutter.
- StepperExtensions on Widget
- Stepper, timeline, and step-progress extensions for Flutter widgets Provides step indicators, vertical/horizontal timelines, and Material Stepper wrappers
-
StepperListExtensions
on List<
Widget> - TableExtensions on Widget
- Table utilities and extensions for Flutter Provides helpers for building and styling DataTable and Table widgets Table styling extensions on Widget
-
TableRowListExtensions
on List<
TableRow> -
Extensions on
List<TableRow>for quick Table creation - TappableExtensions on Widget
- Extension for making a widget tappable with visual feedback
- TextColorExtensions on Text
- Tailwind CSS-inspired text color utilities for Flutter.
- TextExtensions on Text
- Tailwind CSS-inspired typography utilities for Flutter Provides font size, weight, alignment, and decoration extensions
- TooltipExtensions on Widget
- Tooltip and popover extensions for Flutter Provides convenient tooltip and popup variants
- TransformExtensions on Widget
- Tailwind CSS-inspired transform utilities for Flutter Provides rotation, scaling, translation, and flip utilities
- TypographyPresetExtensions on Text
- Tailwind CSS-inspired typography presets for Flutter Provides heading, body, and label text presets
- VisibilityExtensions on Widget
- Tailwind CSS-inspired visibility utilities for Flutter Provides show/hide and interaction control utilities