Question

在完成一些教程之后，我正在构建我的第一个真实应用程序，并且遇到了布局问题。将UI布局调整为不同的屏幕尺寸类非常简单，但我没有找到有关如何调整相同尺寸类布局的任何信息。

例如，我有一个标签，其顶部空间约束从视图顶部设置为40磅。它在iPhone 8 Plus大屏幕上显得很整洁：

但是在一个较小的iPhone SE屏幕上（这是一个令人困惑的相同尺寸级别）这个40 pt的约束将标签推到中间位置，在它下面留下了相当少的有用空间：

所以我想知道是否有办法为不同的iPhone设置不同的约束：例如，iPhone 8 Plus为40 pt，iPhone 8为30 pt，iPhone SE为20 pt。将其他视图放置在标签下面也是如此：我希望它们在小型iPhone屏幕上垂直方向更紧凑，并且在大屏幕上它们之间有更多空间。我知道最后一部分可以通过堆栈视图解决，但使用起来并不总是方便。

UPD 即可。以下是8 Plus屏幕上视图的完整布局：

它有3个固定约束： 1.从“标题”标签到视图顶部 - 50磅 2.从'百分比'标签到'标题'标签底部 - 60磅 3.从“详细信息”标签到视图底部 - 80 pt。

我在所有标签中都使用了文字自动收缩+每个标签的高度与视图的高度成正比。这使得布局更加灵活，但在小型SE屏幕上仍然存在一个明显的问题：

正如您所看到的，'详细信息'被挤压到'百分比'标签。在这一点上，将“百分比”标签向上移动并更接近“标题”会很棒，但不同高度限制不能按比例（至少在IB中）设置为超级视图高度。

我看到的其中一个选项是在顶部和中间标签之间放置一个空白视图，使其高度成比例，并将“百分比”标签顶部约束设置为0到此空白视图。不确定使用这种“拐杖”是一种很好的做法。

Answer 1

可能使用单个UILabel并设置归属文本，而不是尝试获取多个标签和字体大小，从而获得最满意的结果合作。

试试这个：

创建新的视图控制器
添加正常的UILabel
将约束设置为宽度的85％和高度的80％，并且双向居中
将标签连接到IBOutlet

然后：

class ScalingViewController: UIViewController {

    @IBOutlet weak var theLabel: UILabel!

    override func viewDidLoad() {
        super.viewDidLoad()

        let titleFont = UIFont.systemFont(ofSize: 80.0, weight: UIFontWeightThin)
        let pctFont = UIFont.systemFont(ofSize: 100.0, weight: UIFontWeightThin)
        let paraFont = UIFont.systemFont(ofSize: 30.0, weight: UIFontWeightLight)

        // for blank lines between Title and Percent and between Percent and Body
        let blankLineFont = UIFont.systemFont(ofSize: 36.0, weight: UIFontWeightLight)

        let sTitle = "Title"
        let sPct = "78%"
        let sBody = "A detailed text explaining the meaning of percentage above and what a person should do to make it lower or higher."

        // create the Attributed String by combining Title, Percent and Body, plus blank lines
        let attText = NSMutableAttributedString()

        attText.append(NSMutableAttributedString(string: sTitle, attributes: [NSFontAttributeName: titleFont]))
        attText.append(NSMutableAttributedString(string: "\n\n", attributes: [NSFontAttributeName: blankLineFont]))
        attText.append(NSMutableAttributedString(string: sPct, attributes: [NSFontAttributeName: pctFont]))
        attText.append(NSMutableAttributedString(string: "\n\n", attributes: [NSFontAttributeName: blankLineFont]))
        attText.append(NSMutableAttributedString(string: sBody, attributes: [NSFontAttributeName: paraFont]))

        // these properties can be set in Interface Builder... or set them here to make sure.
        theLabel.textAlignment = .center
        theLabel.numberOfLines = 0
        theLabel.adjustsFontSizeToFitWidth = true
        theLabel.minimumScaleFactor = 0.05

        // set the label content
        theLabel.attributedText = attText

    }

}

这给了我7 +，6s和SE的这些结果：

而且，仅仅是为了演示，以及＆＃34; body＆＃34;中的其他文字的外观。段：

不同iPhone屏幕的布局

1 个答案: