ios - 流畅的垂直布局、动态标签和自动布局

标签 ios text autolayout

我正在尝试在 ios7 中使用自动布局复制流畅的垂直布局。 问题是我正在使用一堆 UILabels (和其他元素)和 AttributedStrings (但这似乎不会干扰这个问题,因为它也带有纯文本) 并且标签中的文本是动态添加的,但是框架或更好的约束似乎没有以正确的方式自动适应(未指定标签的高度),因为标签保留了 xib 中给定的尺寸.

Initial configuration in the Xib, blue are setted equality constraints

Initial configuration in the Xib, blue are setted equality constraints

如果我使用较低的压缩和拥抱优先级值来设置较大的高度约束常量,则相同。没有任何变化。

After adding text and resizing constraint value (the text should have 5 rows)

After adding text and resizing constraint value (the text should have 5 rows

每次以这种方式或使用 CoreText 或许多其他方法更改文本时,我终于尝试重新创建约束

[self.view setAutoresizesSubviews:NO];
label.lineBreakMode = NSLineBreakByWordWrapping;
label.numberOfLines = 0;
label.preferredMaxLayoutWidth = label.frame.size.width;

[label removeConstraint:oldConstraint];

NSInteger height = ceil([label.attributedText
               boundingRectWithSize:CGSizeMake(label.frame.size.width, 10000)
               options:(NSStringDrawingUsesLineFragmentOrigin | NSStringDrawingUsesFontLeading)
               //TODO 20 or 1.5 is an hardoced value. find solution to workaround
               //attributes:@{NSFontAttributeName:[UIFont fontWithName:kFontCrimsonText_Roman size:17]}
               context:nil].size.height) + 1;

NSLayoutConstraint * newConstraint = [NSLayoutConstraint constraintWithItem:label
                                                                  attribute:NSLayoutAttributeHeight
                                                                  relatedBy:NSLayoutRelationEqual
                                                                     toItem:nil
                                                                  attribute:NSLayoutAttributeNotAnAttribute
                                                                 multiplier:1.0f
                                                                   constant:height];
[label addConstraint:newConstraint];

这次标签的尺寸看起来是正确的,但其中的文本显示不正确:

假设我有一个 5 行 的文本,仅显示第一行,而最后一行被剪掉,尽管框架似乎完全符合所需的尺寸。

the red space remains in any case

将高度乘以 2(或另一个常数)似乎可以解决问题,但显然现在文本比框架要小,而且顶部和底部留有很多空白。。 p>

尝试使用 [label fitToSize] 似乎效果很好,但显然约束会在之后立即恢复框架。

使用动态 UI 标签和自动布局实现垂直流畅布局的最佳做法是什么?

最佳答案

创建“流体垂直布局”的最佳方式...UITableView

说真的,这看起来是使用 UITableView 的完美选择。

它不仅仅用于显示数据列表。例如,在 iOS 的 Contacts 应用程序中,个人联系人(您可以在其中添加号码和电子邮件等...)使用 UITableView 来布局界面。

它消除了必须计算标签的高度和位置等的所有麻烦......

使用您的 UILabels 之一的正确布局定义自定义 UITableViewCell,然后您只需将正确的文本放入正确的行即可。

UITableView 是一个非常强大的工具,可以处理此类事情。

关于ios - 流畅的垂直布局、动态标签和自动布局,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23674082/

相关文章:

ios - 找不到匹配的配置文件 : Your build settings specify a provisioning profile with the UUID “fbbe2..” , 但是,没有这样的

iPhone 6 上的 IOS 应用程序 'The application could not be verified'

android - 用于地理定位的后台服务在 Phonegap (android) 中不起作用

java - 如何通过 HttpPost 方法发送文本?

python - 使用正则表达式 python 保留笑脸/表情符号,同时删除特殊字符

swift - 向 uiview 添加约束时的 SIGABRT

ios - 在 View 中均匀分布空间,没有边距

ios - NavigationLink 似乎只占用一点空间

python - 语音到ext转换

ios - 使用自动布局的 UITextView 动态高度 - 每行新行的文本截断顶行