如何在Tableview的三列中放置文本

Posted 2023-03-12

【中文标题】如何在Tableview的三列中放置文本

【英文标题】：How to Place Text in three columns of Tableview

【发布时间】：2020-10-02 21:01:51

【问题描述】：

我有一个表格视图，我在其中添加了一个文本字符串（三个 NSStrings）。

由于三个文本字符串的长度相似，我想知道是否有一种简单的方法可以使用简单的 stringWithFormat 来做到这一点

[NSString stringWithFormat:@"%@ %@ %@" , hours, days, months];

我试过 \t 但这不是最好的，我想知道它在不同的平台上如何工作。我已经为 iPhone 缩小了字体。

想要

3       5       1 
12      6       7 
2       30      12

【问题讨论】：

不确定我是否理解正确，每个单元格中是否包含三个数字？在这种情况下，您可以尝试水平的UIStackView。

表格视图没有“列”。这看起来像一个集合视图，而不是一个表格视图。

【参考方案1】：

我会在每个单元格内使用UIStackView。

self.data = @[@[@"3", @"5", @"1"], @[@"12", @"6", @"7"], @[@"2", @"30", @"12"]];

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath 
    UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier: @"test" forIndexPath:indexPath];
    
    UILabel *label1 = [UILabel new];
    label1.text = self.data[indexPath.row][0];
    label1.textAlignment = NSTextAlignmentCenter;
    
    UILabel *label2 = [UILabel new];
    label2.text = self.data[indexPath.row][1];
    label2.textAlignment = NSTextAlignmentCenter;

    UILabel *label3 = [UILabel new];
    label3.text = self.data[indexPath.row][2];
    label3.textAlignment = NSTextAlignmentCenter;

    UIStackView *stackView = [[UIStackView alloc] initWithArrangedSubviews: @[label1, label2, label3]];
    stackView.tag = 1;
    
    stackView.axis = UILayoutConstraintAxisHorizontal;
    stackView.distribution = UIStackViewDistributionFillEqually;
    
    UIView *sub = [cell.contentView viewWithTag: 1];
    
    if (sub != nil ) 
        [sub removeFromSuperview];
    
    
    [cell.contentView addSubview: stackView];
    
    stackView.translatesAutoresizingMaskIntoConstraints = NO;
    
    [stackView.centerYAnchor constraintEqualToAnchor: cell.contentView.centerYAnchor].active = YES;
    [stackView.leadingAnchor constraintEqualToAnchor: cell.contentView.leadingAnchor constant: 10].active = YES;
    [stackView.trailingAnchor constraintEqualToAnchor: cell.contentView.trailingAnchor constant: -10].active = YES;

    return cell;

编辑：向堆栈视图添加了一个标签，以防止重复使用的单元格具有多个堆栈视图。

结果：

【讨论】：

这种方法效果很好。如何调整堆栈视图以适应 iPhone 或旋转时的大小？

我只在模拟器上测试过，堆栈视图在旋转时会自动调整。

您是在 XIB 上创建堆栈视图还是仅在代码中创建？我逐字添加了您的文本进行测试，它无需在 XIB 中添加堆栈视图即可工作，但它不会在旋转模拟器上调整大小。

我必须向 tableview 添加约束。现在它调整大小。谢谢

@cavuco：很高兴它有效。在我的示例中，我在 Storyboard 中使用了 UITableViewController，我猜这已经为 tableView 添加了约束。

【参考方案2】：

列不必是 UI 元素。从 ios 7.0 开始，这可以通过属性字符串解决

NSArray *tabs = @[
    [[NSTextTab alloc] initWithTextAlignment:NSTextAlignmentLeft location:72.0 options:@],
    [[NSTextTab alloc] initWithTextAlignment:NSTextAlignmentLeft location:144.0 options:@]
];
    
NSMutableParagraphStyle *style = [[NSParagraphStyle defaultParagraphStyle] mutableCopy];
style.defaultTabInterval = 72.0;
style.tabStops = tabs;
    
NSDictionary *attr = @ NSFontAttributeName:[UIFont systemFontOfSize:18.0], NSParagraphStyleAttributeName:style ;
    
NSString *hh = @"2";
NSString *dd = @"30";
NSString *mm = @"12";
NSAttributedString *tabbedString = [[NSAttributedString alloc] initWithString:[NSString stringWithFormat:@"%@\t%@\t%@", hh, dd, mm] attributes:attr];

但请注意，当它们之间的空间不用于以字体大小显示部分字符串时，制表位可以改变字符串布局。

【讨论】：

style.defaultTabInterval = 72.0 在分配 style.tabStops=tabs 时的作用是什么？分配每个制表位的位置？我如何让这个更依赖于设备（即 iPhone vs ipad）？我可以单独为每个条目（mm、hh）分配不同的字体或大小，还是必须使用相同的字体和大小？

defaultTabInterval 将在使用最后一个预期的制表符后重复应用，以防在字符串中使用更多制表符。在上面的示例中，意味着第三个制表符将是 144.0+72.0。是的，您可以格式化不同的大小、字体，您只需将属性字符串扩展为您需要的内容。阅读更多here 或查找您可以使用 NSAttributedString 执行的其他操作

一个问题，当我将 AttributedString 分配给单元格元素 '' DataElement *e [[DataElement alloc] initWithLabel: tabbedString]; '' 它说它是一个不兼容的指针。 （NSAttributedString 为参数类型 NSString）。