95

虽然我UIScrollView过去通过以编程方式操作它成功地使用它,但我无法通过在 Interface Builder 中专门设置它来使其工作。

我的 iPhone 应用程序中有一个简单的“关于”页面。它有一个UITextView、一些图标和指向我的其他应用程序的链接。我已将所有这些视图添加到我的UIScrollView中,并对其进行排列以使它们的总大小 > 480。当我启动我的应用程序时,滚动视图仅显示适合屏幕的内容,并且没有任何滚动。

是否可以完全通过 IB 做到这一点,或者我必须通过代码操作 contentSize?

4

18 回答 18

130

您忘记设置 UIScrollView 的 contentSize 属性。奇怪的是,您不能从 Interface Builder 执行此操作。您必须从管理此滚动视图的视图控制器中执行此操作。

于 2009-07-16T02:50:02.417 回答
113

Boby_Wan 的回答让我开始思考,我找到了以下解决方案来从 Interface Builder 配置 UIScrollView 的 contentSize:

  1. UIScrollView在 Storyboard 场景中选择
  2. 转到身份检查器,创建一个新的用户定义的运行时属性(单击 + 按钮)
  3. 将属性Key Path更改为contentSize
  4. 将属性类型更改为Size
  5. 现在将设置为 {所需内容宽度,所需内容高度}

例如,将值设置为 {320, 920} 将使用户在 iPhone 上向下滚动一个额外的屏幕。

(我使用的是 xcode 4.3.3,项目的iOS 部署目标是 5.1)

当我第一次这样做时,我收到以下错误:

非法配置:
     大小类型用户定义的运行时属性与 4.3
     MainStoryboard.storyboard之前的 Xcode 版本

如果您也遇到此错误,修复起来很简单:在Project Navigator中选择 Storyboard ,然后打开File inspector。查找/展开Interface Builder Document部分,有一个Development下拉菜单。确保将其设置为Xcode 4.3

于 2012-06-28T06:26:52.293 回答
25

使用 Autolayout (iOS6+),您可以避免设置contentSize. 改为设置以下约束:

  1. 将滚动视图的顶部固定到其最顶层子项的顶部。
  2. 并将底部固定到其最底部的孩子的底部。
于 2013-04-18T22:26:51.057 回答
18

您可以仅使用 Interface Builder 执行此操作,转到 Identity Inspector(第三个检查器选项卡)并添加一个新的用户定义的运行时属性

  • 关键路径: contentSize
  • 类型: 尺寸
  • 值: {宽度,高度}
于 2012-09-21T09:21:52.010 回答
14

现在有一种方法可以在UIScrollView不离开Storyboard的情况下制作卷轴:

  1. 在 Storyboard 中选择UIScrollView,转到Size 检查器并将Content Insets部分中的Bottom值(或您需要更改的任何其他值)更改为内容区域的高度。
  2. 现在转到身份检查器并创建一个新的用户定义的运行时属性(通过单击 + 按钮)并将其命名为contentSize。填写什么类型都没有关系(您甚至可以保留它们的默认值)。

