Swift UIScrollView - 仅针对垂直滚动的正确实现

Question

事先,我道歉,因为我会说我是iOS编程的初学者.

我想使用,UIScrollView因为要显示的内容超出了屏幕的高度.因此,我只想垂直滚动而不是水平滚动.

我正在使用故事板来绘制视图AutoLayout.

下面的是我的截图UIViewController与UIScrollView:

然后我将Label更改为这样的大文本

override func viewDidLoad() {
    super.viewDidLoad()

    self.label1Label.text = "Seize jours après la chute du président Blaise Compaoré, le Burkina Faso a un nouveau chef d'EtatA l'issue d'ultimes tractions, civils et militaires se sont accordés, lundi 17 novembre, sur le nom du diplomate Michel KafandoSeize jours après la chute du président Blaise Compaoré, le Burkina Faso a un nouveau chef d'EtatA l'issue d'ultimes tractions, civils et militaires se sont accordés, lundi 17 novembre, sur le nom du diplomate Michel Kafando"
    self.label1Label.numberOfLines = 0
    self.label1Label.sizeToFit()

我的问题是,如果我没有手动设置我的contentView(在里面UIScrollView)的宽度,滚动是水平的,而不是垂直的.(看下面的截图):

我已经尝试设置contentSize,就像我在许多谷歌帖子中看到的那样但没有成功:

self.scrollView.contentSize = CGSizeMake(400.0, 600.0)

如果我为我的contentview(i.e : 320pts)手动设置宽度,则滚动将是垂直的(GOOD),但是根据iphone的大小,它将不会覆盖整个屏幕宽度,如下面的屏幕截图所示:

现在的问题是:什么是正确的实现使用UIScrollView有一个contentView尊重的自动布局约束(full screen : 0top - 0bottom - 0left - 0right),并滚动到只有垂直.

非常感谢你的帮助!

Answer 1

Mike Woelmer演示了如何在Atomic Object博客上使用Interface Builder正确执行此操作.

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

我在github上也只有自己的代码(没有故事板实现).

https://github.com/nadthevlad/AutolayotScrollview

您不希望设置内容或视图的高度或宽度.相反,您希望使用Autolayouts引脚和约束来设置scrollview的行为方式.

1. 创建您的UIScrollView*scrollView.

2. 您想要创建一个UIView*contentView,您将其余的视图元素放入其中.

   [self.view addSubview:scrollView];
   [scrollView addSubview:contentView];
   [contentView addSubview:_label1];
   [contentView addSubview:_label2];
   [contentView addSubview:_label3];
   [contentView addSubview:_label4];
   [contentView addSubview:_label5];
   [contentView addSubview:_label6];
   

3. 将scrollView的4个边缘固定到self.view的4个边缘

4. 将contentView的顶部和底部边缘固定到scrollView的顶部和底部.

5. 这是棘手的部分.要设置水平大小调整,您希望将contentView的前(右)和后(左)边固定到前端和后端self.view而不是scrollView.尽管contenView是scrollView的子视图,但它的水平约束将到达scrollView之外并连接到self.view.

6. 像往常一样将任何其他视图元素固定到contentView.

Answer 2

允许UIScrollView仅向一个方向滚动的技巧是使受限维度的UIScrollView的内容大小与同一维度中UIScrollView框架的大小相同.所以在这种情况下,scrollview.contentSize.width应该是平等的scrollview.frame.size.width.

考虑到这一点,请尝试以下方法:

1. 确保以与本答案中描述的相同方式设置约束

2. 将以下代码添加到视图控制器:

   override func viewWillLayoutSubviews()
   {
       super.viewWillLayoutSubviews();
       self.scrollView.contentSize.height = 3000; // Or whatever you want it to be.
   }
   

就个人而言,我真的不喜欢Auto Layout.如果你有兴趣尝试没有自动布局 - 即.只需使用代码而不是约束 - 您可以关闭视图控制器视图的自动布局,并将viewWillLayoutSubviews方法更改为如下所示:

override func viewWillLayoutSubviews()
{
    super.viewWillLayoutSubviews();

    self.scrollView.frame = self.view.bounds; // Instead of using auto layout
    self.scrollView.contentSize.height = 3000; // Or whatever you want it to be.
}

Answer 3

这是我总是要在有约束的情况下从情节提要垂直滚动的方式：

1-拖动一个视图控制器

2-将具有约束L = 0，T = 0，T = 0和B = 0的控制器主视图中的滚动视图拖到其超级视图（控制器主视图）。

3-将UIVIew拖到滚动视图中，以将其约束为L-0，T = 0，T = 0，B = 0的内容视图用作其超级视图（滚动视图）

• 现在是时候设置滚动视图的内容大小了，它控制水平和垂直滚动，如下所示。

4-要停止水平滚动，请在约束条件下使内容视图的宽度等于滚动视图的宽度。

5-使内容视图的高度等于控制器视图的高度，这是暂时的， 直到我们将其滚动内容填充为止。

在内容视图中添加6个控件，直到完成。

7-最重要的是删除您在内容视图的最高点5中所做的约束，而不是从内容视图底部的控件中进行约束以使其与底部对齐。这有助于使内容视图的高度从顶部的第一个控件向下一直到最后一个控件（这完全取决于此步骤）。

8，公正运行，结果应符合预期，否则请通知我。

希望这可以帮助！