使用自动布局调整 xib 元素的宽度

Posted

技术标签:

【中文标题】使用自动布局调整 xib 元素的宽度【英文标题】:Adjust the width of an xib element using autolayout 【发布时间】:2014-06-17 07:47:52 【问题描述】:

我正在尝试学习自动布局。以下是我尝试使用 autolayout 实现的简单 UIView 元素。约束被添加到 xib 中。在纵向模式下一切正常,但在横向模式下,蓝色项目被挤压。

    如何让这个蓝色项目在横向模式下有更多的高度空间。 我们如何在口粮(30:70)或(40:60)中制作蓝色项目和绿色项目的宽度

我是否必须在运行时创建约束出口并定义值。

【问题讨论】:

也许您需要将内容压缩阻力设置为蓝色视图的“必需”。 @Zhang 我试过了。不用找了 。所有都是 xib 中的彩色元素,现在只是 UIView 【参考方案1】:

您已为红色块、棕色块、它们之间的距离以及蓝色和红色块与容器之间的距离设置了固定高度。除了压扁蓝色块,别无选择。

你想发生什么?棕色块应该变短吗?应该红块吗?然后你应该删除高度限制。也许您可以将棕色和蓝色块设置为具有相同的高度。

我不完全确定您在第二个问题中的意思。如果您希望绿色块宽度与蓝色块宽度的比率为 70:30,则设置相等宽度的约束,然后编辑乘数。例如,蓝色宽度等于绿色宽度 * 3/7。您实际上可以在 IB 中使用比率语法 (70:30) 设置乘数。

【讨论】:

谢谢肯。第三点效果很好(比率关系)。关于棕色块和蓝色块,我想要的是,在横向模式下,我需要它们具有相等的宽度或某个比例。 这种情况下乘数和常数的作用是什么 我假设您的意思是高度,而不是宽度。好的,所以以您喜欢的任何比例在两个高度之间设置一个约束。您将必须删除在棕色块上设置固定高度的约束。您将需要约束以保持红色块和棕色块之间的间距不变,同样,棕色块和蓝色块之间的间距也必须保持不变。 (从你的截图很难看出。你可能已经有了。) 谢谢肯。我很高兴发现有人对自动布局有很好的了解

以上是关于使用自动布局调整 xib 元素的宽度的主要内容,如果未能解决你的问题,请参考以下文章

使用自动布局调整子视图的大小

如何使用 xib 文件自动布局宽度自定义 UITableViewCell

从 Xib 加载视图在自动布局后调整框架子视图的大小

我们可以将具有自动布局的 XIB 加载为以编程方式创建的没有自动布局的视图的子视图,并使用父视图调整子视图的大小吗?

自动调整 iPhone xib 应用程序到 ipad 的大小

如何响应 React 中自动调整大小的 DOM 元素的宽度?