这将使UIScrollView工作正常,虽然我不知道为什么需要第二步(我偶然发现)。:(

于 2012-01-27T17:04:16.040 回答
4

在使用 Autolayout 的 Xcode 4.5 中,我的尺寸检查器中没有 Content Insets 部分。所以我不得不在用户定义的运行时属性下添加它,然后它就可以正常工作了。

您在“用户定义的运行时属性”中添加的是 keyPath == contentInset,它的类型为“Rect”(UIEdgeInsets,与 Rect 具有相同的输入)并定义为 {top, left},{bottom, right}。contentSize 仅定义滚动视图窗口的区域。contentInset 定义可滚动区域。

我希望这对处于相同情况的人有所帮助。

于 2013-01-16T22:01:03.297 回答
4

我过去使用的一种方法是将滚动视图从界面构建器中的包含视图中拖出,并将其实际大小设置为所需的 contentSize。

界面生成器本质上并不明显的是,您可以将未关联的视图存储在 nib 中,但不是 nib 主要用于的主视图的一部分。

在您希望滚动视图存在的视图中,放置一个简单的 UIView,用作占位符。(这只是为了让您可以直观地设计它的位置。如果您只是使用整个视图,则可以跳过此步骤并使用我在此答案末尾提供的第二个代码片段)。

然后,您可以使用控件填充滚动视图,以可视方式将其布置成您想要的样子。在视图控制器中提供占位符和滚动视图属性,以便您在运行时访问它们。

在运行时,在 - (void)viewDidLoad

scrollView.contentSize = scrollView.frame.size;
scrollView.frame = placeholder.frame;
[placeholder.superview addSubView:scrollView];
[placeholder removeFromSuperview];

或者(如果您没有使用占位符):

CGRect f = self.view.frame;
scrollView.contentSize = f.size;
f.origin.x = 0;
f.origin.y = 0;
scrollView.frame = f;
[self.view addSubView:scrollView];

最后,如果您在界面生成器中“丢失”滚动视图(可以将其关闭,使其从设计网格中消失),请不要惊慌。只需在设计网格左侧的对象列表中单击它。

于 2012-08-14T11:17:06.830 回答
4

上面的许多答案都具有误导性或已过时。截至 2017 年(可能更早),界面构建器确实支持具有自动调整大小的内容的滚动视图。诀窍在于 XCode 为滚动视图和其中的内容之间的约束赋予了特殊的、非标准的含义。这些“向内”约束实际上不会像您预期的那样影响内容的大小。

这意味着您可以例如将滚动视图以零边距固定到主视图的底部,也可以将滚动视图的内容以零边距固定到滚动视图的底部,但内容实际上不会被拉伸。相反,内容将获得其自行确定的大小(更多内容见下文),这也将是滚动视图中可滚动区域的大小。

可以这样想 - 绑定约束到滚动视图存在不对称性:从滚动视图到“外部”(父)世界的约束像往常一样确定滚动视图的大小和位置。但是滚动视图“内部”的约束实际上是通过将滚动视图绑定到内容来设置滚动视图的可滚动区域的大小和位置。

这完全不明显,因为当您设置约束时,XCode 将始终建议当前间距,并且您可能永远不会故意以冲突的方式更改向内和向外的约束。但是您可以,它们具有上述含义:一个控制滚动视图布局,一个控制可滚动内容区域的大小。

我偶然发现了这一点,然后看到它似乎是如何工作的,我看到这篇文章完全解释了它,并为此引用了 Apple 文档源:

https://spin.atomicobject.com/2014/03/05/uiscrollview-autolayout-ios/

最后一条关键信息,关于内容的自行确定大小:您可能会觉得您在这里处于 catch-22 中,因为您通常将内容调整为例如父视图的宽度,但在这种情况下,父视图是滚动视图和如上所述 - 约束不会影响您的内容大小。这里的答案是要记住,您可以将项目限制在视图层次结构中不直接相邻的项目:例如,您可以将内容视图的宽度设置为主视图的宽度,而不是徒劳地尝试让滚动视图去做为你。

于 2017-07-24T18:36:22.863 回答
2

只需删除滚动视图上的自动布局。那么代码就这么简单:

scrollviewName.contentSize = CGSizeMake(0, 650);

只需在 .h 文件上创建一个 iboulet 属性,然后在 .m 文件上合成。确保启用滚动。

于 2014-07-21T05:56:45.987 回答
2

通过 Interface Builder 设置 UIScrollView 并不直观。这是我的设置清单:

  1. 选择 UIViewController 的 XIB 文件。在界面构建器的“Identity Inspector”中,将 UIView 更改为类类型 UIScrollView

  2. 在“文件检查器”下,取消选中自动布局

  3. 在“属性检查器”下,将大小更改为自由形式。然后,您可以手动拉伸 Scroll View,也可以在“Size Inspector”下指定自定义宽度和高度。

  4. 在“Identity Inspector”中,添加一个名为“contentSize”的新用户定义运行时属性,类型为“Size”,并将其更改为类似 {320, 1000} 的值。您不能再以编程方式设置它,因此需要此步骤以便 Scroll View 知道 Scroll View 的内容大于窗口。

于 2013-08-31T01:23:33.767 回答
2

如果您在 Interface Builder 中单击任何 View Controller 的 Properties 图标,您可以在 Simulated Metrics 中将其设置为“自由格式”大小,并将主 View 的大小更改为您想要的内容大小。

这样您就可以像创建一个大视图一样创建 ScrollView 的内容。由于它只是一个模拟指标,您的视图控制器将在加载时调整到窗口的边界。

于 2013-07-29T16:50:16.870 回答
1

您可以在 StoryBoard 中使用带有自动布局的 UIScrollView。基本上你需要的是:

  1. 添加 UIScrollView
  2. 向其添加所有约束(如顶部、左侧、右侧、底部边缘的插图)
  3. 将“容器”UIView 添加到 UIScrollView
  4. 如果您只想单向滚动(例如,垂直):显式设置高度(例如,600)并将宽度链接到 UIScrollView 的宽度。
  5. 如果你想要双向滚动,只需设置宽度和高度。

故事板设置

于 2015-03-31T09:21:15.273 回答
1

是的,st3fan是对的,UIScrollView 的 contentSize 属性必须设置。但是您不应该为此目的关闭自动布局。您可以仅在 IB 中使用自动布局轻松设置 UIScrollView 的 contentSize,无需任何代码。

需要注意的是,在使用自动布局时 UIScrollView 的 contentSize 不是直接设置的,它是根据 UIScrollView 的所有子视图的约束来计算的。您所需要的只是为两个方向的子视图提供适当的约束。

例如,如果您只有一个子视图,您可以将其高度和空间从顶部和底部设置为超级视图(即我们的例子中的滚动视图) contentSize.height 计算为 sum

Vertical Space (aSubview.top to Superview.top) + aSubview.height + Vertical Space (aSubview.top to Superview.top)

contentSize.width 的计算方式与水平约束类似。

如果限制太少而无法正确计算 contentSize,则在 View Controller Scene 项附近显示红色小按钮,以告知布局歧义。

如果有很多子视图,那么它可能是约束的“链”:从顶部到顶部的子视图、子视图之间的高度和空间以及从底部到底部的子视图,就像在Danyal Aytekin的回答中一样。

但在实践中,在大多数情况下,只需添加一个具有所需大小的空视图并将 scrollView 的顶部、左侧、底部、右侧的空间设置为 0 会更方便。 您可以将此视图用作“内容视图”,即放置所有其他子视图或者如果您已经有很多子视图并且不想移动它们并再次设置布局,您可以将此辅助视图添加到现有子视图并使其隐藏。

要使 scrollView 可滚动计算 contentSize 必须大于 scrollView 大小。

于 2015-02-18T14:57:04.177 回答
0

我找到了一个更方便的方法。

1:缩放滚动视图的大小以包含其中的所有用户界面。

2:添加一个iboutlet的滚动视图。

3:在viewDidLoad中,保存滚动视图的frame.size。
(eg _scrollSize = _scrollView.frame.size;)

4:在viewWillAppear中,通过之前保存的CGSize设置contentSize。
(例如_scrollView.contentSize = _scrollSize;)

5:完成~

于 2014-01-08T08:50:38.080 回答
0

这是设计 ScrollView 的解决方案,其内容完全在 Storyboard 中大于屏幕(嗯,几乎完全,您还需要添加 1 行代码)

https://stackoverflow.com/a/19476991/1869369

于 2013-10-22T10:47:44.160 回答
0

您可以完全在 Interface Builder 中完成,而无需在代码中设置“contentSize”属性。

  1. 在滚动视图中只放置一个视图。滚动视图应该只有这个子视图。您可以将其命名为内容视图。稍后将所有内容放入此 View 中。
  2. 将此视图的四个边缘与滚动视图(视图的父视图)对齐,并用零对齐。
  3. 设置此视图的宽度和高度。宽度和高度将被隐式视为滚动视图的“contentSize”。

简单来说,这个View的宽高定义了Scroll View的“contentSize”。因为这个 View 是 Scroll View 的唯一内容,所以这个 View 的大小就是 Scroll View 的内容大小。这是相当合理的。

我是从本教程中学到的: https ://riptutorial.com/ios/example/12812/scrolling-content-with-auto-layout-enabled

于 2022-01-22T15:25:01.297 回答
0
  1. 添加 UIViewController
  2. 在 UIViewController 'Attribute Inspector -> Simulated Metrics' 中设置大小 Freeform
  3. 在 UIViewController 'Size Inspector -> View Controller' 中设置高度 800
  4. 在 UIViewController 中添加 UIScrollView
  5. 将所有约束添加到 UIScrollView(上、左、右、下)并添加对齐 X = 中心
  6. 在 UIScrollView 中添加 UIView
  7. 将所有约束添加到 UIView(上、左、右、下)并添加对齐 X = center。是的,与#3 中的 UIScrollView 相同,但对于 UIView
  8. 向 UIView 添加高度约束。例如 780

故事板

于 2016-11-21T13:48:31.760 回答
0

创建一个新的 Xcode 项目

导航到 Main.storyboard 文件

从对象库中选择 ScrollView。

为 ScrollView 设置框架。

在滚动视图中添加另一个视图,并保持与 ScrollView 相同的框架。

现在要动态设置它的高度和宽度,您可以在 XIB 中使用自动布局配置 UIScrollView

于 2018-02-27T11:51:51.767 回答