简体   繁体   中英

UIView Subclass Set Own Height + Constraints In UIViewController + Storyboard in Swift

I have a UIViewController subclass that contains a UITableView, a subclass of UIView called ICYCollapsableInputView, and another UIView subclass called ICYHeaderVIew.

ICYHeaderView is the rounded off looking UIView shown in the screenshots. It contains a round button - the one with the green "add" (+) button.

ICYCollapsableInputView is a view that will for now have a UITextField and a Save button. I want to be able to expand and collapse this view from the UIViewController by calling the appropriate functions of the ICYCollapsableInputView.

When the user taps the round button on the ICYHeaderView, Ithe ICYCollapsableInputView is supposed to expand in height, pushing down the UITableView. I have the ICYCollapsableInputView expanding and collapsing, but I can't figure out how to get the UITableView to respond to the changes. (See Animation)

展开/折叠动画

I colored the main view in the xib with a RED background and the view I added in it with a BLUE background (see screenshot)

在此输入图像描述

I can resize the ICYCollapsableInputView (as seen in the code and animation) using its own height constraint, but the UITableView constraint seems to ignore it.

Here is the code from ICYCollapsableInputView:

class ICYCollapsableInputView: UIView {

var view: UIView!

@IBOutlet weak var heightConstraint: NSLayoutConstraint!

@IBInspectable public var collapsedHeight: CGFloat = 150 {
    didSet {
        self.heightConstraint.constant = collapsedHeight
    }
}
@IBInspectable public var expandedHeight: CGFloat = 250 {
    didSet {
        self.heightConstraint.constant = expandedHeight
    }
}

// MARK: - Init

func loadFromNib() -> UIView {
    let bundle = Bundle(for: type(of: self))
    let nib = UINib(nibName: "ICYCollapsableInputView", bundle: bundle)
    let view = nib.instantiate(withOwner: self, options: nil)[0] as! UIView

    return view
}


override init(frame: CGRect) {
    // 1. setup any properties here

    // 2. call super.init(frame:)
    super.init(frame: frame)
    // 3. Setup view from .xib file
    xibSetup()

}

required init?(coder aDecoder: NSCoder) {
    // 1. setup any properties here

    // 2. call super.init(coder:)
    super.init(coder: aDecoder)
    // 3. Setup view from .xib file
    xibSetup()
}


func xibSetup() {
    view = loadFromNib()
    view.frame = bounds
    view.autoresizingMask = [.flexibleWidth, .flexibleHeight]
    addSubview(view)
    self.heightConstraint.constant = self.collapsedHeight
    var rect = self.frame
    rect.size.height = self.collapsedHeight
    self.frame = rect
    self.view.frame = rect

}

func revealInputView() {
    UIView.animate(withDuration: 0.5, delay: 0, usingSpringWithDamping: 0.3, initialSpringVelocity: 0, options: .curveEaseInOut, animations: {
        var rect = self.frame
        rect.size.height = self.expandedHeight
        self.frame = rect
        self.heightConstraint.constant = self.expandedHeight
        self.view.layoutIfNeeded()
    }, completion: nil)
}

func closeInputView() {
    UIView.animate(withDuration: 0.5, delay: 0, usingSpringWithDamping: 0.3, initialSpringVelocity: 0, options: .curveEaseInOut, animations: {
        self.heightConstraint.constant = self.collapsedHeight
        var rect = self.frame
        rect.size.height = self.collapsedHeight
        self.frame = rect
        self.view.layoutIfNeeded()
    }, completion: nil)

}

 }

All you need ia just changing the height constraints.

    func revealInputView() {
        UIView.animate(withDuration: 0.5, delay: 0, usingSpringWithDamping: 0.3, initialSpringVelocity: 0, options: .curveEaseInOut, animations: {

            self.heightConstraint.constant = self.expandedHeight //or 250
            self.view.layoutIfNeeded()
        }, completion: nil)
    }

    func closeInputView() {
        UIView.animate(withDuration: 0.5, delay: 0, usingSpringWithDamping: 0.3, initialSpringVelocity: 0, options: .curveEaseInOut, animations: {

            self.heightConstraint.constant = self.collapsedHeight //or 150        
self.view.layoutIfNeeded()
        }, completion: nil)
}

And Constraints in Storyboard should be following

for inputVW

Trailaing space to superview - 0 , leading space to superview - 0, top space to superview - 0 , bottom space to tableview - 0

for TableView

top space to inputVw - 0, leading space to superview - 0, trailing space to super view - 0, bottom space to superview - 0

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM