adaptive_ui_intent 0.0.1
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 #
- Fork the repository
- Create a feature branch
- Add tests if possible
- Submit a pull request
Small improvements are welcome ๐
๐ License #
MIT License Free for personal and commercial use.