博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
UILabel-抗拉伸和抗压缩性
阅读量:6165 次
发布时间:2019-06-21

本文共 2661 字,大约阅读时间需要 8 分钟。

场景: 三段文字,第一个和第二个左右排列,顶部对齐且第二段内容的左边与第一段内容的右边距离为20px,第三个的顶部距离上面两个的底部为20px,且三段内容距离视图边界均为30px;通常的,使用三个UILabel控件来展示此UI布局。

  • 声明3个UILabel属性
@property (nonatomic, strong) UILabel *oneLabel;//上 -左@property (nonatomic, strong) UILabel *twoLabel;//上 -右@property (nonatomic, strong) UILabel *threeLabel;//下复制代码
  • 这里懒加载创建控件
- (UILabel *)oneLabel{    if (!_oneLabel) {        _oneLabel = [[UILabel alloc] init];        _oneLabel.textColor = [UIColor redColor];        _oneLabel.font = [UIFont systemFontOfSize:15];    }    return _oneLabel;}- (UILabel *)twoLabel{    if (!_twoLabel) {        _twoLabel = [[UILabel alloc] init];        _twoLabel.textColor = [UIColor orangeColor];        _twoLabel.font = [UIFont systemFontOfSize:15];        _twoLabel.numberOfLines = 0;//换行    }    return _twoLabel;}- (UILabel *)threeLabel{    if (!_threeLabel) {        _threeLabel = [[UILabel alloc] init];        _threeLabel.textColor = [UIColor magentaColor];        _threeLabel.font = [UIFont systemFontOfSize:15];        _threeLabel.numberOfLines = 0;//换行    }    return _threeLabel;}复制代码
  • 使用Masonry来布局
[self.view addSubview:self.oneLabel];    [self.view addSubview:self.twoLabel];    [self.view addSubview:self.threeLabel];        self.oneLabel.text = @"抗压缩和抗拉伸性";    self.twoLabel.text = @"遇见你,我变得很低很低,一直低到尘埃里去,但我的心是欢喜的。并且在那里开出一朵花来。";    self.threeLabel.text = @"我行过许多地方的桥,看过许多次数的云,喝过许多类的酒,却只爱过一个正当最好年龄的人";        [self.oneLabel mas_makeConstraints:^(MASConstraintMaker *make) {        make.leading.equalTo(@15);        make.top.mas_equalTo(20 + 64);    }];        [self.twoLabel mas_makeConstraints:^(MASConstraintMaker *make) {        make.leading.equalTo(_oneLabel.mas_trailing).mas_offset(10);        make.trailing.equalTo(@-15);        make.top.equalTo(_oneLabel);    }];        [self.threeLabel mas_makeConstraints:^(MASConstraintMaker *make) {        make.leading.equalTo(_oneLabel);        make.top.equalTo(_twoLabel.mas_bottom).mas_offset(15);        make.trailing.equalTo(_twoLabel);    }];复制代码
  • 如此布局,运行效果

这样看,其实并没有什么问题,但如果twoLabel的text的内容不确定,比如: self.twoLabel.text = @"遇见你";

运行效果:

很显然,此时效果不符合要求。

  • 设置label的背景色

看到第一个label被水平拉伸了,导致视觉上看到第二个label依赖于右侧约束。 为了达到要求的布局,需要给左边label设置抗拉伸性。

  • 设置左边label的抗拉伸性
//抗拉伸性 越高越不容易被拉伸    [self.oneLabel setContentHuggingPriority:UILayoutPriorityRequired                                     forAxis:UILayoutConstraintAxisHorizontal];复制代码
  • 一般情况下,需要防止其拉伸的 有时也同样需要防止其被压缩,所以 通常一起设置其压缩性
//抗压缩性 越高越不容易被压缩    [self.oneLabel setContentCompressionResistancePriority:UILayoutPriorityRequired forAxis:UILayoutConstraintAxisHorizontal];复制代码
  • 最终效果:

  • 按住command + 设置拉伸和压缩性的代码 进入SDK,发现它们被声明于UIView,因为UILabel继承于UIView,自然有此方法;那么UIButton(->UIControl->UIView)等继承于UIView的控件也有此方法。

转载地址:http://iluba.baihongyu.com/

你可能感兴趣的文章
Scroll Depth – 衡量页面滚动的 Google 分析插件
查看>>
Windows 8.1 应用再出发 - 视图状态的更新
查看>>
自己制作交叉编译工具链
查看>>
Qt Style Sheet实践(四):行文本编辑框QLineEdit及自动补全
查看>>
[物理学与PDEs]第3章习题1 只有一个非零分量的磁场
查看>>
onInterceptTouchEvent和onTouchEvent调用时序
查看>>
android防止内存溢出浅析
查看>>
4.3.3版本之引擎bug
查看>>
SQL Server表分区详解
查看>>
STM32启动过程--启动文件--分析
查看>>
垂死挣扎还是涅槃重生 -- Delphi XE5 公布会归来感想
查看>>
淘宝的几个架构图
查看>>
linux后台运行程序
查看>>
Oracle中drop user和drop user cascade的区别
查看>>
登记申请汇总
查看>>
Android Jni调用浅述
查看>>
(二)Spring Boot 起步入门(翻译自Spring Boot官方教程文档)1.5.9.RELEASE
查看>>
Shell基础之-正则表达式
查看>>
讲讲吸顶效果与react-sticky
查看>>
c++面向对象的一些问题1 0
查看>>