View at the bottom in a UIScrollView, with AutoLayout

前端 未结 2 1269
日久生厌
日久生厌 2020-12-08 05:20

I\'m setting up content in a scroll view with autolayout. The objects in the scrollview are pinned top-to-bottom to the previous one, so that they are under one another. I h

相关标签:
2条回答
  • 2020-12-08 06:06

    Fairly easy to do with Auto-Layout only... no code required.

    The key is to use a "content view" to hold the elements, and a greater-than-or-equal constraint between your "bottom" element and your "footer" view.

    In this image, yellow is the main view, green is the scroll view, blue is the content view, the labels are gray and the footer view is pink.

    • Start with a fresh view controller
    • add a scroll view, normal constraints (I used 20 all the way around, so we can see the frame)
    • add a UIView to the scrollView - this will be our "content view"
    • constrain contentView Top/Bottom/Leading/Trailing all equal to 0 to the scrollView
    • constrain both the Width and Height of the contentView equal to the scrollView
    • add your elements - here I used 3 labels
    • constrain the labels as usual... I used:
      • LabelA - Top/Leading/Trailing all at 20, vertical spacing to LabelB of 60
      • LabelB - Leading/Trailing at 20, vertical spacing to LabelC of 60
      • LabelC - Leading/Trailing at 20
    • LabelC is also set to Number of Lines: 0 so it will expand with multiple lines of text
    • Add a UIView as a "footer view" (I stuck a label in it)
    • constrain the footerView Leading/Trailing/Bottom all at 20 (so we can see the frame)
    • either set a Height constraint on footerView, or use its content to constrain its height
    • add a Vertical Spacing constraint from LabelC to footerView, and set it to >= 40
    • last step, change the Height constraint of contentView to Priority: 250

    Now, as you expand/contract the height of LabelC, the footerView will keep at least 40-pts of vertical space. When LabelC gets big enough to "push" footerView below the bottom, scrollView will become scrollable.

    Results:

    0 讨论(0)
  • 2020-12-08 06:13

    you need to check ContentSize of scrollView and modify FooterView Top Constraint with the required Value

    My class code

    import UIKit
    
    class scrollViewDrag: UIViewController
    {
        /// ScrollView Outlet
        @IBOutlet weak var mainScrollView: UIScrollView!
    
        /// Footer View top spacing constraint
        @IBOutlet weak var footerViewTopConstraint: NSLayoutConstraint!
    
        /// Used for ScrollView Height
        var screenHeight = CGFloat()
    
        /// Did Load
        override func viewDidLoad() {
            super.viewDidLoad()
    
        }
    
        /// Function used to check for height 
        func checkForHeight(){
            /// Get scrollView Height
            screenHeight = mainScrollView.frame.size.height
    
            /// Check contentSize Height ?
            if mainScrollView.contentSize.height >= screenHeight {
                /// When ScrollView is having height greater than your scrollView Height
                /// Footer will scroll along other Views
            }
            else{
                /// Issue Case
                let spacingValue = screenHeight-mainScrollView.contentSize.height
                footerViewTopConstraint.constant = spacingValue
            }
        }
    
        /// Call the height function in DidAppear
        override func viewDidAppear(_ animated: Bool) {
            checkForHeight()
        }
    }
    

    Storyboard

    I had used Four View with Equal Heights And at last a footerView is attached as Fourth View

    FooterView Top Constraint

    Top constraint used as footerViewTopConstraint

    Output

    Case 1 - Size is greater than scrollView Height

    Case 2 - Expected Output

    0 讨论(0)
提交回复
热议问题