mkko / DrawerView

A drop-in view, to be used as a drawer anywhere in your app
MIT License
373 stars 57 forks source link

Top constraints for iPhone X #18

Closed ismael9291 closed 4 years ago

ismael9291 commented 4 years ago

Thank you very much for creating this drawer. Really useful for my project.

The only thing I'm having a bit of trouble is when I'm displaying the drawer in a collapsed state. The constraints are different when viewing it in an iPhone X.

I have the top constraints to 5px in my drawer view controller. It looks fine on an iPhone 8 Plus but seems to look different on the iPhone X. I have also tried to set the constraints to the safe area and the superview to see if there's a difference but got the same result.

Do I need to update or adjust the constraints when I add the drawer view with the view controller I created?

mkko commented 4 years ago

Hi! Thank you for the feedback!

Can you tell me how are you adding the drawer into your app?

ismael9291 commented 4 years ago

Thank you for your response!

The following is how I am adding the drawer in my app.

// Initializing the view controller for the drawer. let controller = DrawerViewController() let bundle = Bundle(for: type(of: controller)) bundle.loadNibNamed(XibInfo.drawerView.fileName(), owner: controller, options: nil)

    self.drawerView = self.addDrawerView(withViewController: controller)

DrawerViewController being a custom view controller where I am trying to set my custom drawer. I also add the constraints in the storyboard of the view controller and it looks great on iPhone 8 but the spacing is a bit off for the iPhone X.

Please let me know if you see anything that I'm obviously doing wrong.

mkko commented 4 years ago

What are you loading from the xib with loadNibNamed?

The API of adding the drawer might not be the most user friendly (at least it's easy to use incorrectly), but after adding it, it should handle the inset adjustment. Is insetAdjustmentBehavior set to automatic?

I'll gladly help but I think I need more information on this. Would it be possible for you to show me a fully working project? That'd be the most straightforward way to see what might be the issue.

ismael9291 commented 4 years ago

I am loading a xib containing the DrawerViewController

The api looks to be working great, there's probably a small setting for constraints thats the issue. I am setting insetAdjustmentBehavior set to automatic.

That sounds great, i'll look into creating a project that just includes a drawer to be able to pinpoint the possible solution. Thank you!

ismael9291 commented 4 years ago

Hello,

I have created a sample project that just contains the drawer. Please take a look at it when you can.

https://github.com/ismael9291/DrawerViewExample

If you run it on an iPhone XR simulator. At first glance it looks great, but you go into the Debug View Hierarchy, and go into the constraints of the uiview at the top of the drawer. You will see that it has a width, height and bottom constraint. But the top constraint is missing.

If you then go to DrawerViewController.Xib, you will see that the view does in fact have a top constraint. So I believe the issue I am seeing is that the top constraint is being removed and possibly misplacing the whole view.

Please take a look at the sample project whenever you have a chance. Thank you!

Screen Shot 2019-10-07 at 2 03 35 PM Screen Shot 2019-10-07 at 2 04 53 PM

mkko commented 4 years ago

Hi and thank you for the example you provided!

There was an issue with scenes (iOS 13 specific feature) in the example, I simply removed the conflicting value from Info.plist. Also for some reason the version of the included DrawerView pod didn't match its specs in Podfile. The drawer version mismatch wasn't really the issue here, old version of it was just broken on iOS 13.

After clearing out these issues, I think I'm seeing your issue. The top constraint is added to a safe area in the VC which I believe is missing when loading it to the xib. If you do the following changes:

class ViewController: UIViewController {

    @IBOutlet weak var name: UILabel!
    @IBOutlet weak var info: UILabel!

    private var drawerView: DrawerView?

    override func viewDidLoad() {
        super.viewDidLoad()

        let controller = DrawerViewController()
        let bundle = Bundle(for: type(of: controller))
        bundle.loadNibNamed("DrawerViewController", owner: self, options: nil)

    }
}

And then try it out. There's no drawer now, but you can see that the top constraint is still missing.

Screen Shot 2019-10-09 at 12 39 47

To make it work, changing the top constraint of the handle, in DrawerViewController from safe area to superview seems to do the trick.

Does this answer your issue? I think the issue is unrelated to the DrawerView itself. Just let me know if you find something.

ismael9291 commented 4 years ago

Thank you very much for taking the time to look into my sample project. Unfortunately I couldn't add the drawer as you mentioned above because I didn't want to add the xib to the view controller. I wanted to add it to the DrawerViewController.

Fortunately though, I was able to fix the constraint issue by adding a top constraint programmatically after loading the nib and by setting the topMargin to make sure that its not under the navigation bar when the drawer is opened fully. Thank you very much for your time and input into this matter!

mkko commented 4 years ago

No worries. What I meant was that with the changes above you'll get the same outcome, the top constraint is missing and that it didn't seem to have anything to do with the drawer. Try changing the top constraint from safe area to superview and it should work.