通常在将375*765设计稿转成html代码的时候,我们会借助一些插件(比如:postCssPxToRem)来帮我们实现 设计稿对于各个手机的适配。
按照这个思路,在写flutter的时候我们同样也需要这样一个转换,以达到一套设计稿可以适配不同尺寸屏幕的问题。
这里分析两种思路:
1、自己写一个方法转换
-
思路大致是获取当前设备的的宽高 (mediaQuery.size.width) -
设置一个设计稿的宽,获得一个比率,之后页面写宽度的时候通过提供出去的px方法转换比例
2、flutter_screenutil
pub地址:pub.flutter-io.cn/packages/fl…
提供了比较齐全的使用方法,截图来自pub,这里比较全面甚至包括了据顶部和底部的安全距离