Screens come in different sizes, but how do you make your Flutter app respond to these sizes?
One of the main goals of Flutter is to create a framework that allows you to develop applications that look and feel great on any platform from a single code base.
But how can this be achieved? Your app may appear on multiple screen sizes from mobile to desktop.
When it comes to layout in Flutter, designs can be divided into two categories:
Responsive: This is an app that adjusts its layout according to the available screen size.
Adaptive: Run the application on different device types.
We can use some useful widgets and classes of Flutter to build responsive UI, but that is not the topic of this article. We will use the Flutter package to make our UI responsive to multiple screens.
Package name: flutter_screenutli
flutter_screenutli is a flutter package for adapting to screen and font sizes. It allows your UI to display a reasonable layout on different screen sizes. The package currently has over 3.5k starts on pub.dev, which shows how popular and useful the package is in the flutter community. In this article, we will demonstrate how to make this package in your flutter application.
Installation package
Installing this package is very simple. You can access the package in pub.dev to get the latest version and add it to pubspec.yaml and run flutter pub get.
dependencies:
flutter:
sdk: flutter
# add flutter_screenutil
flutter_screenutil: