根据屏幕尺寸调整UIViews大小,如iOS中的Android

时间:2018-03-17 06:28:14

标签: ios ios-autolayout autoresize

我使用约束设计了下面的视图,它已经在故事板上的iPhone 6上完成,所以它在iPhone 6上看起来完全一样。 当我在iPhone 5s或SE上运行时,所有视图都会失真。在iPhone X上事情变得更糟。我了解内容拥抱和内容压缩。

enter image description here

为了解决这个问题,我所做的是创建了以下函数来根据屏幕大小调整视图大小。

import UIKit

/// The UI was desinged on this screen
let designedOnSize = CGSize(width: 320, height: 568)

/// This is the phone screen.
let currentScreenSize = UIScreen.main.bounds.size

func getVerticleCostraintValueFrom(_ constant: CGFloat) -> CGFloat {
    // cSize * (constant / size)
    return currentScreenSize.height*constant/designedOnSize.height
}

func reconfigureVerticleConstraints(_ constraints: [NSLayoutConstraint]) {
    for constraint in constraints {
        constraint.constant = getVerticleCostraintValueFrom(constraint.constant)
    }
}

func getHorizontalCostraintValueFrom(_ constant: CGFloat) -> CGFloat {
    // cSize * (constant / size)
    return currentScreenSize.width*constant/designedOnSize.width
}

func reconfigureHorizontalConstraints(_ constraints: [NSLayoutConstraint]) {
    for constraint in constraints {
        constraint.constant = getHorizontalCostraintValueFrom(constraint.constant)
    }
}

func configureFontSize(_ views: [Any]) {
    for view in views {
        if let label = view as? UILabel {
            label.font = label.font.withSize(getHorizontalCostraintValueFrom(label.font.pointSize))
            continue
        }

        if let textField = view as? UITextField {
            textField.font = textField.font?.withSize(getHorizontalCostraintValueFrom(textField.font!.pointSize))
            continue
        }

        if let textView = view as? UITextView {
            textView.font = textView.font?.withSize(getHorizontalCostraintValueFrom(textView.font!.pointSize))
            continue
        }

        if let button = view as? UIButton {
            button.titleLabel?.font = button.titleLabel?.font.withSize(getHorizontalCostraintValueFrom(button.titleLabel!.font.pointSize))
            continue
        }
    }
}

override func viewDidLoad() {
    super.viewDidLoad()

    configureFontSize([emailTextField, mobileNumberTextField, passwordTextField, signUpButton, orSignUpLabel, facebookButton, googleButton, twitterButton])
    reconfigureVerticleConstraints([logoTopConstraint, logoHeightConstraint, emailTextFieldHeightConstraint, emailTextFieldTopConstraint ........])
    self.view.layoutIfNeeded()
}

以上方式是否正确?如果没有,那么请给我建议或建议我一些好的做法,因为我的表现真的很重要。 这会影响布局吗?

在Android中,这是由系统自动处理的,这样可以在iOS中完成吗?

enter image description here

1 个答案:

答案 0 :(得分:1)

相反,您可以通过水平添加彼此相邻的社交图标来更改登录屏幕的用户界面

有了这个,您将不会遇到调整大小的问题

ref:https://dribbble.com/shots/3803685-Fintech-App-UI