ios - 苹果自制iOS教程帮助: Unintended overlap with nested Stack Views

Question

我一直在关注 Apple 制作的官方 iOS 开发教程 ( located here )。这是一个新教程，创建于 2016 年 12 月，所以我还没有找到这个问题的任何答案。这是我坚持的部分:

EXPLORE FURTHER

When in editing mode, the rating control extends over the delete button. This is because the cell’s layout was not designed using Auto Layout. The controls fit in the normal allotted space, but the control doesn’t adapt when the space is reduced.

To fix this, you need to lay out the cell using nested stack views and Auto Layout constraints; however, that is left as an exercise for the reader.

For more information, see Auto Layout Guide.

我所做的每一次尝试都以压缩右侧(第 5 次开始)或左侧(食物图片)结束。

我有两个关键问题:

1. 按下编辑按钮和删除按钮时的父 View 是什么。根据我(有限的)理解，左右两边的行为似乎有所不同。

2. 低头的正确方向是什么？我最接近的解决方案如下:标签和评级系统的一个堆栈 View 。然后是一个额外的 Stack View，将前面提到的那个和图片包裹起来。

如果有人想修改它，可以在页面底部下载源代码。

感谢您的宝贵时间。

Answer 1

就我个人而言，我倾向于让星星可收缩，这样当空间不足时，它们会适当调整大小。

不幸的是，要做到这一点，您必须调整一些代码。特别是，您可能想要调整 RatingControl 以便星星能够优雅地调整大小。当前的实现强制了它们的大小:

button.heightAnchor.constraint(equalToConstant: starSize.height).isActive = true
button.widthAnchor.constraint(equalToConstant: starSize.width).isActive = true

我建议将其更改为“最大”尺寸，并仅确保宽度与高度的比例不变。

button.heightAnchor.constraint(lessThanOrEqualToConstant: starSize.height).isActive = true
button.widthAnchor.constraint(lessThanOrEqualToConstant: starSize.width).isActive = true
button.widthAnchor.constraint(equalTo: button.heightAnchor).isActive = true

或者，就我个人而言，我认为等效的 activate 语法更清晰:

NSLayoutConstraint.activate([
    button.heightAnchor.constraint(lessThanOrEqualToConstant: starSize.height),
    button.widthAnchor.constraint(lessThanOrEqualToConstant: starSize.width),
    button.widthAnchor.constraint(equalTo: button.heightAnchor)
])

您可能还应该使按钮大小相同(所以我只是将上述约束添加到第一个按钮，然后使所有其他按钮的大小和宽度都与第一个按钮相同)。

然后，如果您向调用评级控件大小调整的单元格添加适当的约束，评级控件将适本地调整大小。

或者你可以使用堆栈 View :

• 将标签和 RatingControl 添加到一个垂直堆栈 View ；
• 将该堆栈 View 和 ImageView 添加到水平堆栈 View ；和
• 在堆栈 View 和单元格的内容 View 之间添加约束。

就个人而言，我认为堆栈 View 方法并不比仅添加适当的约束更容易，但这两种方法都可以正常工作。有时堆栈 View 会让生活变得非常非常轻松，但我认为在这种情况下这是一种洗礼。您的选择。

---

你问:

What is the parent view when the edit button is pressed vs the delete button?

ImageView 、评级控件和标签的父 View 是单元格的“内容 View ”。无论单元格是否处于编辑模式，这都是内容 View 。这是内容 View 的目的，因此当单元格进入或退出编辑模式时，整个 View 层次结构不必更改。您始终可以在调试器中暂停执行并使用查看调试器按钮 ，如果您对任何给定点的 View 层次结构有疑问:

您可以看到相同的 UITableViewCellContentView 在 View 层次结构中，无论单元格是否处于编辑模式。