Responsive UI or flutter_ScreenUtil In Flutter :
dependencies:
flutter_screenutil:
This plugin for adapting screen and font size. Let your UI reasonable design on different screen sizes.
Properties:
1) width int 1080px The width of the device in the design draft, in px
2) height int 1920px The height of the device in the design draft, in px
3) allowFontScaling bool false Sets whether the font size is scaled according to the "Font Size" auxiliary option of the system
width : 1080px , height:1920px , allowFontScaling:false
ScreenUtil.instance = ScreenUtil.getInstance()..init(context);
If the design draft is designed according to the size of iPhone6 (iPhone6 750 * 1334)
ScreenUtil.instance = ScreenUtil(width: 750, height: 1334)..init(context);
Set the font size to scale according to the "font size" auxiliary option of the system. The default is false: the font is scaled according to the "font size" auxiliary option of the system.
ScreenUtil.instance = ScreenUtil(width: 750, height: 1334, allowFontScaling: true)..init(context);
For example:
-------------
Container(width: ScreenUtil.getInstance().setWidth(375), height: ScreenUtil.getInstance().setHeight(200)),
Px size of the incoming design draft
-------------------------------------
ScreenUtil.getInstance().setSp(28)
ScreenUtil(allowFontScaling: true).setSp(28)
for example:
Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
Text('Title',
style: TextStyle(
color: Colors.black, fontSize: ScreenUtil.getInstance().setSp(24))),
Text('Description',
style: TextStyle(
color: Colors.black, fontSize: ScreenUtil(allowFontScaling: true).setSp(24))),
],
)
The flutter tutorial is a website that bring you the latest and amazing resources of code. All the languages codes are included in this website. The languages like flutter, android, java,kotlin etc.with the help of this languages any user can develop the beautiful application
For more information about Flutter. visit www.fluttertutorial.in
