Description:
adaptive screen utils
adaptive_screen_utils #
A Flutter package to provide Adaptive Screen Utils for creating responsive UI for different screen sizes. Make your UI look great on any device. Easy to manage different screen sizes.
This package is created for educational purposes in Flutter Jaipur Meetup: Make your own package publish on pub.dev.
You can use it in production as well. It is a simple package that provides a few methods to check the screen size and create a responsive UI based on the screen width, height, and orientation.
Flutter Jaipur Social Handles #
Usage #
To use this package, add adaptive_screen_utils as a dependency in your pubspec.yaml file.
dependencies:
adaptive_screen_utils: ^2.2.0
copied to clipboard
Example #
Import the file to your project
import 'package:adaptive_screen_utils/adaptive_screen_utils.dart';
copied to clipboard
class MyWidget extends StatelessWidget {
@override
Widget build(BuildContext context) {
final desktop = expanded(context);
final tablet = medium(context);
return Scaffold(
appBar: AppBar(
title: Text('Adaptive Screen Utils'),
),
body: Builder(
builder: (context) {
if (desktop) {
return Center(
child: Text(
'Desktop',
style: Theme.of(context).textTheme.headline4,
),
);
} else if (tablet) {
return Center(
child: Text(
'Tablet',
style: Theme.of(context).textTheme.headline4,
),
);
}
return Center(
child: Text(
'Mobile',
style: Theme.of(context).textTheme.headline4,
),
);
},
),
);
}
}
copied to clipboard
Methods #
Method
Orientation
Height
Width
DeviceType
Result
wearable
Portrait
450.0
450.0
Watch
true
wearable
Landscape
450.0
450.0
Watch
true
compact
Portrait
480.0
600.0
Mobile
true
compact
Landscape
600.0
480.0
Mobile
true
medium
Portrait
900.0
840.0
Tablet
true
medium
Landscape
840.0
900.0
Tablet
true
expanded
Portrait
960.0
840.0
Desktop
true
expanded
Landscape
840.0
960.0
Desktop
true
Type
-----------
------
-----
----------
DeviceType
Disclaimer #
The current approach to determining device types (wearable, compact, medium, and expanded) based on width, height, and orientation is a simple approach. It may not be accurate for all devices.
https://developer.android.com/develop/ui/views/layout/window-size-classes is a good reference for understanding the concept of screen size classes. this package is inspired by the above link & check wearables, compact, medium, and expanded based on width, height, and orientation.
Issues & Feedback #
If you wish to contribute to this repo, welcome to Pull Requests.
Star ⭐ the repo if you find it useful 🤩🤩. we are open to enhancements, bug-fixes & suggestions. feel free to open an issue.
License #
MIT License
copied to clipboard
Maintainers & Collaborators #
Ravi Kovind #
Flutter Jaipur #
License
For personal and professional use. You cannot resell or redistribute these repositories in their original state.
Files:
Customer Reviews
There are no reviews.
