flutter插件 - flutter_screenutil（屏幕适配）

简介

官方文档

一种屏幕适配方案，具体用法参考中文文档

使用

• 修改pubspec.yaml文件，添加依赖flutter_screenutil

# ...
dev_dependencies:
  # ...
  flutter_screenutil: ^3.1.0
# ...

• 设置好适配尺寸（效果图尺寸）

// 填入设计稿中设备的屏幕尺寸
void main() {
  WidgetsFlutterBinding.ensureInitialized();
  // 设置适配尺寸 (填入设计稿中设备的屏幕尺寸) 假如设计稿是按 iPhone6 的尺寸设计的(iPhone6 750 * 1334)
  // allowFontScaling：设置字体大小是否根据系统的“字体大小”辅助选项来进行缩放
  ScreenUtil.init(context, designSize: Size(750, 1334), allowFontScaling: false);
  runApp(MyApp());
}

• 使用

// 传入设计稿的px尺寸 px px px !
ScreenUtil().setWidth(540)  (sdk>=2.6 : 540.w) //根据屏幕宽度适配尺寸
ScreenUtil().setHeight(200) (sdk>=2.6 : 200.h) //根据屏幕高度适配尺寸
ScreenUtil().setSp(24)      (sdk>=2.6 : 24.sp)  //适配字体
ScreenUtil().setSp(24, allowFontScalingSelf: true)   (sdk>=2.6 : 24.ssp) //适配字体(根据系统的“字体大小”辅助选项来进行缩放)
ScreenUtil().setSp(24, allowFontScalingSelf: false)  (sdk>=2.6 : 24.nsp) //适配字体(不会根据系统的“字体大小”辅助选项来进行缩放)

ScreenUtil.pixelRatio       //设备的像素密度
ScreenUtil.screenWidth   (sdk>=2.6 : 1.wp)   //设备宽度
ScreenUtil.screenHeight  (sdk>=2.6 : 1.hp)   //设备高度
ScreenUtil.bottomBarHeight  //底部安全区距离，适用于全面屏下面有按键的
ScreenUtil.statusBarHeight  //状态栏高度 刘海屏会更高  单位px
ScreenUtil.textScaleFactor //系统字体缩放比例

ScreenUtil().scaleWidth  // 实际宽度的dp与设计稿px的比例
ScreenUtil().scaleHeight // 实际高度的dp与设计稿px的比例

0.2.wp  //屏幕宽度的0.2倍
0.5.hp  //屏幕高度的50%