iOS，布局位置取决于屏幕尺寸问题

Posted 2023-02-27

【中文标题】iOS，布局位置取决于屏幕尺寸问题

【英文标题】：iOS, layout position depending on screen size issue

【发布时间】：2015-11-23 23:11:30

【问题描述】：

我正在尝试优化应用程序在不同屏幕尺寸下的外观以及我所做的任何事情，不知何故，在.xib 中，当我从 6splus->6s->5 切换时，我无法防止发生一些布局错位iPhone 模拟器。我正在尝试修复从标签到图像视图（用作背景）的空间，然后根据设备缩放字体。尽管我设置了约束，但它们不知何故被弄乱了，并且没有从一种屏幕尺寸强制执行到另一种屏幕尺寸。

6splus 长这样：

这里你可以看到从右边看定位是完全错误的，尽管.xib中设置了正确的间距

然后，进入6s：

看起来还不错（因为我一开始优化了6s）

注意它是如何从右向左移动的。我绝对想阻止它发生。

然后，iPhone 5：

完全向左移动。也不知何故，一周中的红色日期和天数之间的间距增加了。这是我真正想要避免发生的第二件事。第三件事是左下角的标签：它有点移动，我需要再放两个标签，所以避免它也移动非常重要。

这是我的.xib 的屏幕截图，带有约束：

.xib 是我在UITableView 中使用的可自定义UITableViewCell。

下图按标签显示约束：

UIImageView（背景）约束：

任何建议将不胜感激。

【问题讨论】：

哪个项目被限制在前缘或后缘/边距？ “Event Day Num”仅限于位置和工作日标签的中心。其中之一是否受限于前导/尾随？

我用额外的截图更新了这个问题，请看一下。另外，对于左下角的标签，我也想避免移动。

我也在动态更改字体，但这并不重要，因为即使我为所有屏幕尺寸设置它们也会发生同样的事情。

我认为你的约束太复杂了。我为自己设置了一个快速测试；我做的第一件事是在图像视图的右侧创建一个 UIView，然后将日期/日期和底部标签放入其中。我将左侧图像设置为内容视图单元格的 3/4，然后将 UIView 与图像右侧的标签及其包含视图的后沿约束。然后我为内容视图中的标签设置约束

嗨，我想你可以试着把每一组东西放到一个 UIView 中，然后你先布局那个视图，因为你的一组东西，一次布局一堆东西会很容易被固定到你的 UIView

【参考方案1】：

所以，我最终要做的是为 4 个不同的约束创建 4 个出口：

1. @property (weak, nonatomic) IBOutlet NSLayoutConstraint *eventNameBottomMargin;
2. @property (weak, nonatomic) IBOutlet NSLayoutConstraint *eventNameLeftMargin;
3. @property (weak, nonatomic) IBOutlet NSLayoutConstraint *bottomMarginConstraint;
4. @property (weak, nonatomic) IBOutlet NSLayoutConstraint *rightMarginConstraint;

约束 1,2 用于左下角的UILabel；约束 3,4 用于右侧的 UILabels：使用 Tj3n 的建议我将它们放在 UIView 中，因此 3,4 是 UIView 相对于背景 UIImageView 的约束.

然后我根据设备宽度更改了代码中约束的值：

- (void)awakeFromNib

[super awakeFromNib];
CGRect screenRect = [[UIScreen mainScreen] bounds];
NSNumber *screenWidth = @(screenRect.size.width);
[self setFontsOnDeviceWithScreenWidth:screenWidth];

int rightMargin = 15;
int bottomMargin = -105;
int nameLeftMargin = 55;
int nameBottomMargin = -33;

if (screenWidth.intValue == 320) 
    // iPhone 5 screenWidth = "320"
    rightMargin = 5;
    bottomMargin = -105;
    nameLeftMargin = 50;
    nameBottomMargin = -36;
 else if(screenWidth.intValue == 375) 
    // iPhone 6s
    rightMargin = 15;
    bottomMargin = -105;
    nameLeftMargin = 80;
    nameBottomMargin = -30;
 else if(screenWidth.intValue == 414) 
    // iPhone 6s Plus
    rightMargin = 35;
    bottomMargin = -108;
    nameLeftMargin = 100;
    nameBottomMargin = -30;

self.rightMarginConstraint.constant = rightMargin;
self.bottomMarginConstraint.constant = bottomMargin;
self.eventNameLeftMargin.constant = nameLeftMargin;
self.eventNameBottomMargin.constant = nameBottomMargin;

我不认为这是解决问题的最佳方法，但它运行良好。应该有一种方法来指定约束，然后自动调整大小，所以如果有人知道，请分享进一步的想法。