iOS开发之topLayoutGuide和bottomLayoutGuide的使用小技巧分享

时间:2022-12-01 12:29:03

前言

layoutguide这个概念在本人从事ios开发过程中一直是比较陌生的。直至最近想要了解这个细碎的知识点,就随手查了一下,发现这个概念从ios7的top/bottom layoutguide,到ios9 uilayoutguide类的引入,直至最近的ios11涉及适配iphone x,引入了safe area概念,并且uiview增加了一个safearealayoutguide属性。发现自己真的是知道的太少了,所以决定深入的研究下。

在ios开发的过程中我们经常会遇到一些紧贴tabbar有工具条之类的页面,比如说购买、支付等页面,往往这些页面有时候在栈底显示(页面有tabbar),有时不在(页面没有tabbar)。

比如:

iOS开发之topLayoutGuide和bottomLayoutGuide的使用小技巧分享

这种页面对于常规的做法是有tabbar的时候设置一套约束,没有tabbar的时候更新一下约束。但是苹果提过了一个bottomlayoutguide可以让我们更优雅的处理这类问题。

代码如下:

?
1
2
3
4
5
6
7
8
_bottomview = [uiview new];
 _bottomview.backgroundcolor = [uicolor yellowcolor];
 [self.view addsubview:_bottomview];
 [_bottomview mas_makeconstraints:^(masconstraintmaker *make) {
  make.height.equalto(@40);
  make.left.and.right.equalto(self.view);
  make.bottom.equalto(self.mas_bottomlayoutguide);
 }];

搭配masonry,使用masonry提供的mas_bottomlayoutguide仅需一行我们就可以实现这样的效果。

同样来说这种效果对于navigationbar也适用——toplayoutguide。对应的masonry使用方法是mas_toplayoutguide。
完整代码(代码量太少就不给完整的链接了):

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
#import "viewcontroller.h"
#import "masonry.h"
@interface viewcontroller ()
@property (strong, nonatomic) uiview *topview;
@property (strong, nonatomic) uiview *bottomview;
@end
 
@implementation viewcontroller
 
- (void)viewdidload {
 [super viewdidload];
 // do any additional setup after loading the view, typically from a nib.
 uibutton *btn = [uibutton buttonwithtype:uibuttontypecustom];
 btn.frame = cgrectmake(0, 164, 80, 50);
 [btn settitle:@"top" forstate:uicontrolstatenormal];
 btn.backgroundcolor = [uicolor redcolor];
 [btn addtarget:self action:@selector(topclick) forcontrolevents:uicontroleventtouchupinside];
 [self.view addsubview:btn];
 
 uibutton *btn1 = [uibutton buttonwithtype:uibuttontypecustom];
 btn1.backgroundcolor = [uicolor yellowcolor];
 btn1.frame = cgrectmake(0, 264, 80, 50);
 [btn1 settitle:@"bottom" forstate:uicontrolstatenormal];
 [btn1 settitlecolor:[uicolor blackcolor] forstate:uicontrolstatenormal];
 [btn1 addtarget:self action:@selector(bottomclick) forcontrolevents:uicontroleventtouchupinside];
 [self.view addsubview:btn1];
 [self initview];
}
 
- (void)initview {
 _topview = [uiview new];
 _topview.backgroundcolor = [uicolor greencolor];
 [self.view addsubview:_topview];
 [_topview mas_makeconstraints:^(masconstraintmaker *make) {
  make.height.equalto(@40);
  make.left.and.right.equalto(self.view);
 
  make.top.equalto(self.mas_toplayoutguide);
 
 }];
 
 _bottomview = [uiview new];
 _bottomview.backgroundcolor = [uicolor yellowcolor];
 [self.view addsubview:_bottomview];
 [_bottomview mas_makeconstraints:^(masconstraintmaker *make) {
  make.height.equalto(@40);
  make.left.and.right.equalto(self.view);
  make.bottom.equalto(self.mas_bottomlayoutguide);
 }];
}
- (void)topclick{
 
 [self.navigationcontroller setnavigationbarhidden:!self.navigationcontroller.navigationbarhidden animated:no];
// [self updateviewconstraints];
}
- (void)bottomclick{
 
 [self.navigationcontroller settoolbarhidden:!self.navigationcontroller.toolbarhidden animated:no];
 // 手动触发updateviewconstraints
// [self updateviewconstraints];
}
- (void)didreceivememorywarning {
 [super didreceivememorywarning];
 // dispose of any resources that can be recreated.
}
 
@end

附:ios 使用layoutguide 来限制控件的位置,配合auto layout constraints

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
uibutton *button = [uibutton buttonwithtype:uibuttontypedetaildisclosure];
[self.view addsubview:button];
 
[button settranslatesautoresizingmaskintoconstraints: no];
 
// 得到当前视图的最低基准限制,这个是对于auto layout constraint来说的。
id bottomguide = self.bottomlayoutguide;
nsdictionary *viewsdictionary = nsdictionaryofvariablebindings (button, bottomguide);
[self.view addconstraints:[nslayoutconstraint constraintswithvisualformat: @"v:[button]-20-[bottomguide]"
                                 options: 0
                                 metrics: nil
                                  views: viewsdictionary]];
 
[self.view layoutsubviews];

同理可以得到toplayoutguide,这个是视图最高基准限制

总结

以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作具有一定的参考学习价值,如果有疑问大家可以留言交流,谢谢大家对服务器之家的支持。

原文链接:https://segmentfault.com/a/1190000012033349