Adaptive layout for iPad

2019-04-29 19:33发布

I am following this article for building adaptive layout in ios Building Adaptive User Interfaces for iOS 8.

It will work fine on iPhones . Now i wan't to give the same effect on iPad. But for iPad adaptive layout is not work.
Here is screenshot of application in iPhone5 (green box represent view1 and yellow box represent view2)
1.Portrait mode

enter image description here

  1. Landscape mode
    enter image description here

Question: how can achieve same effect for iPad?
Expanded Question: How to set up initial orientation of iPad in landscape mode?

1条回答
等我变得足够好
2楼-- · 2019-04-29 19:55

The problem with the iPad is that both orientation is represented as Regular.

One of the solution is to add two IBOutlet collection to your view controller where you want this orientation change to happened, for example:

@IBOutlet var landscapeConstraints: [NSLayoutConstraint]!
@IBOutlet var portraitConstraints: [NSLayoutConstraint]!

Go to the storyboard, switch to the Adaptive Layout you want to happened in iPad portrait orientation and control drag from every ACTIVE constraints to portraitConstraints IBOutlet. Change the Adaptive Layout to the one you want to happened for landscape and again control drag from just ACTIVE constraints to landscapeConstraints IBOutlet.

In view controller override viewWillTransitionToSize method:

    override func viewWillTransitionToSize(size: CGSize, withTransitionCoordinator coordinator: UIViewControllerTransitionCoordinator) {
        super.viewWillTransitionToSize(size, withTransitionCoordinator: coordinator)
        let transitionToLandscape = size.width > size.height 
        let constraintsToUninstall = transitionToLandscape ? ortraitConstraints : landscapeConstraints 
        let constraintsToInstall = transitionToLandscape ? landscapeConstraints : portraitConstraints

        view.layoutIfNeeded()
        coordinator.animateAlongsideTransition({
            _ in
            NSLayoutConstraint.deactivateConstraints(constraintsToUninstall) 
            NSLayoutConstraint.activateConstraints(constraintsToInstall) 
            self.view.layoutIfNeeded()
        }, completion: nil)
}

// Expanded, constraints example:

enter image description here

Go to any-any size class and see the constraint some of them will be gayed out which means that are not active here but will be active in different size classes, for example any-regular.

// Expanded

To set up initial orientation you can override viewWillAppear and install/uninstall the right constraints:

override func viewWillAppear(animated: Bool) {
        super.viewWillAppear(animated)

        let transitionToLandscape = view.frame.size.width > view.frame.size.height

        let constraintsToUninstall = transitionToLandscape ? portraitConstraints : landscapeConstraints
        let constraintsToInstall = transitionToLandscape ? landscapeConstraints : portraitConstraints

        view.layoutIfNeeded()
        NSLayoutConstraint.deactivateConstraints(constraintsToUninstall)
        NSLayoutConstraint.activateConstraints(constraintsToInstall)
    }
查看更多
登录 后发表回答