视图是水平和垂直模糊的,具有复杂的布局

Question

UIViewController我的故事板上有一个水平左右两个子视图.我添加了约束来将前沿和后沿修复为常量(20分),并添加另一个约束来保持宽度相等.如果我假设以下内容,应该可以计算每个子视图的宽度需要:

• 子视图不重叠
• 没有其他意见(水平,至少)
• 屏幕的宽度(超视图)是已知的

但是,XCode给了我一个警告,我的观点是横向模糊的.我猜这意味着XCode没有做出这些假设之一,但它是哪一个？有没有办法让我指示XCode做出这个假设？

编辑:好的,玩了一下并得到警告消失,但看起来它没有做出第一个假设 - 它只是设置每个子视图的宽度superview.width - 40,并愉快地将一个视图埋在另一个视图之下.所以问题是如何阻止它们重叠？

编辑2:好的,我的实际屏幕比我的简单示例复杂得多.这是我得到的:

所以在这个设置中我有4个垂直和水平交错的视图.我希望蓝色,红色和紫色的视图都是一样的subview.frame.size.width = superview.width - 60.蓝色和紫色在左列中排列,红色在右列中是单独的,并且所有间隙(两列之间以及每列之间和它的最近边缘)处于恒定(20点).这三个表有一个可变的高度,我将按照James的答案中的描述以编程方式设置.在底部是一个粉红色的视图,拉伸屏幕的宽度(减去间隙),并坐在紫色或红色视图下方的恒定20点,以较低者为准(我试图通过给它一个每个视图的间距约束> = 20,我希望它会为其中一个选择正好20个).由于所有高度都是动态的,并且可能不一定同时适合屏幕,因此我将他们的超级视图UIScrollView改为正常而不是正常UIView.

完成所有操作后,我仍然会收到警告,我的所有4个视图都是水平模糊的,并且粉红色条是垂直模糊的.我认为它很难实现应该接下来的东西,这就是为什么它认为它是横向模糊的.而且我认为不是选择将粉红色的条形物放置在紫色或红色视图下方20个点以下,这就是为什么它认为它是垂直模糊的.任何人都可以确认或否认这些怀疑吗？或建议一个方法呢？当我最后运行它时,我得到了这个(我将滚动视图的背景变为黄色,你在故事板截图中无法分辨):

Answer 1

垂直模糊

好吧,我想我已经解决了垂直模糊的部分.我在粉红色和紫色视图之间添加了两个垂直约束,在粉红色和红色视图之间添加了两个垂直约束.对于每对,第一个约束是它们之间的间距必须> 20 pts,并且它具有1000个优先级.第二个约束是间距= 20 pts,但它只有800优先级.

例如,如果紫色视图的底部最终低于红色视图的底部(就像在我的第一个屏幕截图中那样),Xcode应该尝试设置粉红色和红色视图之间的垂直距离= 20,但它将意识到与紫色和粉红色之间的空间> = 20的条件冲突.由于> =约束具有更高的优先级,因此=约束将被忽略.现在,当Xcode查看紫色和粉红色视图之间的间距= 20的约束时,它会根据约束检查粉红色和红色必须至少相隔20个.因为红色视图的底部高于紫色视图的底部,红色和粉红色之间的> = 20约束仍然通过.

所以TL; DR,您可以设置一个视图,使其在多个视图的最极端的给定值(x)处有一个间距,方法是给它一个> = x约束,优先级为1000,并给它一个<x约束,其中<1000您正在考虑的每个视图的优先级 - 我的垂直模糊问题已经解决.我还没有针对所有4个视图的水平模糊度的解决方案.

水平模糊

好的,我现在也修复了水平模糊的部分.它归结为滚动视图(以及表视图)中的约束与其他任何类型的视图的工作方式不同.这是一步一步的样子.

• 放置 UIScrollView
• 放置UIView到UIScrollView作为一个" contentView"为滚动视图
• 添加约束以固定contentView滚动视图的所有4个角width并将其固定height(因此在它contentView和它的超视图之间有6个约束- 比通常多2个).请注意,width和height可以固定到比正常屏幕大小更大的东西,这可能是你开始使用滚动视图的原因.
• 添加你想要的所有其他视图UIScrollView(UIButtons,UILabels等等 - 我只是假设UILabel从这里开始,所以我不必输入任何类型,但任何类型的UIView子类都可以工作)作为的子视图contentView,不直接作为的子视图UIScrollView

通过这种设置,UILabel对其超级视图赋予约束的s将约束到contentView具有已定义大小的s ,因此没有任何模糊.

或者,如果您想要修改UILabels 的大小(或根据应用程序的功能动态计算它们)并让contentView扩展来保存它们:

• 放置 UIScrollView
• 放置UIView到UIScrollView作为一个" contentView"为滚动视图
• 添加约束以固定contentView滚动视图的所有4个角width并将其固定height
• 为width约束创建一个出口contentView(比方说我们命名contentViewWidthConstraint)
• 放置UILabels
• 修复UILabels 的大小
• 为s 的width约束创建一个出口UILabel

然后在代码中 viewWillLayoutSubviews

• 加上所有UILabels 的宽度和它们之间的任何间隙(作为a CGFloat,我会称之为totalWidth)
• 组 contentViewWidthConstraint.constant = totalWidth

你很高兴去!请注意,我假设您在此示例的大部分内容中设置了宽度,但它应该适用于高度.

Answer 2

问题是两个视图的许多不同宽度将满足您设置的约束.这里有两个例子(我画了垂直堆叠的形状,以便更容易看到重叠示例):

您可以添加值为0的水平空间约束.