代码之家  ›  专栏  ›  技术社区  ›  George Armhold

如何在界面生成器中使用uiscrollview?

  •  94
  • George Armhold  · 技术社区  · 15 年前

    当我使用 UIScrollView 在过去,通过编程方式成功地操作它,我很难通过在接口生成器中专门设置它来让它工作。

    我的iPhone应用程序中有一个简单的“关于”页面。它有一个 UITextView ,一些图标和指向其他应用程序的链接。我已将所有这些视图添加到 UISCLVIEW ,使它们的总大小为480。当我启动我的应用程序时,滚动视图只显示适合屏幕的内容,没有滚动。

    是否可以完全通过ib来实现这一点,或者必须通过代码来操纵ContentSize?

    17 回复  |  直到 15 年前
        1
  •  130
  •   Stefan Arentz    15 年前

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

        2
  •  113
  •   Herr Grumps    12 年前

    Boby_u Wan的回答让我思考了一下,我找到了以下解决方案来从Interface Builder配置uiscrollView的ContentSize:

    1. 选择 UIScrollView 在故事板场景中
    2. 身份检查员 创建一个新的 用户定义的运行时属性 (单击+按钮)
    3. 更改属性 关键路径 contentSize
    4. 更改属性 类型 Size
    5. 现在设置 价值 到{ 所需内容宽度 , 所需内容高度 }

    例如,将值设置为320、920将允许用户在iPhone上向下滚动整个额外屏幕。

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

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

    非法配置:
    大小类型用户定义的运行时属性,xcode版本早于4.3
    主存储板。故事板

    如果您也遇到此错误,则很容易修复:在 项目导航器 然后提出 文件检查员 . 查找/扩展 接口生成器文档 还有一个下拉列表 发展 . 确保设置为 Xcode 4.3

        3
  •  24
  •   Danyal Aytekin    11 年前

    使用自动布局(ios6+),可以避免设置 contentSize . 改为设置以下约束:

    1. 将滚动视图的顶部固定到其最上面的子级的顶部。
    2. 把底部固定在最底部的孩子。
        4
  •  18
  •   Anton Banchev    12 年前

    您可以只使用Interface Builder,转到Identity Inspector(第三个Inspector选项卡)并添加 新建用户定义的运行时 属性与

    • 关键路径: 内容大小
    • Type: 尺寸
    • 价值观: {宽度,高度}
        5
  •  14
  •   RoberRM    9 年前

    现在有一种方法 UIScrollView 滚动而不离开 故事板 :

    1. 选择 UISCLVIEW 在故事板中,转到 尺寸 检查员 并且改变 底部 价值(或任何其他价值) 你需要改变)在 内容嵌入 内容区域的高度。
    2. 现在去 身份检查员 并创建一个新的 用户定义的运行时属性 (单击+按钮)并命名 contentSize . 什么都不重要 类型 价值 您填写(甚至可以保留其默认值)。

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

        6
  •  4
  •   unsynchronized    12 年前

    我过去使用的一种方法是在InterfaceBuilder中将ScrollView从包含视图中拖出,并将其实际大小设置为ContentSize所希望的大小。

    关于Interface Builder,本质上不明显的是,您可以拥有存储在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];
    

    最后,如果您在InterfaceBuilder中“丢失”了滚动视图(可以关闭它,这样它就从设计网格中消失了),不要惊慌。只需在设计网格左侧的对象列表中单击它。

        7
  •  4
  •   Robert Wasmann    12 年前

    在使用自动布局的Xcode4.5中,我的尺寸检查器中没有内容插入部分。所以我必须在用户定义的运行时属性下添加它,然后它工作得很好。

    您在“用户定义的运行时属性”中添加的是keypath==contentinset,它的类型为“rect”(uiedgeinset,其输入与rect相同),并定义为top、left、bottom、right。ContentSize仅定义ScrollView窗口的区域。ContentInset定义可滚动区域。

    我希望这能帮助处于同样情况的人。

        8
  •  4
  •   Pat Niemeyer    7 年前

    上述许多答案都是误导性的或过时的。截至2017年(可能更早)界面生成器 支持自动调整内容大小的滚动视图。诀窍在于Xcode为滚动视图和其中内容之间的约束赋予了一种特殊的、非标准的含义。这些“向内”的限制将 实际上会像您所期望的那样影响内容的大小。

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

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

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

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

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

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

        9
  •  2
  •   oliland    11 年前

    如果在Interface Builder中单击任何视图控制器的属性图标,可以在模拟度量中将其设置为“自由形式”大小,并将主视图的大小更改为所需的内容大小。

    这样,您就可以像创建一个大视图一样创建滚动视图的内容。因为它只是一个模拟的度量,所以当加载视图控制器时,它将被调整到窗口的边界。

        10
  •  2
  •   Free Mason    11 年前

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

    1. 选择uiviewcontroller的xib文件。在界面生成器的“标识检查器”中,将uiview更改为类类型uiscrollview。

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

    3. 在“属性检查器”下,将大小更改为任意形状。然后,您可以手动拉伸滚动视图,也可以在“大小检查器”下指定自定义的宽度和高度。

    4. 在“标识检查器”中,添加一个名为“大小”类型的“contentSize”的新用户定义的运行时属性,并将其更改为320、1000等值。您不能再以编程方式设置此项,因此需要执行此步骤,以便滚动视图知道滚动视图的内容比窗口大。

        11
  •  2
  •   Aldrin Equila    10 年前

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

    scrollviewName.contentSize = CGSizeMake(0, 650);
    

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

        12
  •  1
  •   Community PPrice    7 年前

    对, st3fan 是正确的,必须设置UIScrollView的ContentSize属性。 但是您不应该为此关闭自动布局。 您可以轻松设置uiscrollview的contentsize,只在ib中自动布局,不需要任何代码。

    重要的是要理解,当使用uiscrollview的autolayout contentSize时,它不是直接设置的,而是根据uiscrollview的所有子视图的约束进行计算的。您所需要的就是为两个方向的子视图提供适当的约束。

    例如,如果只有一个子视图,则可以将其高度和空间从顶部和底部设置为SuperView(在我们的示例中是ScrollView),ContentSize.Height计算为Sum。

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

    ContentSize.Width的计算方法与水平约束类似。

    如果约束太少,无法正确计算ContentSize,则在“视图控制器”场景项附近会显示一个红色的小按钮,以通知布局模糊性。

    如果有许多子视图,那么它可能是约束的“链”:从上到上的子视图,子视图和从下到下的子视图之间的高度和空间,就像 Danyal Aytekin 回答。

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

    若要使ScrollView可滚动,计算的ContentSize必须大于ScrollView大小。

        13
  •  1
  •   Eugene Braginets    9 年前

    您可以在故事板中使用带自动布局的uiscrollview。 基本上你需要的是:

    1. 添加uiscrollview
    2. 添加所有约束(如从上、左、右、下边缘插入)
    3. 将“容器”uiview添加到uiscrollview
    4. 如果只需要一个方向滚动(比如垂直滚动): 显式设置高度(例如,600),并将链接宽度设置为uiscrollview的宽度。
    5. 如果你想要双向滚动,只需设置宽度和高度。

    storyboard setup

        14
  •  0
  •   Community PPrice    7 年前

    这里有一个设计滚动视图的解决方案,它的内容比屏幕大,完全在故事板中(好吧,几乎完全是这样,您还需要添加1行代码)

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

        15
  •  0
  •   Agas    11 年前

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

    1:缩放滚动视图的大小以包含其中的所有UI。

    2:添加滚动视图的IBoutlet。

    3:在VIEWDIDLOAD中,保存滚动视图的frame.size。
    (例如,_scrollsize=_scrollview.frame.size;)

    4:在viewwill中,按之前保存的cgSize设置ContentSize。
    (例如,“ScrollView.ContentSize=”ScrollSize;)

    5:完成了~

        16
  •  0
  •   Alexander Dariia Prokopovych    8 年前
    1. 添加uiviewcontroller
    2. 在uiviewController的“属性检查器”->模拟度量“设置大小自由格式”
    3. 在uiviewController的“大小检查器->视图控制器”中设置高度800
    4. 在uiviewcontroller中添加uiscrollview
    5. 将所有约束添加到uiscrollview(上、左、右、下)并添加对齐x=中心
    6. 在uiscrollview中添加uiview
    7. 将所有约束添加到uiview(顶部、左侧、右侧、底部),并添加对齐X=中心。是,与3中的uiscrollview相同,但对于uiview
    8. 将高度约束添加到uiview。例如780

    Storyboard

        17
  •  0
  •   Dilraj Singh    6 年前

    新建Xcode项目

    导航到main.storyboard文件

    从对象库中选择滚动视图。

    设置滚动视图的框架。

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

    现在要动态设置其高度和宽度,您可以 Configure A UIScrollView Using Auto Layout In XIB