在 ipad 设备中设计良好的 ios 中设置约束的好方法或好的做法是什么

Question

我创建了一个在 iphone 设备上运行良好的应用程序，我尝试了自动布局和约束，以便它可以在 ipad 上的 iphone 设备上运行，但问题是它可以在 iphone 中查看但在 ipad 设备中查看距离似乎太远了。例如，如果我设置了 8 的约束距离，它在 iphone 设备中可以，但在 ipad 设备中似乎很宽。还有一种方法可以让我们将图像或按钮或组件调整得更大以适合 ipad 吗？是否有一个好的做法或最好的方法来设置也适用于 ipad 的设计。谢谢 。正如您在下图中看到的，这些数字和位置的距离是它在手机上的外观。屏幕截图是在 ipad 中拍摄的。这就是它在 ipad 上的外观。我设法为按钮开始、跳过和 asnwer 设置了限制，但我想将所有按钮的大小调整为 ipad，包括问题和其他带有数字的按钮，正如您在图像中看到的那样，我想让它变大并使其等于中心。

Answer 1

为了简化事情，Apple 推荐了一个新的范例。与其根据多种设备类型、分辨率、多任务模式和设备方向来考虑您的布局，不如专注于将布局调整为两种宽度（称为紧凑和常规）和两种高度（也称为紧凑和常规的）。这些区别称为尺寸等级。然后，您可以使用这些尺寸类来定义或调整您的布局。

请refer。

Answer 2

您可以利用 AspectRatio 来使用 storyBoard 设置约束

静态距离值 8 对 iPhone 来说是可以的，但在 iPad 中非常少，所以要解决你需要根据屏幕尺寸提供距离

步骤

1) 将ViewController中的一个View拖入并设置Horizontally & vertically进入容器

2) 设置与屏幕大小相等的宽度和高度（ViewController）

3) 现在选择高度参数并检查乘数是否设置为 1

4) 根据需求改变乘数值

现在输出将与 iPhone 和 iPad 上的输出相同，外观相同

间距

1) 拖动一个标签来设置间距并将其水平居中添加到之前添加的视图

2) 为标签添加的视图设置顶部空间，如下所示

3) 现在选择添加的顶部约束并再次改变其乘数以根据 viewScreen 大小设置它们之间的间距

选择顶部约束看起来像乘数 1

改变乘数/标签下移后

输出

Answer 3

假设在 Storyboards 中，您有一个 skipButton 固定在屏幕底部（您没有更改底部图钉，所以我没有包含它），它的高度为 44 点，距离屏幕左侧 8 点, 距离屏幕右侧 8 点。这对 iPhone 来说很好，但在 iPad 上，您希望按钮的高度为 50 点，距离屏幕左侧 100 点，距离屏幕右侧 100 点。

在视图控制器中，您需要为 NSLayoutConstraint 类型的约束创建一个出口，并且上面有一个 constant 属性，您可以使用它来更改您在 Storyboard 中设置的常量（参见下面的代码示例） .

如果您不知道如何建立约束连接，您只需在 Storyboard 中选择约束，打开助手编辑器，然后 cntrl+将约束拖动到视图控制器，然后将其命名为您想命名的任何名称.这与连接按钮、标签或 imageView 的过程完全相同，唯一的区别是您使用了约束。

每个应用程序都有一个属性，您可以在其中找到当前正在使用的设备类型：UIDevice.current.userInterfaceIdiomApple -Type of Device Being Used

在 viewDidLoad 中，您可以了解用户正在使用什么类型的设备，然后将约束更改为适合您的 iPad 尺寸：

// skipButton is type UIButton (look at what's next to the name skipButton). You are not changing the button you are changing the constraint on the button.
@IBOutlet weak fileprivate var skipButton: UIButton! // the main focus here are the constraints for the saveButton. I just added this here to show that the saveButton is inside this vc. Your focus is changing the below constraints that help position and size the saveButton and not the saveButton itself

// ***VERY IMPORTANT*** YOU HAVE TO CONNECT THESE CONSTRAINTS via STORYBOARD (look at the 3 pics below). You do it the same way you would have connected the skipButton above. The difference is you grab the constraint that is on skipButton that you made in storyboard. The skipButton is already connected. These are the constraints that are on it and are completely different from the skipButton itself.
// the constraints are of type NSLayoutConstraint (look at the name next to skipButtonLeadingConstraint). This is what you want to change. This and the UIButton above are two completely different things
@IBOutlet weak var skipButtonLeadingConstraint: NSLayoutConstraint! // in Storyboard left constraint is set at 8 points from left side of vc
@IBOutlet weak var skipButtonTrailingConstraint: NSLayoutConstraint! // in Storyboard right constraint is set at 8 points from right side of vc
@IBOutlet weak var skipButtonHeightConstraint: NSLayoutConstraint! // in Storyboard height is set at 44 points

override func viewDidLoad() {
    super.viewDidLoad()

    // if the user is using an iPad then change the constraints to the below sizes which would make the saveButton's width smaller and also it's height taller. If the user is using anything other then an iPad then it will automatically use the Storyboard constraints and automatically ignore the below code
    if UIDevice.current.userInterfaceIdiom == .pad{

        // when using an iPad left constraint is now set at 100 points from left side of vc
        skipButtonLeadingConstraint.constant = 100

        // when using an iPad right constraint is now set at 100 points from right side of vc
        skipButtonTrailingConstraint.constant = 100

        // when using an iPad height constraint is now set at 50 points high
        skipButtonHeightConstraint.constant = 50
    }
}

下面是如何在 Storyboard 中添加 skipButtonLeadingConstraint。您可以在跳过按钮的约束下的文档大纲中抓取它（它以蓝色突出显示）

第一次选择文档大纲中的约束：

第二次将连接拖到视图控制器并将其命名为skipButtonLeadingConstraint：

第三次完成连接：