Control height of iOS 13 modal presentation

Question

I would like to display a view controller (with a date picker and a toolbar in it) with a overall height of 260 pt. I have set the preferred explicit size in the storyboard editor, however I believe that only affects the popover size. I have tried all the various combinations of segue/preferred presentation types, and they all display the date picker full screen. Indeed, the functionality works, however the pop up take up the whole screen.

This is what it looks like:

put a view with 260px in the controller, with bottom constraints (no top ones) and present it :) it will work just fine — Deryck Lucian, Oct 22 '19 at 16:19
@rmaddy if you have hits or links on where to find guidance on the custom transition, it would help me out a lot. Thanks! — samuraisam, Oct 23 '19 at 15:34

score 0 · Answer 1 · answered Nov 22 '19 at 15:55

create your ChildViewController
add a Vertical Stack View, put everything you need inside (or any other container view)
calculate that container's view's height
change height of ViewController's View to that
set corner radius of View

import UIKit

class ChildViewController: UIViewController {

    @IBOutlet weak var stackView: UIStackView!

    override func updateViewConstraints() {
        // distance to top introduced in iOS 13 for modal controllers
        // they're now "cards"
        let TOP_CARD_DISTANCE: CGFloat = 40.0

        // calculate height of everything inside that stackview
        var height: CGFloat = 0.0
        for v in self.stackView.subviews {
            height = height + v.frame.size.height
        }

        // change size of Viewcontroller's view to that height
        self.view.frame.size.height = height
        // reposition the view (if not it will be near the top)
        self.view.frame.origin.y = UIScreen.main.bounds.height - height - TOP_CARD_DISTANCE
        // apply corner radius only to top corners
        self.view.roundCorners(corners: [.topLeft, .topRight], radius: 10.0)
        super.updateViewConstraints()
    }
}

// https://stackoverflow.com/a/41197790/225503
extension UIView {
   func roundCorners(corners: UIRectCorner, radius: CGFloat) {
        let path = UIBezierPath(roundedRect: bounds, byRoundingCorners: corners, cornerRadii: CGSize(width: radius, height: radius))
        let mask = CAShapeLayer()
        mask.path = path.cgPath
        layer.mask = mask
    }
}

Code Sample here

Control height of iOS 13 modal presentation

1 Answers1