【Tips】神奇的Guideline完美解决各种适配和各种布局嵌套

ConstraintLayout约束布局出来有一段时间了,新的项目中布局也在用,对各种控件的约束确定实用,但是感觉平平.最戳中我的G点的还是当中的Guideline

传统方式

布局适配最开始的时候是各种weight,比重是实现了但导致LinearLayout各种嵌套层级越来越深,不易维护又影响性能。
后来还有有过百分比布局和HongYang的AutoLayout,但是相比而言Guiline高效又实用,堪称神器。


【Tips】神奇的Guideline完美解决各种适配和各种布局嵌套_第1张图片

有这样的效果图,传统情况下一个大布局套左右两个小布局,两个小布局又有放置相应的控件可能还会发生嵌套,而且UI妹子要个小布局都把图切出来。

Guideline方式
  • UI妹子把整体的布局直接切给你,不用再每个小布局都切出来
  • 根据内容拉出几根横竖的Guideline,
【Tips】神奇的Guideline完美解决各种适配和各种布局嵌套_第2张图片
Paste_Image.png

注意一定要是半分比形式的,默认是距离左边和上边的固定形式。点击线的头
部,点击一次变成距离右边或下边的形式,再点击一次就会变成百分比的形式

【Tips】神奇的Guideline完美解决各种适配和各种布局嵌套_第3张图片
  • 拖了数个横竖的Guideline后,界面的整体框架就会出来了,再根据需要把相应的控件约束到对应Guideline上。


    【Tips】神奇的Guideline完美解决各种适配和各种布局嵌套_第4张图片
  • 由于Guideline是根据百分比平分界面的,控件又约束于这些Guideline。也就完成了适配。
    几种分辨率的效果
【Tips】神奇的Guideline完美解决各种适配和各种布局嵌套_第5张图片
【Tips】神奇的Guideline完美解决各种适配和各种布局嵌套_第6张图片
480*800
【Tips】神奇的Guideline完美解决各种适配和各种布局嵌套_第7张图片
1440*2560

你可能感兴趣的:(【Tips】神奇的Guideline完美解决各种适配和各种布局嵌套)