美文网首页
iOS Masonry布局UI之约束冲突解决

iOS Masonry布局UI之约束冲突解决

作者: ibabyblue | 来源:发表于2018-09-27 00:16 被阅读452次

想必Masonry是什么?就不用解释了。公司项目采用纯代码布局,使用的就是Masonry,当然使用Masonry布局,时长会出现约束冲突的问题,这也就开始了我的再次优化之路->消除约束冲突。
当然控制台打印的约束冲突,一般显示不会有问题,个别除外,约束本来就是错误的那就另当别论了!虽然不影响功能实现,此类警告信息看着很不爽。


解决此类问题时,顺便做下总结,产生约束冲突一般为以下几种情况:
1.约束冗余
2.更新约束
3.约束优先级

一、约束冗余

设置约束冗余,顾名思义就是对于同一约束项,添加了过多的约束限制,从而产生冲突。例如: image.png

图中设置的冗余约束为,视图的高度约束,因为已经添加了top、height,此时约束已经设置好了,bottom是已经知晓的,但是又设置了一次bottom,所以造成了约束冗余,删除bottom约束即可。其他冗余约束类似。

二、更新约束

一般设置约束之后,在某些特定的场景下,需要更新约束设置,此时比较容易造成约束冲突。翻阅Masonry GitHub Readme可知,其设置约束常用的方法:
1、mas_makeConstraints
正常设置约束方法。
2、mas_updateConstraints
更新约束方法。(注意:更新常量值)
3、mas_remakeConstraints
重新设置约束方法。(删除之前的约束,再添加新的约束)
暴力解决冲突,使用mas_remakeConstraints更新约束,但效率不高。官方推荐还是使用mas_updateConstraints更新约束。更新约束冲突与否的情况对比如下:
场景1:父子视图

image.png
一、约束x、y:
image.png 更新约束:
image.png 结论:x、y不冲突(上述x、y值是随便写的)
二、约束centerX、centerY,分为2种情况:
1. image.png 更新约束:
image.png 结论:上述设置不冲突(CenterX值是随便写的),CenterY同上。
2. image.png 更新约束:
image.png 结论:上述设置冲突(CenterX值是随便写的),CenterY同上。

三、Center分为2种情况:

1. image.png 上述红框内的两种设置都可以
更新约束: image.png 结论:上述设置不冲突(更新以及设置的约束数值均为随便填写)。
2. image.png 更新约束:
image.png 结论:上述设置冲突(更新以及设置的约束数值均为随便填写)。

四、width、height分为2种情况:

1. image.png 更新约束:
image.png 结论:上述设置不冲突(更新以及设置的约束数值均为随便填写)。
2. image.png
上述设置的两种方法均可
更新约束:
image.png 结论:上述设置冲突(更新以及设置的约束数值均为随便填写)。height同上。

综上所述,更新约束时需要查看是否为依赖父视图的约束,是则需要更新之前将原有的约束卸载uninstall,然后再次添加约束。
1、x、y不受影响
2、width、height受影响最大。

场景2:兄弟视图 image.png
一、设置约束x、y 2种情况:
1. image.png
更新约束: image.png
结论:上述设置会冲突。
2. image.png
更新约束: image.png 结论:上述设置不会冲突。上述约束数值均随便填写。
综上所述:
是否存在依赖关系,是否改变了依赖关系。
第一种情况,更新约束后,更新的left、top的约束是相对于父视图的约束,而在更新之前是相对于brother视图设置的约束。从而会产生约束冲突,需要卸载之前的约束再更新。

第二种情况,更新的约束依然是相对于brother视图的约束,只是改变了约束的常量值,从而并不会产生约束冲突。
二、设置width、height约束分为两种情况:

1. image.png
更新约束: image.png
结论:上述设置不会冲突。
2. image.png
更新约束: image.png 结论:上述设置会冲突。上述约束数值均随便填写。
综上所述,情况与x、y约束情况一致,其他情况以此类推!

三、约束优先级

在Masonry中优先级:低优先级(priorityLow)、中优先级(priorityMedium)、高优先级(priorityHigh)。
默认情况下,Masonry设置的约束为中级,当在某些特定场景下(很少,有可能父视图和其他视图的约束导致,此种情况后续会跟进。),正常设置约束的情况下,也会出现约束冲突警告,此时可以设置约束的优先级来避免约束冲突警告。例如:
视图的width必须为某个值,但此约束存在约束冲突,此时可以设置width约束优先级为高优先级。

GitHub:https://github.com/SnapKit/Masonry

相关文章

网友评论

      本文标题:iOS Masonry布局UI之约束冲突解决

      本文链接:https://www.haomeiwen.com/subject/hmcdoftx.html