[英]Align two labels vertically with different font size
我有一个父UIView
,在其中放置了两个标签。 每个标签只有一行,如下所示:
现在的问题是基线错误。 我正在使用自动布局,问题是在这种情况下约束应如何显示? 特别是标签的垂直放置。 这些是我目前有的约束:
H:|-[title]-2-[description]-(>=5)-| //with NSLayoutFormatOptions.AlignAllFirstBaseline
V:|[title]|
V:|[description]|
上述约束导致
无法同时满足约束条件。
因为居中和第一个基线约束相互抵触。 标签应采用父级的完整高度,但字体大小应不同。
我试图将标签固定在顶部/底部,但这并不适用于所有情况。
我应该如何垂直放置标签?
要查看会发生什么,请将标签的背景设为黄色。 您有不明确的约束。
要解决此问题,请删除最后一个垂直约束。 不用了
这在我的测试环境中起作用:
let titleLabel = UILabel()
titleLabel.setTranslatesAutoresizingMaskIntoConstraints(false)
titleLabel.font = UIFont.boldSystemFontOfSize(30)
titleLabel.text = "title"
hostView.addSubview(titleLabel)
let descriptionLabel = UILabel()
descriptionLabel.setTranslatesAutoresizingMaskIntoConstraints(false)
descriptionLabel.font = UIFont.boldSystemFontOfSize(20)
descriptionLabel.text = "description"
hostView.addSubview(descriptionLabel)
let views = ["title": titleLabel, "description": descriptionLabel]
NSLayoutConstraint.activateConstraints(NSLayoutConstraint.constraintsWithVisualFormat("|-[title]-2-[description]-(>=5)-|", options: NSLayoutFormatOptions.AlignAllFirstBaseline, metrics: nil, views: views))
NSLayoutConstraint(item: titleLabel, attribute: .CenterY, relatedBy: .Equal, toItem: hostView, attribute: .CenterY, multiplier: 1.0, constant: 0.0).active = true
结果:
可以使用AttributedString代替富文本格式使用两个不同的标签。 这是一个例子:
- (NSMutableAttributedString*)getRichText {
NSString *str1 = @"I am bold ";
NSString *str2 = @"I am simple";
NSMutableAttributedString *attString=[[NSMutableAttributedString alloc] initWithString:[str1 stringByAppendingString:str2]];
UIFont *font1=[UIFont fontWithName:@"Helvetica-Bold" size:30.0f];
UIFont *font2=[UIFont fontWithName:@"Helvetica" size:20.0f];
NSInteger l1 = str1.length;
NSInteger l2 = str2.length;
[attString addAttribute:NSFontAttributeName value:font1 range:NSMakeRange(0,l1)];
[attString addAttribute:NSFontAttributeName value:font2 range:NSMakeRange(l1,l2)];
return attString;
}
在“查看确实加载”中,您可以将字符串设置为label,如下所示:
UILabel *textLabel = [[UILabel alloc] initWithFrame:CGRectMake(0, 0, 300, 50)];
[self.view addSubview:textLabel];
textLabel.attributedText = [self getRichText];
输出:
您需要做的很简单。 您两个标签(对象)的高度只需相同。
为此,请在您的第一个标签上添加约束(例如40 px)。 完成后,选择第一个和第二个标签,然后在屏幕底部的约束菜单中(左侧的一个,添加新的对齐约束)选择顶部边缘和底部边缘。
然后,您可以根据需要设置宽度的顶部,底部,底部等。
请享用
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.