adaptive_ui_intent 0.0.1 copy "adaptive_ui_intent: ^0.0.1" to clipboard
adaptive_ui_intent: ^0.0.1 copied to clipboard

Intent-based adaptive UI for Flutter that helps developers build responsive layouts based on user intent such as reading, input, monitoring, navigation, and media consumption instead of device-specific checks.

๐Ÿ“ฆ adaptive_ui_intent #

Intent-based adaptive UI for Flutter Design layouts based on what the user is doing, not what device they are on.


โœจ Why adaptive_ui_intent? #

Most Flutter apps adapt UI like this:

if (width > 600) ...
if (Platform.isIOS) ...
if (isTablet) ...

This package introduces a new way of thinking:

๐Ÿ‘‰ Adapt UI based on intent (reading, input, monitoring, media, navigation)


๐Ÿง  Core Concept: UI Intent #

Instead of device checks, you declare intent:

AdaptiveIntent(
  intent: UIIntent.monitoring,
  builder: (context, config) {
    return GridView(
      crossAxisCount: config.columns,
    );
  },
);

The package automatically decides:

  • Columns
  • Spacing
  • Max width
  • Aspect ratio based on screen size + platform + intent

๐ŸŽฏ Supported UI Intents #

enum UIIntent {
  reading,
  navigation,
  input,
  monitoring,
  media,
}
Intent Best for
reading Articles, blogs, text-heavy screens
navigation Menus, dashboards, app navigation
input Forms, login, data entry
monitoring Charts, analytics, stats
media Video, images, galleries

๐Ÿš€ Installation #

Add to your pubspec.yaml:

dependencies:
  adaptive_ui_intent: ^0.1.0

Then run:

flutter pub get

๐Ÿงฉ Basic Usage #

AdaptiveIntent(
  intent: UIIntent.reading,
  builder: (context, config) {
    return Padding(
      padding: EdgeInsets.all(config.spacing),
      child: ConstrainedBox(
        constraints: BoxConstraints(maxWidth: config.maxWidth),
        child: Text(
          longArticleText,
          style: Theme.of(context).textTheme.bodyLarge,
        ),
      ),
    );
  },
);

โš™๏ธ IntentConfig Explained #

The builder provides an IntentConfig:

class IntentConfig {
  final int columns;
  final double maxWidth;
  final double spacing;
  final double aspectRatio;
}

Use it to drive layout decisions, not widget logic.


๐Ÿ“Š Example: Monitoring Dashboard #

AdaptiveIntent(
  intent: UIIntent.monitoring,
  builder: (context, config) {
    return GridView.count(
      crossAxisCount: config.columns,
      childAspectRatio: config.aspectRatio,
      children: List.generate(
        6,
        (i) => Card(child: Center(child: Text('Chart $i'))),
      ),
    );
  },
);

โœ” Phone โ†’ single column โœ” Tablet โ†’ grid layout โœ” Web โ†’ wide dashboard


๐ŸŽจ Platform Awareness (Built-in) #

The package automatically adapts for:

  • ๐Ÿ“ฑ Phone vs Tablet
  • ๐Ÿ–ฅ๏ธ Web
  • ๐ŸŽ iOS spacing
  • ๐Ÿค– Android spacing

No platform checks needed.


๐Ÿงช Example App #

cd example
flutter run

Resize the window or switch devices to see intent-based adaptation.


๐Ÿ›ฃ๏ธ Roadmap #

Planned features:

  • ๐Ÿ”„ Custom intent overrides
  • โ™ฟ Accessibility-aware intents
  • โŒš WearOS / small-screen presets
  • ๐Ÿ“ Foldable device support

๐Ÿค Contributing #

  1. Fork the repository
  2. Create a feature branch
  3. Add tests if possible
  4. Submit a pull request

Small improvements are welcome ๐Ÿ™Œ


๐Ÿ“„ License #

MIT License Free for personal and commercial use.


0
likes
140
points
61
downloads

Documentation

API reference

Publisher

unverified uploader

Weekly Downloads

Intent-based adaptive UI for Flutter that helps developers build responsive layouts based on user intent such as reading, input, monitoring, navigation, and media consumption instead of device-specific checks.

Repository (GitHub)
View/report issues

Topics

#flutter #responsive-ui #adaptive-ui #ui-architecture #widget

License

MIT (license)

Dependencies

flutter

More

Packages that depend on adaptive_ui_intent