Flutter屏幕适配方案,使页面设计在不同尺寸的屏幕上都能显示一致
可以使用插件:flutter_ScreenUtil
https://pub.flutter-io.cn/packages/flutter_screenutil
安装:
dependencies:
flutter:
sdk: flutter
# 添加依赖
flutter_screenutil: ^0.6.0
在使用的地方导入:
import 'package:flutter_screenutil/flutter_screenutil.dart';
首先设置屏幕设计稿的宽高:
ScreenUtil.instance = ScreenUtil(width: 1080, height: 1980)..init(context);
根据屏幕宽度适配width: ScreenUtil.getInstance().setWidth(540.0),
根据屏幕高度适配height: ScreenUtil.getInstance().setHeight(200.0),
参考官方提供的案例:
//导入
import 'package:flutter_screenutil/flutter_screenutil.dart';
...
@override
Widget build(BuildContext context) {
//设置适配尺寸 (填入设计稿中设备的