Swift UIScrollView - 仅适用于垂直滚动的正确实现

Question

在此之前，我很抱歉，因为我是一名iOS编程初学者。

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

我使用故事板以AutoLayout来绘制视图。

这里的是我的UIViewController与UIScrollView截图：

然后我改变了标签到大的文本一样，

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

迈克Woelmer展示了如何正确使用Interface Builder中的原子对象做到这一点博客。

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

我也有在GitHub上我自己的代码（不使用故事板实现）。

https://github.com/nadthevlad/AutolayotScrollview

你不想设置你的内容或观点的高度或宽度。 相反，您希望使用Autolayouts引脚和约束来设置滚动视图的行为方式。

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. 引脚4个滚动视图的边缘，以self.view

4. 的4个边缘引脚的顶部和内容查看的滚动视图向的顶部和底部底部边缘。

5. 这是棘手的部分。要设置水平尺寸，您需要将contentView的前（右）和尾（左）边缘固定到前缘和后缘self.view而不是scrollView。即使contenView是scrollView的子视图，它的水平约束将会到达scrollView的外部并连接到self.view。

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

Answer 2

我只对横向/纵向滚动视图使用此实现，虽然它在Objective-C中，但我会尝试解释逻辑，如果某些事情不清楚给你。

//Getting iDevice's screen width 
CGRect screenRect = [[UIScreen mainScreen] bounds]; 
CGFloat screenWidth = screenRect.size.width; 

//Setting the right content size - only height is being calculated depenging on content. 
CGSize contentSize = CGSizeMake(screenWidth, HEIGHT_OF_YOUR_CONTENT); 
self.scrollView.contentSize = contentSize; 

现在滚动视图的contentSize属性的宽度被附连到所述设备的屏幕的实际宽度，所以滚动视图将被滚动仅在垂直方向上。

Answer 3

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

考虑到这一点，请尝试以下操作：

1. 确保您有相同的方式建立约束在this answer

2. 描述下面的代码添加到您的视图控制器：

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

个人而言，我真的不是汽车拉的粉丝YOUT。如果你有兴趣尝试没有自动布局 - 即。只需用代码而不是约束 - 你可以关闭自动布局视图控制器的观点，改变你的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 4

感谢@NadtheVlad，我终于看到了光。一些进一步的小技巧告诉我，contentView只需要固定在scrollView的Top，Bottom和Width上。不需要引用self.view。

随着EasyPeasy，这简直是：

scrollView <- Edges() 
contentView <- [Top(), Bottom(), Width().like(scrollView)] 

Answer 5

这我怎么总是做它从故事板与约束垂直滚动：

1拖动一个视图控制器

2拖动滚动型在控制器的主视图中，对其超视图（控制器的主视图）约束L = 0，T = 0，T = 0和B = 0。

3-拖动一个UIView到滚动视图作为其内容考虑到与约束L-0，T = 0工作，T = 0，B = 0到它的父（滚动视图）

• 以及这里是设置滚动视图的内容大小的时间，它控制水平和垂直滚动，如下所示。

4-用于停止水平滚动，使内容视图的宽度等于带约束的滚动视图。

5使控制器的视图的内容视图等于HIGHT的高度，这是临时，直到我们与滚动内容填充它。

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

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

8只是运行和结果应该如预期的，否则请让我知道。

希望这会有所帮助！