如何通过代码让UIScrollView在各iPhone机型上外观统一

兄弟，我太懂这种跨机型布局崩掉的痛苦了！纯代码搞UIScrollView适配，核心就是把Auto Layout用对——UIScrollView的布局逻辑和普通View有点不一样，踩过坑的都懂。下面给你一步步来搞定：

1. 先给UIScrollView本身设置正确的约束 #

首先要把UIScrollView牢牢固定在父视图上，不管屏幕尺寸怎么变，它的边界都和父视图一致，代码示例：

// 初始化UIScrollView
UIScrollView *scrollView = [[UIScrollView alloc] init];
scrollView.translatesAutoresizingMaskIntoConstraints = NO; // 必须关闭自动转换约束
scrollView.showsVerticalScrollIndicator = YES;
[self.view addSubview:scrollView];

// 设置scrollView与父视图的约束
[NSLayoutConstraint activateConstraints:@[
    scrollView.topAnchor constraintEqualToAnchor:self.view.topAnchor,
    scrollView.leadingAnchor constraintEqualToAnchor:self.view.leadingAnchor,
    scrollView.trailingAnchor constraintEqualToAnchor:self.view.trailingAnchor,
    scrollView.bottomAnchor constraintEqualToAnchor:self.view.bottomAnchor
]];

2. 给UIScrollView添加一个容器View（关键！） #

UIScrollView的滚动区域是由子视图的大小决定的，但直接给按钮加约束容易出问题，最好加一个容器View，把所有按钮都放在这个容器里，再给容器设置约束，让scrollView能正确计算滚动范围：

// 创建容器View
UIView *contentView = [[UIView alloc] init];
contentView.translatesAutoresizingMaskIntoConstraints = NO;
[scrollView addSubview:contentView];

// 给容器View设置约束：和scrollView的上下左右对齐，宽度和scrollView一致（避免横向滚动，需要横向滚动可去掉这条）
[NSLayoutConstraint activateConstraints:@[
    contentView.topAnchor constraintEqualToAnchor:scrollView.topAnchor,
    contentView.leadingAnchor constraintEqualToAnchor:scrollView.leadingAnchor,
    contentView.trailingAnchor constraintEqualToAnchor:scrollView.trailingAnchor,
    contentView.bottomAnchor constraintEqualToAnchor:scrollView.bottomAnchor,
    contentView.widthAnchor constraintEqualToAnchor:scrollView.widthAnchor
]];

3. 用Auto Layout布局10个按钮 #

把按钮放在contentView里，用约束控制它们的位置、大小，保证不同屏幕上的比例和间距一致。比如垂直排列按钮，固定高度、左右边距和上下间距：

UIView *previousButton = nil;
CGFloat buttonHeight = 60;
CGFloat horizontalMargin = 20;
CGFloat verticalSpacing = 15;

for (int i = 0; i < 10; i++) {
    UIButton *button = [[UIButton alloc] init];
    button.translatesAutoresizingMaskIntoConstraints = NO;
    button.backgroundColor = [UIColor systemBlueColor];
    [button setTitle:[NSString stringWithFormat:@"按钮 %d", i+1] forState:UIControlStateNormal];
    [contentView addSubview:button];
    
    // 设置按钮约束
    NSMutableArray *constraints = [NSMutableArray array];
    // 左右边距
    [constraints addObject:[button.leadingAnchor constraintEqualToAnchor:contentView.leadingAnchor constant:horizontalMargin]];
    [constraints addObject:[button.trailingAnchor constraintEqualToAnchor:contentView.trailingAnchor constant:-horizontalMargin]];
    // 固定高度
    [constraints addObject:[button.heightAnchor constraintEqualToConstant:buttonHeight]];
    
    // 第一个按钮贴contentView顶部，后续按钮贴前一个按钮底部
    if (previousButton == nil) {
        [constraints addObject:[button.topAnchor constraintEqualToAnchor:contentView.topAnchor constant:verticalSpacing]];
    } else {
        [constraints addObject:[button.topAnchor constraintEqualToAnchor:previousButton.bottomAnchor constant:verticalSpacing]];
    }
    
    [NSLayoutConstraint activateConstraints:constraints];
    previousButton = button;
}

// 最后一个按钮贴contentView底部，让contentView高度自动计算
[NSLayoutConstraint activateConstraints:@[
    previousButton.bottomAnchor constraintEqualToAnchor:contentView.bottomAnchor constant:-verticalSpacing
]];

4. 处理刘海屏的安全区域 #

对于iPhone X及以后的刘海机型，要确保内容不被状态栏、导航栏或底部安全区挡住，如果页面有导航栏，把scrollView的约束改成和安全区对齐：

// 替换之前的scrollView顶部和底部约束
[NSLayoutConstraint activateConstraints:@[
    scrollView.topAnchor constraintEqualToAnchor:self.view.safeAreaLayoutGuide.topAnchor,
    scrollView.leadingAnchor constraintEqualToAnchor:self.view.leadingAnchor,
    scrollView.trailingAnchor constraintEqualToAnchor:self.view.trailingAnchor,
    scrollView.bottomAnchor constraintEqualToAnchor:self.view.safeAreaLayoutGuide.bottomAnchor
]];

5. 验证布局的小技巧 #

• 给contentView设置浅灰色背景，直观查看它的范围是否正确
• 用Xcode的Debug View Hierarchy查看约束，及时修正红色警告或错误

这样操作后，你的UIScrollView在从iPhone 5s到iPhone X的所有模拟器里，布局都会保持一致——按钮的大小、间距、位置都会自适应不同屏幕尺寸，滚动区域也会正确计算。

内容的提问来源于stack exchange，提问作者user9713861