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只是運行和結果應該如預期的，否則請讓我知道。

希望這會有所幫助！