自动布局 - 在表格单元格中对齐视图

Posted 2023-02-27

【中文标题】自动布局 - 在表格单元格中对齐视图

【英文标题】：Autolayout - aligning views in table cells

【发布时间】：2013-07-18 19:33:41

【问题描述】：

我目前正在将 ios 应用程序移植到自动布局，但我发现了一个我无法解决的问题。问题是UITableView。

表格很简单：

每个单元格都包含两个标签，它们之间有一个水平间距。 我希望根据内容自动调整第一个标签的大小 我希望所有单元格中的标签具有相同的宽度

第 1 点和第 2 点很简单，但我不知道如何创建一个约束来强制不同单元格中的视图具有相同的大小。

是否有任何自动布局解决方案或者我必须手动设置框架？

【问题讨论】：

1 和 3 如何兼容？您是否希望所有标签都是任何单元格中最长文本的宽度？你的意思是说你想让左右标签也一样大小吗？

@rdelmar 没错。我希望所有左侧标签都具有最长文本的宽度。我唯一的想法是在表格之外有一个隐藏视图，并为此视图添加宽度约束（在代码中），并在每个单元格中添加左侧标签。

您确定要 3 个吗？您是否考虑过边缘情况，例如您是否需要一个辅助视图或一行上的删除按钮？

@Maarten 这些案例我不感兴趣（即使滚动也不感兴趣）。无论如何，附件视图或删除按钮应该不是问题。

【参考方案1】：

我会通过创建一个带有两个标签的自定义单元类来做到这一点。给左标签一个宽度约束（以及对单元格左边缘和 centerY 的约束），给右标签一个对左标签的水平间距约束。将 IBOutlets 设置为两个标签，并将一个设置为左侧标签的宽度约束（在我的示例中我称之为 widthCon）。在我的示例中，我给两个标签都设置了背景颜色，这样我就可以看到宽度。我在viewDidLoad中计算了最长字符串的宽度，然后用这个数字来调整cellForRowAtIndexPath中宽度约束的常数：

@interface TableController ()
@property (strong,nonatomic) NSArray *theData;
@property (nonatomic) CGFloat maxWidth;
@end

@implementation TableController 


- (void)viewDidLoad 
    [super viewDidLoad];
    self.theData = @[@"One",@"Two",@"Three Hundred Forty",@"Four",@"Five",@"Six",@"Seven",@"Eight",@"Nine"];
    self.maxWidth = 0;
    for (NSString *s in self.theData) 
        CGSize stringSize = [s sizeWithFont:[UIFont systemFontOfSize:17]];
        if (stringSize.width > self.maxWidth) self.maxWidth = stringSize.width;
    
    [self.tableView reloadData];



- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section 
    return self.theData.count;


- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath 

    RDCell *cell = [tableView dequeueReusableCellWithIdentifier:@"Cell" forIndexPath:indexPath];
    cell.widthCon.constant = self.maxWidth;
    cell.leftLabel.text = self.theData[indexPath.row];
    return cell;