android暴力屏幕适配,Flutter屏幕适配,简单粗暴的全局适配方式

screen_ratio_adapter😘😘

一个Flutter package ,屏幕适配器，入侵成本极低。基于宽度方向适应，高度滚动或留空。并不是一个screen_util。再也不为适配屏幕重复搬砖。

设计稿如同模特上挂着的衣服，但是强行穿在不同设备上，就成了买家秀，要么左右不对称，甚至撑破。

基于一种理念

一套多售，这是批量订制而不是私人定制。

服装设计稿——>加工厂批量生产不同尺码——>顾客选购——>着身；

中间环节由本插件代码处理

原理

还记得Android原生上今日头条适配方案吗？就是修改运行时获取的设备屏幕密度比率常数。这个方案很早之前就有人提出过只是人微言轻传播的不好。

对于用户来说屏幕就是一个矩形(至少目前的主流设备)；而主流移动设备已经培养多年用户上下滑动屏幕的习惯；

主流设备变得更“窄”；

基于以上三点，以屏幕宽度适配通用性高，实现效果好。至于实际设备高/宽与设计比例的差异处理，自行留白或纵向改为scrollWidget

实践报告

\设备

android

Android

iOS

设备分辨率

1080x1794

720x2160

1242x2688

h/w

1.666

3.0

2.164

屏幕密度比率ρ

2.625

1.2

3.0

UI稿1(300x510) h/w =1.7

过长

过短

过短

适配比率ρ(300x510)

3.60

2.40

4.14

UI稿1(414x896) h/w =2.16

过长

过短

不变

适配比率ρ(414x896)

2.608

1.739

3.0

使用方式

点赞加星小礼物

复制粘贴人人爱

如有BUG记小本

携尔长刀来相砍

复制代码

已上传pub.dev ️❤️❤️点赞😘😘

已上传 github ️❤️❤️加星😘😘)

##复制粘贴

dependencies:

screen_ratio_adapter: ^0.0.2

复制代码import 'package:screen_ratio_adapter/screen_ratio_adapter.dart';

///设计稿尺寸，单位应是pt或dp

Size uiSize = Size(414, 896);

//void main() => runApp(MyApp());

void main() => runFxApp(MyApp(), uiSize: uiSize);

复制代码

参考及鸣谢

一种粗暴快速的Android全屏幕适配方案

flutter 屏幕适配

flutter屏幕适配 ，一种一劳永逸的全局适配方式

关于找一找教程网

本站文章仅代表作者观点，不代表本站立场，所有文章非营利性免费分享。

本站提供了软件编程、网站开发技术、服务器运维、人工智能等等IT技术文章，希望广大程序员努力学习，让我们用科技改变世界。

[Flutter屏幕适配,简单粗暴的全局适配方式]http://www.zyiz.net/tech/detail-129181.html