在 iPhone X 上横向使用最大屏幕

Question

我目前正在像这样设置网络视图的布局约束：

UIView *theView = self.view;
UILayoutGuide *theGuide = theView.safeAreaLayoutGuide;

inWebView.translatesAutoresizingMaskIntoConstraints = NO;
[theView.topAnchor constraintEqualToAnchor:inWebView.topAnchor].active = YES;
[theGuide.leadingAnchor constraintEqualToAnchor:inWebView.leadingAnchor].active = YES;
[theGuide.trailingAnchor constraintEqualToAnchor:inWebView.trailingAnchor].active = YES;
[theView.bottomAnchor constraintEqualToAnchor:inWebView.bottomAnchor].active = YES;

当视图以横向模式显示在 iPhone X 上时，这会导致左右边距。 Web 视图在视图中水平居中。这在下面的草图中显示为 (1) Web 视图被绘制为绿色区域的位置。

但我想使用视图的最大宽度，其中 Web 视图延伸到右边缘 (2) 或左边缘 (3)。这将需要用于前导和尾随的动态布局指南。

我怎样才能做到这一点？

Answer 1

我通过添加更多约束找到了解决方案：

@property (nonatomic, strong) NSLayoutConstraint *leftFullConstraint;
@property (nonatomic, strong) NSLayoutConstraint *rightFullConstraint;

并初始化视图约束：

UIView *theView = self.view;
UILayoutGuide *theGuide = theView.safeAreaLayoutGuide;
NSLayoutConstraint *theConstraint;

inWebView.translatesAutoresizingMaskIntoConstraints = NO;
[theView.topAnchor constraintEqualToAnchor:inWebView.topAnchor].active = YES;
theConstraint = [theGuide.leadingAnchor constraintEqualToAnchor:inWebView.leadingAnchor];
theConstraint.priority = UILayoutPriorityDefaultHigh;
theConstraint.active = YES;
theConstraint = [theGuide.trailingAnchor constraintEqualToAnchor:inWebView.trailingAnchor];
theConstraint.priority = UILayoutPriorityDefaultHigh;
theConstraint.active = YES;
[theView.bottomAnchor constraintEqualToAnchor:inWebView.bottomAnchor].active = YES;

self.leftFullConstraint = [theView.leftAnchor constraintEqualToAnchor:inWebView.leftAnchor];
self.rightFullConstraint = [theView.rightAnchor constraintEqualToAnchor:inWebView.rightAnchor];

注意：新约束使用左右而不是前导和尾随，因为书写方向无关！它们比保存区域布局指南的约束具有更高的优先级。所以当应用程序激活它时，他们将否决对安全区域的限制。

最后，当特征集合改变时更新约束：

- (void)updateConstraints {
    UIDeviceOrientation theOrientation = [[UIDevice currentDevice] orientation];

    switch (theOrientation) {
        case UIDeviceOrientationLandscapeLeft:
            self.leftFullConstraint.active = NO;
            self.rightFullConstraint.active = YES;
            break;
        case UIDeviceOrientationLandscapeRight:
            self.leftFullConstraint.active = YES;
            self.rightFullConstraint.active = NO;
            break;
        default:
            self.leftFullConstraint.active = NO;
            self.rightFullConstraint.active = NO;
    }
}

- (void)traitCollectionDidChange:(UITraitCollection *)inPreviousTraitCollection {
    [super traitCollectionDidChange:inPreviousTraitCollection];
    [self updateConstraints];
}

Swift 4 相同。定义属性：

var leftFullConstraint: NSLayoutConstraint?
var rightFullConstraint: NSLayoutConstraint?

正在初始化约束：

if let theView = self.view {
    let theGuide = theView.safeAreaLayoutGuide
    var theConstraint: NSLayoutConstraint!

    inWebView.translatesAutoresizingMaskIntoConstraints = false
    theView.topAnchor.constraint(equalTo: inWebView.topAnchor).isActive = true
    theConstraint = theGuide.leadingAnchor.constraint(equalTo: inWebView.leadingAnchor)
    theConstraint.priority = UILayoutPriorityDefaultHigh
    theConstraint.isActive = true
    theConstraint = theGuide.trailingAnchor.constraint(equalTo:inWebView.trailingAnchor)
    theConstraint.priority = UILayoutPriorityDefaultHigh
    theConstraint.isActive = true
    theView.bottomAnchor.constraint(equalTo: inWebView.bottomAnchor).isActive = true

    self.leftFullConstraint = theView.leftAnchor.constraint(equalTo: inWebView.leftAnchor)
    self.rightFullConstraint = theView.rightAnchor.constraint(equalTo: inWebView.rightAnchor)
}

并更新它们：

func updateConstraints() {
    if let leftFullConstraint = self.leftFullConstraint, 
       let rightFullConstraint = self.rightFullConstraint {
        let theOrientation = UIDevice.current.orientation

        switch(theOrientation) {
        case .landscapeLeft:
            leftFullConstraint.isActive = false
            rightFullConstraint.isActive = true
            break;
        case .landscapeRight:
            leftFullConstraint.isActive = true
            rightFullConstraint.isActive = false
            break
        default:
            leftFullConstraint.isActive = false
            rightFullConstraint.isActive = false
        }
    }
}

override func traitCollectionDidChange(_ inPreviousTraitCollection: UITraitCollection?) {
    super.traitCollectionDidChange(inPreviousTraitCollection)
    updateConstraints()
}

在 iPhone X 上横向使用最大屏幕

Using maximal screen with in landscape on iPhone X

ios

ios11

nslayoutconstraint

safearealayoutguide