contentView 在 iOS 6 UITableViewCell 原型单元格中没有缩进 [英] contentView not indenting in iOS 6 UITableViewCell prototype cell

问题描述

我正在使用故事板中的原型单元格配置自定义 UITableViewCell.但是，所有 UILabels(和其他 UI 元素)似乎都没有添加到单元格的 contentView 中，而是添加到了 UITableViewCell直接查看.当单元格进入编辑模式时，这会产生问题，因为内容不会自动移动/缩进(如果它们在 contentView 内，它会这样做).

I am configuring a custom UITableViewCell using a prototype cell in a Storyboard. However, all the UILabels (and other UI elements) do not seem to be added to the cell's contentView, instead being added to the UITableViewCell view directly. This creates issues when the cell is put into editing mode, as the content is not automatically shifted/indented (which it would do, if they were inside the contentView).

在使用 Interface Builder/Storyboard/prototype 单元格布局单元格时，有什么方法可以将 UI 元素添加到 contentView 中?我发现的唯一方法是在代码中创建所有内容并使用 [cell.contentView addSubView:labelOne] 这不会很好，因为以图形方式布局单元格要容易得多.

Is there any way to add the UI elements to the contentView when laying out the cell using Interface Builder/Storyboard/prototype cells? The only way I have found is to create everything in code and use [cell.contentView addSubView:labelOne] which wouldn't be great, as it is much easier to layout the cell graphically.

推荐答案

进一步调查(查看单元格的子视图层次结构)Interface Builder 确实将子视图放置在单元格的 contentView 中，它只是没有看起来不像.

On further investigation (viewing the subview hierarchy of the cell) Interface Builder does place subviews within the cell's contentView, it just doesn't look like it.

问题的根本原因是 iOS 6 自动布局.当单元格进入编辑模式(并缩进)时，contentView 也会缩进，所以 contentView 中的所有子视图都会移动(缩进).位于 contentView 中.然而，Interface Builder 应用的所有自动布局约束似乎都与UITableViewCell 本身有关，而不是contentView.这意味着即使 contentView 缩进，其中包含的子视图不会 - 约束负责.

The root cause of the issue was iOS 6 autolayout. When the cell is placed into editing mode (and indented) the contentView is also indented, so it stands to reason that all subviews within the contentView will move (indent) by virtue of being within the contentView. However, all the autolayout constraints applied by Interface Builder seem to be relative to the UITableViewCell itself, rather than the contentView. This means that even though the contentView indents, the subviews contained within do not - the constraints take charge.

例如，当我将 UILabel 放入单元格(并将其放置在距单元格左侧 10 点的位置)时，IB 会自动应用约束水平空间 (10)".然而，这个约束是相对于 UITableViewCell 而不是 contentView 的.这意味着当单元格缩进，并且 contentView 移动时，标签保持原样，因为它符合约束，从 UITableViewCell.

For example, when I placed a UILabel into the cell (and positioned it 10 points from the left-hand side of the cell) IB automatically applied a constraint "Horizontal Space (10)". However, this constraint is relative to the UITableViewCell NOT the contentView. This means that when the cell is indented, and the contentView moves, the label stays put as it is complying with the constraint to remain 10 points from the left-hand side of the UITableViewCell.

不幸的是(据我所知)没有办法从 IB 本身中删除这些 IB 创建的约束，所以这里是我解决问题的方法.

Unfortunately (as far as I am aware) there is no way to remove these IB created constraints from within IB itself, so here is how I solved the problem.

在单元格的 UITableViewCell 子类中，我为名为 cellLabelHSpaceConstraint 的约束创建了一个 IBOutlet.您还需要一个用于标签本身的 IBOutlet，我称之为 cellLabel.然后我实现了 -awakeFromNib 方法，如下所示:

Within the UITableViewCell subclass for the cell, I created an IBOutlet for that constraint called cellLabelHSpaceConstraint. You also need an IBOutlet for the label itself, which I called cellLabel. I then implemented the -awakeFromNib method as per below:

- (void)awakeFromNib {

    // -------------------------------------------------------------------
    // We need to create our own constraint which is effective against the
    // contentView, so the UI elements indent when the cell is put into
    // editing mode
    // -------------------------------------------------------------------

    // Remove the IB added horizontal constraint, as that's effective
    // against the cell not the contentView
    [self removeConstraint:self.cellLabelHSpaceConstraint];

    // Create a dictionary to represent the view being positioned
    NSDictionary *labelViewDictionary = NSDictionaryOfVariableBindings(_cellLabel);   

    // Create the new constraint
    NSArray *constraints = [NSLayoutConstraint constraintsWithVisualFormat:@"|-10-[_cellLabel]" options:0 metrics:nil views:labelViewDictionary];

    // Add the constraint against the contentView
    [self.contentView addConstraints:constraints];

}

总而言之，上面将删除 IB 自动添加的水平间距约束(对 UITableViewCell 而不是 contentView 有效)，然后我们定义并添加我们自己对 contentView 的约束.

In summary, the above will remove the horizontal spacing constraint which IB automatically added (as is effective against the UITableViewCell rather than the contentView) and we then define and add our own constraint to the contentView.

在我的例子中，单元格中的所有其他 UILabels 都是根据 cellLabel 的位置定位的，所以当我修复这个元素的约束/定位时其他人效仿并正确定位.但是，如果您有更复杂的布局，那么您可能也需要对其他子视图执行此操作.

In my case, all the other UILabels in the cell were positioned based upon the position of the cellLabel so when I fixed up the constraint/positioning of this element all the others followed suit and positioned correctly. However, if you have a more complex layout then you may need to do this for other subviews as well.

这篇关于contentView 在 iOS 6 UITableViewCell 原型单元格中没有缩进的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！