This package provides breakpoints to help achieve responsive designs.
Run the following command:
$ flutter pub add flutter_responsive_breakpoints
How to use it
Import the package
Wrap MaterialApp with Responsive widget
Responsive(builder: (context) => MaterialApp())
Use it anywhere (after importing the package)
responsive<Color>(def: Colors.red, sm: Colors.blue, xl: Colors.green)
- all breakpoints are optional
It can be any type:
If you're using the function a lot, you can use
r<T>() instead like so:
r<Color>(def: Colors.red, sm: Colors.blue, xl: Colors.green)
Width and height extensions
Like CSS, you can use
X.vw to get a width percentage (example: 20.vw) and
X.vh to get a height percentage (example: 20.vh).
Issue and feedback
If you have any suggestion for including a feature or if something doesn't work, feel free to open a Github issue for us to have a discussion on it.