如何在 Storyboard 中使用 UIScrollView [英] How to use UIScrollView in Storyboard

问题描述

我有一个包含 1000 像素高内容的滚动视图，并且希望能够将其布局以便在情节提要上进行简单的设计.
我知道它可以通过编程方式完成，但我真的希望能够直观地看到它.每次我在视图控制器上放置滚动视图时，它都不会滚动.是否有可能让它像我想要的那样工作，或者我必须在代码中做到这一点?

I have a scroll view with content that is 1000px tall and would like to be able to lay it out for easy design on the storyboard.
I know it can be done programmatically but I really want to be able to see it visually. Every time I put a scroll view on a view controller it won't scroll. Is it possible to get it to work like I want or do I have to do it in the code?

推荐答案

我正在回答我自己的问题，因为我只花了 2 个小时才找到解决方案，而 StackOverflow 允许这种 QA 风格.

I'm answering my own question because I just spent 2 hours to find the solution and StackOverflow allows this QA style.

这里从头到尾是如何让它在故事板中工作.

Start to finish here is how to make it work in storyboard.

1:转到您的视图控制器并单击Attribute Inspector.

1: go to you view controller and click on Attribute Inspector.

2:将大小更改为 Freeform 而不是 Inferred.

2: change Size to Freeform instead of Inferred.

3:转到故事板上的主视图，而不是滚动视图，而是顶级视图.

3: Go to the main view on that storyboard, not your scrollview but rather the top level view.

4:点击Size Inspector 并将此视图设置为您想要的大小.我把身高改成了 1000.

4: Click Size Inspector and set this view to your desired size. I changed my height to 1000.

现在你会看到你的故事板有你的视图设置，所以你可以看到滚动的整个高度，以便于设计.

Now you will see that you storyboard has your view setup so you can see the entire height of your scroll for easy design.

5:放置在滚动视图上并拉伸它，使其占据整个视图.您现在应该有一个大小为 320,1000 的滚动视图位于视图控制器中的视图上.

5: Drop on a scrollview and stretch it so it takes up the whole view. You should now have a scrollview with size of 320,1000 sitting on a view in your view controller.

现在我们需要让它滚动并需要让它正确显示内容.

Now we need to make it scroll and need to make it show content correctly.

6:点击你的滚动视图并点击Identity Inspector.

6: Click on your scrollview and click on Identity Inspector.

7:添加一个用户定义的运行时属性，KeyPath 为contentSize，然后输入SIZE 并输入您的内容大小.对我来说是 (320, 1000).

7: Add a User Defined runtime attribute with KeyPath of contentSize then type of SIZE and put in your content size. For me it is (320, 1000).

因为我们想在故事板上看到我们的整个滚动视图，所以我们拉伸了它，它有一个 320,1000 的框架，但为了让它在我们的应用程序中工作，我们需要将框架更改为可见的滚动视图

Since we want to see our whole scroll view on the storyboard we stretched it and it has a frame of 320,1000 but in order for this to work in our app we need to change the frame down to what the visible scrollview will be.

8: 添加一个 runtime 属性 和 KeyPath frame 类型为 RECT 和 0,0,320,416.

8: Add a runtime attribute with KeyPath frame with Type RECT and 0,0,320,416.

现在，当我们运行我们的应用程序时，我们将有一个可见的滚动视图，其框架为 0,0,320, 416 并且可以向下滚动到 1000.我们可以按照我们想要的方式在 Storyboard 中布局我们的子视图和图像等等出现.然后我们的运行时属性确保正确显示它.所有这一切都没有 1 行代码.

Now when we run our app we will have a visible scrollview has a frame of 0,0,320, 416 and can scroll down to 1000. We are able to layout our subviews and images and whatnot in Storyboard just the way we want them to appear. Then our runtime attributes make sure to display it properly. All of this without 1 line of code.

这篇关于如何在 Storyboard 中使用 UIScrollView的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！