SwiftにUIScrollViewをプログラムで表示する

Question

ビューを持つビューコントローラがあります。トップレベルビューContainsコンテナビューには、下図のようなbottomView、topViewの2つのビューがあります。

シーン

私はから表示したい：へ：上面図で日付範囲。 bottomViewでは、スクロールできる2つの列を含むUIScrollViewを表示します。私はそれをしましたが、scrollViewを導入するとtopViewとBottomViewが重なっています。私がスクロールすると、ビューが分かれていき、すぐにスクロールバーを移動してみましょう。

誰かがそれを修正する方法を教えてくださいできますか？私は、scrollViewとbottomViewがどのように関連付けられるべきかを理解していないようです。以下 コード：

override func viewDidLayoutSubviews() { 
    super.viewDidLayoutSubviews() 
    scrollView.frame = view.bounds 

    //scrollView.frame = innerView.bounds 
    innerView.frame = CGRect(x:0, y:0, width:scrollView.contentSize.width, height:scrollView.contentSize.height) 
} 
func buildBottomView() { 
    let screenSize = UIScreen.main.bounds 
    let screenWidth = screenSize.width 
    let ht:Int = 21 
    let incrX:Int = 5 
    let incrY:Int = 5 
    let gapCol1:Int = 5 
    let col1Width:Int = 65 
    let col2Width:Int = 65 
    let startY:Int = 5 
    let col1StartX:Int = 10 
    let col2StartX:Int = col1StartX + col1Width + gapCol1 

    var loadRowStartY: Int = 0 
    // column headers 
    categoryColumnLabel.text = "Interval" 
    categoryColumnLabel.font = UIFont.preferredFont(forTextStyle:UIFontTextStyle.subheadline) 
    //categoryColumnLabel.font = UIFont.systemFont(ofSize: 14) 
    categoryColumnLabel.frame = CGRect(x: col1StartX, y:startY, width: col1Width, height: ht) 
    categoryColumnLabel.textAlignment = NSTextAlignment.left 
    categoryColumnLabel.tag = 1 
    innerView.addSubview(categoryColumnLabel) 

    valueColumnLabel.text = "Values" 
    valueColumnLabel.font = UIFont.preferredFont(forTextStyle:UIFontTextStyle.subheadline) 
    //valueColumnLabel.font = UIFont.systemFont(ofSize: 14) 
    valueColumnLabel.frame = CGRect(x: col2StartX, y:startY, width: col2Width, height: ht) 
    valueColumnLabel.textAlignment = NSTextAlignment.center 
    valueColumnLabel.tag = 3 
    innerView.addSubview(valueColumnLabel) 

    let sepLine:UIView = UIView() 
    sepLine.frame = CGRect(x: col1StartX, y:startY+ht+incrY, width: Int(screenWidth-20), height: 2) 
    sepLine.backgroundColor = UIColor.darkGray 
    sepLine.tag = 60 

    loadRowStartY = startY+ht+incrX+ht 
    innerView.addSubview(sepLine) 



    for i in 0 ..< 24 { 

     let timeIntervalLabel = UILabel() 
     let value2Label = UILabel() 

     print("display load profile") 

     let loadStruct = loadDict[String(i)] as! CommercialProfile 
     print (loadStruct.timeInterval) 

     timeIntervalLabel.text = loadStruct.timeInterval 
     timeIntervalLabel.font = UIFont.preferredFont(forTextStyle:UIFontTextStyle.caption1) 

     //valueColumnLabel.font = UIFont.systemFont(ofSize: 14) 
     timeIntervalLabel.frame = CGRect(x: col1StartX, y:loadRowStartY, width: col1Width, height: Int(timeIntervalLabel.font.lineHeight)) 
     timeIntervalLabel.textAlignment = NSTextAlignment.center 
     innerView.addSubview(timeIntervalLabel) 

     print(loadStruct.value) 

     value2Label.text = loadStruct.value 
     value2Label.font = UIFont.preferredFont(forTextStyle:UIFontTextStyle.caption1) 
     //value2Label = UIFont.systemFont(ofSize: 14) 
     value2Label.frame = CGRect(x: col2StartX, y:loadRowStartY, width: col2Width, height: Int(value2Label.font.lineHeight)) 
     value2Label.textAlignment = NSTextAlignment.center 
     innerView.addSubview(value2Label) 

     loadRowStartY = loadRowStartY + incrY + Int(value2Label.font.lineHeight) 

    } 

Answer 1

あなたはこのコードの全景の大きさにscrollViewの境界を設定している：scrollView.frame = view.bounds。

scrollViewは、下のビューでコンテンツをスクロールするだけで済みます。スクロールビューには独自のコンテンツがあり、通常は画面/ビューの表示可能領域よりも大きくなります。スクロールビューでは、そのビューのビューポートをパンすることができます。

下のビューを追加し、制約を設定します。 scrollViewを下のビューに追加して、コンテンツをscrollViewに追加します。

ボトムビューにclipToBoundsがtrueに設定されていることを確認してから、ヘッダーを保持してコンテンツをスクロールできるようにする必要があります。

私はまもなく例を挙げてみましょう。

編集：私はちょうどあなたが必要とするスクロールの挙動を示し、この簡単な例を作成しました

。これは、遊び場で、または単純なView Controllerとして機能します。私は意図的に起因する時間に自動レイアウトやセットアップの制約を使用していませんでしたが、あなたはあなたの問題を解決するために必要なものが表示されます

class ViewController: UIViewController { 

    var topView: UIView! 
    var bottomView: UIView! 
    var scrollView: UIScrollView! 
    var contentView: UIView! 

    override func viewDidLoad() { 
     super.viewDidLoad() 

     let screenSize = UIScreen.main.bounds 

     self.topView = UIView(frame: CGRect(x: 0, y: 0, width: screenSize.width, height: 100)) 
     self.bottomView = UIView(frame: CGRect(x: 0, y: 100, width: screenSize.width, height: screenSize.height - 100)) 
     self.scrollView = UIScrollView(frame: CGRect(x: 0, y: 100, width: screenSize.width, height: screenSize.height - 100)) 
     self.contentView = UIView(frame: CGRect(x: 0, y: 0, width: screenSize.width, height: screenSize.height * 3)) 

     self.view.backgroundColor = .white 
     self.view.addSubview(self.topView) 
     self.view.addSubview(self.bottomView) 
     self.bottomView.addSubview(self.scrollView) 
     self.scrollView.addSubview(self.contentView) 
     self.bottomView.clipsToBounds = true 


     self.scrollView.contentSize = CGSize(width: screenSize.width, height: screenSize.height * 3) 
     self.contentView.backgroundColor = .gray 
    } 
}