UIScrollView - Paul9237/Note-iOS- GitHub Wiki

内容超出屏幕时,做滑动,作用与android中大致一致。这里只针对AutoLayout的情况做处理

粗浅理解:

简单来说,ScrollView分为显示区域和内容区域
显示区域:ScrollView供用户看到的区域,这个区域的宽高是ScrollView本身的宽高
内容区域:ScrollView内部有一个contentSize的概念,这个contentSize表示实际拥有内容的宽高

举个🌰:望远镜看到的画面(除去放大效果不谈)就是现实区域,而这花花世界就是内容区域。

当内容区域的内容 ≤ 显示区域时,界面不能滑动。

针对上述内容,我觉得用法可以划分为两种:

用法1:直接将子View添加到ScrollView里

优点:少一层嵌套 缺点:需要自己算contentSize(也可能有不需要算的方法,但我不知道。知道的大佬可以告知以下便于我修正)

    [self.mScrollView setContentSize:CGSizeMake(375.0f, 1000.0f)];
    for (int i = 0; i < 10; ++i) {
        int pointX = i * 100;
        CGRect frame = CGRectMake(100, pointX, 175.0f, 20.0f);
        UILabel *label = [[UILabel alloc] initWithFrame:frame];
        [label.font fontWithSize:20];
        label.text = [NSString stringWithFormat:@"Point x = %d", pointX];
        [self.contentView addSubview:label];
    }
// width: 内容的宽度(一般屏幕宽度即可)
// height: 内容的高度

用法2:给ScrollView添加一个普通的container(UIView)作为子容器的布局,然后子View全部添加到容器中

优点:不需要计算contentSize,只要将container的约束控制好就行 缺点:需要多做一层嵌套

    UIView *container = [UIView new];
    [self.mScrollView addSubview:container];

    [container mas_makeConstraints:^(MASConstraintMaker *make) {
        make.edges.equalTo(self.mScrollView);
        make.width.equalTo(self.mScrollView); // 只约束宽度
    }];

    UIEdgeInsets padding = UIEdgeInsetsMake(100, 100, 20, 100);
    NSMutableArray<UILabel *> *labelList = [NSMutableArray new];
    for (int i = 0; i < 10; ++i) {
        UILabel *label = [UILabel new];
        label.translatesAutoresizingMaskIntoConstraints = NO;
        [label.font fontWithSize:20];
        label.text = [NSString stringWithFormat:@"Position = %d", i];
        [container addSubview:label];
        [labelList addObject:label];
        [label mas_makeConstraints:^(MASConstraintMaker *make) {
            if (i == 0) {
                make.top.equalTo(container.mas_top).offset(padding.top);
            } else {
                make.top.equalTo(labelList[(NSUInteger) (i - 1)].mas_bottom).offset(padding.top);
            }
            make.left.equalTo(container.mas_left).offset(padding.left);
            make.right.equalTo(container.mas_right).offset(padding.right);
        }];
    }

    [container mas_makeConstraints:^(MASConstraintMaker *make) {
        make.bottom.equalTo(labelList[9].mas_bottom); // container 对最下面的子View 做底部约束,起到自动拉伸的作用
    }];
⚠️ **GitHub.com Fallback** ⚠️