【问题标题】:Dynamic Height UILabel inside a UIScrollViewUIScrollView 中的动态高度 UILabel
【发布时间】:2017-10-26 18:16:53
【问题描述】:

我已经尝试了 3 天来实现这个设计,但我尝试的一切都失败了。

这是我的布局。

  • 蓝色部分是一个 UIScrollView 与 0 0 0 0 约束到主 看法。
  • 嵌套在 UIScrollView 中的是一个 UIView,它拥有我所有的 内容,对 UIScrollView 也有 0 0 0 0 约束。我也 使 UIView 的宽度等于 UIScrollView 的宽度。
  • 然后我从上到下添加元素。图片很简单,距离内容视图的上边距 10,宽度和高度固定,在容器中水平居中。
  • 个人资料名称标签与图片相同,但高度固定。
  • 包含 3 个标签和 2 个动态高度标签的 UIView。我给了 UIView 顶部、左侧和右侧约束,并在底部设置了左侧,以便动态高度标签能够在需要时推动视图的高度。 UILabel 设置了 0 行。
  • 第二个 UIView,内部每个标签的 0 0 0 0 和 5 5 5 5 个约束
  • UIView 内的 UITableView,视图有固定高度,表格也是 0 0 0 0。
  • 按钮 5 上,5 左,5 右。然后,我使容器 UIView(其中包含所有这些项目)与按钮的底部边缘对齐,如本文的最佳答案所示:UIView with dynamic height multiple UILabel

我还使用这个视频作为如何实现 UIScrollView 的参考,因为这是我第一次。 https://www.youtube.com/watch?v=VE6DQGy4iS8

我不允许使用 UIStackView,因为我们的目标是 iOS 8。

我现在遇到的两个明显问题是:

  1. 当我运行应用程序时,滚动不起作用。
  2. 我在情节提要中得到的唯一警告是:

【问题讨论】:

  • 我会确保您的所有 uiview 都受到顶部和底部引脚或一个或另一个以及固定高度的适当约束。具体来说,您应该能够将包含动态标签的 UIView 的底部固定到下一个 UIView 的顶部,以在两者之间保持固定间距,同时仍允许动态高度。
  • 我有你说的那些观点。究竟是什么决定了滚动视图的高度?
  • 所以你有你的第一个 UIView 直接在你的滚动视图下面,它是固定的 0,0,0,0。里面就是你所有的内容,所以一旦你添加了所有适当的约束以确保所有东西都有它的宽度/高度,如果它里面的内容增长(通过你的动态高度),你的父 UIView 实际上会扩大大小标签),这反过来会增加你的 UIScrollView 的 contentView 大小。最重要的是你的内容限制是正确的,你应该一切顺利。

标签: ios uiscrollview uistoryboard nslayoutconstraint


【解决方案1】:

好的,最后我设法做到了。

我所做的是将具有动态 UILabel 的 UIView 固定在顶部、右侧和左侧。 对于它的高度,我控制从它拖到它自身内部的最后一个项目上,这是照片中的第二个动态高度 UILabel。我控制拖动并设置 UIView 并使用具有动态高度的 UILabel 选择“Bottom Spacing to Container”。这样,UILabel 控制 UIView 的最终高度,UIScrollView 需要它来计算自己的高度。

粗略的每个 UILabel 元素都被固定在右上角,这使得它们都是动态的。

您对以下 UIView 的处理方式(无论您是想给它们一个静态高度还是动态)是您的选择。

至于底部的 UIButton,我对它做了同样的事情。我将控件从包含 UIView(嵌套在 UIScrollView 内并包含此处的所有内容)拖动到 UIButton,我选择了“Bottom Spacing to Container”并将其设置为 5。这将允许包含视图调整其高度取决于UIButton 的位置取决于当动态标签推动其视图的高度并反过来推动 UIButton 时它移动的距离(如果有任何意义)。

简而言之,在典型场景中,您通常将视图中的最后一个元素固定到包含视图的左下角和右下角。但是,为了允许动态更改,您需要反转约束的 2 项。

我希望这很有用。

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2013-12-19
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多