UILabel 作为tableViewCell 的accessoryView 上移答案

【问题标题】：UILabel as tableViewCell's accessoryView is shifted upUILabel 作为tableViewCell 的accessoryView 上移
【发布时间】：2020-04-04 22:09:35
【问题描述】：

我正在创建一个普通的 UILabel 并将其设置为 tableViewCell 的附件视图。我的理解是，accessoryView 在单元格内保持垂直居中对齐。但这并没有发生。当我减小标签文本的字体时，附件视图会向上移动。按钮工作得很好。 UILabel 的问题。

这是我的代码：

func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
    let cell = UITableViewCell(style: .default, reuseIdentifier: "cell")
    cell.textLabel?.text = "Hello"

    let label = UILabel(frame: CGRect(x: 0, y: 0, width: 42, height: 21))
    label.backgroundColor = UIColor.red
    label.font = UIFont(name: "Helvetica Neue", size: 12)
    label.highlightedTextColor = UIColor.white
    label.translatesAutoresizingMaskIntoConstraints = false
    label.textColor = UIColor.green
    label.textAlignment = .right;
    label.clipsToBounds = true
    label.autoresizesSubviews = true
    label.contentMode = .left
    label.text = "123";

    cell.accessoryView = label
    return cell
}

【问题讨论】：

标签： ios swift xcode uilabel vertical-alignment

【解决方案1】：

正如@Faizyy 所注意到的，iOS 13 存在问题，但提供较小的高度并不总是一种选择。我的方法是将 UILabel 放入与 UILabel 大小相同的 UIView 中，并将该容器视图用作附件视图。这为我解决了对齐问题。这是一个例子：

cell.accessoryView = [self getBadge:unread];

-(UIView *)getBadge:(int)count {
    CGFloat size = 28;
    CGFloat digits = [[@(count) stringValue] length];
    CGFloat width = MAX(size, 0.7 * size * digits);

    UILabel *badge = [[UILabel alloc] initWithFrame:CGRectMake(0, 0, width, size)];
    badge.text = [@(count) stringValue];
    badge.layer.cornerRadius = size / 2;
    badge.layer.masksToBounds = YES;
    badge.textAlignment = NSTextAlignmentCenter;
    badge.font = [UIFont fontWithName:@"AvenirNext-Medium" size:16];
    badge.textColor = UIColor.whiteColor;
    badge.backgroundColor = VSColor.blue;

    UIView *badgeHolder = [[UIView alloc] initWithFrame:CGRectMake(0, 0, width, size)];
    badgeHolder.backgroundColor = UIColor.clearColor;
    [badgeHolder addSubview:badge];

    return badgeHolder;
}

【讨论】：

这是一个可行的解决方案，感谢这个想法。在 iOS 14.4 上甚至需要容器，因此它不仅与 iOS 13 相关。一个小的改进建议是在声明容器时使用徽章框架大小：UIView *badgeHolder = [[UIView alloc] initWithFrame:badge.frame];

【解决方案2】：

如果您正在使用 SwiftUI，您应该考虑使用自动布局将 UILabel 居中到单元格，以防止它向上移动。如果您使用 SwiftUI，则必须使用 SwiftUI 布局系统。希望对您有所帮助。

【讨论】：

【解决方案3】：

我找到了解决方案。我给 UILabel 的框架是 CGRect(x: 0, y: 0, width: 42, height: 21)。如果我给出与文本大小相同的高度，即 12.0，则标签将居中对齐:)。这似乎是 iOS 13 的问题。在 iOS 12 设备中看不到。

let label = UILabel(frame: CGRect(x: 0, y: 0, width: 42, height: 12))

【讨论】：

感谢您指出存在 iOS 13 问题。但是，您的解决方案不适用于 iOS 14.4，它还存在垂直对齐单元格中的 UILabel 的问题。来自@Raimundas Sakalauskas 的容器UIView 的解决方案确实有效。