报错如下
起因
咱们在布局中应用 ScreenUtil().screenWidth 获取屏幕宽度是,在初始化未装载视图时,第一次获取时拿不到,会呈现如上的解体。
解决方案
import 'package:flutter_screenutil/screenutil_init.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
@override
Widget build(BuildContext context) {
// 应用屏幕初始化包裹整个 body 布局
return ScreenUtilInit(
// 设置初始化屏幕大小
designSize: Size(375, 812),
builder: () => Scaffold(
backgroundColor: WBColors.color_f4f5f7,
body: Container(
height: 263.5,
width: ScreenUtil().screenWidth,))
);
}
- 应用 ScreenUtilInit 屏幕初始化组件包裹整个页面布局最外层
- 设置屏幕初始大小
- body 外面可任意应用获取屏幕宽高的 API 了