如何在运行时更改标签的限制? [英] How to change label constraints during runtime?

查看:133
本文介绍了如何在运行时更改标签的限制?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我有一个表视图和里面的单元格。该单元包含三个标签:标题标签和下面的一个两个标签彼此。有时候,我需要隐藏在下面,如果他们不包含数据这两个标签和更改前的空间容器,首标到中心Y以集装箱。当然,恢复的制约回来时,两个标签包含数据。这里的简单演示工程的屏幕截图只为展示理念是:

I have a table view and a cell inside it. The cell contains three labels: header label and two labels below one to each other. Sometimes, I need to hide those two labels below if they do not contain data and change "Top space to container" of "Header label" to "Center Y to container". And of course revert the constraints back when two labels contain data. Here's a screenshot of simple demo project just for showing the idea:

更新最大麦克劳德答案指向正确的方向。关键是要推标题标签下来的时候第一和第二标签被隐藏。因此,我们需要设置底部的空间容器鉴于第一和第二的标签,而不是为标题标签争创一流,空间容器视图。和隐藏/取消隐藏应具有高度的插座(高度约束的第一和第二个标签)和它们的常数值设置为零(和取消隐藏时设置回值)来完成。我还上传了源$ C ​​$ C为例,Github上

UPDATE Max MacLeod answer pointed to right direction. The trick is to push header label down when first and second labels are hidden. So we need to set bottom space to container view for first and second labels instead of creating top space to container view for header label. And hiding/unhiding should be done by having height outlets (height constraints for first and second label) and setting their constant values to zero (and setting back value when unhiding). I also uploaded the source code example to Github.

推荐答案

选择的标题标签,和下一个标签,并添加一个新的垂直空间的限制体现他们之间的差距。接下来,删除标题标签顶部空间容器的限制。也许你已经有这个(不能完全从屏幕上抓看的)。如果你这样做,这是很好的。

Select the header label, and one of the lower labels, and add a new vertical space constraint reflecting the gap between them. Next, remove the header label Top space to container constraint. Maybe you already have this (can't quite see from the screen grab). If you do, that's good.

现在,每个标签下创建两个高度限制。 IBOutlet中那些类。

Now, create two height constraints for each lower label. IBOutlet those to your class.

然后,掩盖这两个较低的标签时,你通过设置需要在每个高度约束的 0.f

Then, hide those two lower labels whenever you need to by setting each height constraint's constant to 0.f.

这将使其不可见,降低上述标题标签,以便它现在垂直于容器中心ý

That will render them invisible and lower the header label above so that it is now vertically centered Y in the container.

会经过的步骤一次(的是太长评论!的)。与IB序列事项首先,你必须添加一个新的约束,才能删除旧的。暂时你也有一个多余的约束。这是因为IB不会让模棱两可。因此,首先添加新的垂直空间的限制。这将定义标签上的Y位置。然后,从上部标签去除多余垂直空间到容器约束。现在,标签将ý使用相对于下标签的垂直空间位置。接下来,添加的高度约束与一个IBOutlet每降低标签和链接的类。还有一件事,其实你将需要较低的标签被约束到容器底部空间限制。当他们的高度减少到零,它们就会消失,并且上标将移动低级假定在Y中心位置

Will go through the steps once more (was too long for a comment!). Sequence matters with IB as first you must add a new constraint before you can delete the old one. Temporarily you will have one superfluous constraint. It's because IB won't allow ambiguity. So, first add the new vertical space constraint. That will define the Y position of the upper label. Then, remove the superfluous vertical space to container constraint from the upper label. Now that label will be Y positioned using the vertical space relative to the lower labels. Next, add the height constraints for each lower label and link to the class with an IBOutlet. One other thing, actually you will need the lower labels to be constrained to the container with a bottom space constraint. When their height is reduced to zero, they will disappear, and the upper label will move lower to assume the Y center position.

要恢复,只需设置回原来的值。

To revert, just set the constant back to the original value.

这是不是添加/删除约束,这是一个重量级操作的更好的方法。请注意,您可能希望将两个较低的标签添加到一个容器的看法,让他们可以显示/隐藏为一体。此外,它会拾掇了code,你真正想要的垂直空间是你的上的标签之间,并且双双走低的标签,而不是只有一个。

This is a much better approach than adding/removing constraints, which is a heavyweight operation. Note that you may wish to add the two lower labels to a "container" view, so that they can be shown/hidden as one. Also, it would tidy the code as you really want the vertical space to be between your upper label, and both lower labels rather than just one.

另请参阅我的答案<一个href=\"http://stackoverflow.com/questions/19561269/autolayout-with-hidden-uiviews/19586924#19586924\">AutoLayout隐藏UIViews?

这篇关于如何在运行时更改标签的限制?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