senty senty - 9 months ago 113
Swift Question

Sliding-In UIView From Bottom

I am trying to build a custom-looking action sheet. I thought the easiest way would be creating a view as a subview and assign constraint of subview's top to superview's bottom. And at the same time assigning a cover view with some opacity. Thus, I could have different versions of subview and I can initialise the necessary one and slide it.

enter image description here enter image description here

I couldn't find anything useful for Swift, so, using this obj-c answer, I tried to convert it to Swift. I achieved the opaque background with this however translating constraints doesn't seem to work.

var coverView = UIView()

override func viewDidLoad() {

coverView.backgroundColor = UIColor(white: 0.0, alpha: 0.4)
coverView.alpha = 1.0

//doesn't work
self.view.addConstraints(NSLayoutConstraint.constraintsWithVisualFormat("H:|[coverView]|", options: kNilOptions, metrics: nil, views: NSDictionaryOfVariableBindings(coverView)))
self.view.addConstraints(NSLayoutConstraint.constraintsWithVisualFormat("V:|[coverView]|", options: kNilOptions, metrics: nil, views: NSDictionaryOfVariableBindings(coverView)))

I got confused on instantiating the view and applying transition animation. If I choose to create a UIView under ViewController, I cannot adjust constraints to adjust
equal width
of subview to superview.

enter image description here

How can I use the UIView that I created as a Subview (in Storyboard) and then adjust its width constraints so the UI doesn't bug? Also, how can I apply the transition animation so it seems natural?


I suggested you use UIView xib file and design your view then load in your view controller.


Step 1:

Create xib for view enter image description here

Step 2: Set background color black for this view, opacity 62% and Alpha = 1 enter image description here

Step 3: Take new simple UIView and Design your actual view and set constraint.

For Exp: enter image description here

In your case set view in bottom. Step 4: Load xib in view controller.

class calendarViewController: UIViewController
    var popUpView: popUpView!
    override func viewDidLoad() {
       bookingConfirmView = NSBundle.mainBundle().loadNibNamed("popUpView", owner: self, options: nil).first as! popUpView
    // Set Delegate for xib textField
    self.popUpView.Name.delegate = self
    self.popUpView.MobileNo.delegate = self

Step 5:

Add this line to where you want to populate view.

self.bookingConfirmView.frame = self.view.bounds