首页 > 其他 > 详细

14-3 全屏幕适配指南

时间:2020-02-16 01:39:42      阅读:80      评论:0      收藏:0      [点我收藏+]


技术分享图片

技术分享图片

技术分享图片

技术分享图片
以ios为,顶部有刘海
技术分享图片
底部有操作的虚拟键
技术分享图片
技术分享图片

技术分享图片

技术分享图片


技术分享图片

技术分享图片

这是原来的main.dart
技术分享图片 
为了让文字一个在顶部,一个在底部,所以设置Y轴上为SpaceBetween
技术分享图片
运行效果。这是没有加任何适配的情况。
技术分享图片

直接外层套SafeArea

技术分享图片

技术分享图片

MediaQuery的方式

先获取到padding
技术分享图片
技术分享图片
设置顶部的padding和底部的
技术分享图片
技术分享图片
技术分享图片

技术分享图片
MyApp不能和main直接接触了。
技术分享图片

MediaQuery不能直接放在runApp里面。
技术分享图片

单独创建一个home的组件
技术分享图片

在上面使用HomePage
技术分享图片

技术分享图片
使用padding的方式更加的灵活。

安卓的全面屏适配

技术分享图片

技术分享图片


技术分享图片
设置为2.3
技术分享图片

技术分享图片

技术分享图片


 

结束

 

14-3 全屏幕适配指南

原文:https://www.cnblogs.com/wangjunwei/p/12315177.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!