UIScrollView简单原理

2020-06-11  本文已影响0人  小矮胖是吧

注:本文只是本人学习的记录。如有错误的地方请大佬纠正、如涉嫌抄袭请联系我删除,谢谢!

原理:UIScrollView 继承于UIView,通过添加手势来改变bounds.origin的位置来实现滚动的效果。

提到这里我们可以来区分一下boundsframe的区别

bounds:根据自身的坐标系来设置位置和大小,当我们改变父视图的bounds.origin时会发现父视图没有变化,但子视图的位置却发生了改变.
frame:根据父视图的坐标系来设置位置和大小。

滑动

上线滑动实际是我们改变父视图的bounds.origin.y、左右滑动我们只需要改变父视图的bounds.origin.x,子视图中的试图就会出现滑动的效果。让我们用代码来说话吧:

#import "ZYScrollView.h"

@implementation ZYScrollView
- (instancetype)initWithFrame:(CGRect)frame{
    self = [super initWithFrame:frame];
    if(self){
        UIPanGestureRecognizer *pan = [[UIPanGestureRecognizer alloc]initWithTarget:self action:@selector(panAction:)];
        [self addGestureRecognizer:pan];
    }
    return self;
}
- (void)panAction:(UIPanGestureRecognizer *)pan {
    switch (_type) {
        case ScrollViewUpandDown:{//上下滑动(我们只需要获取它的Y轴偏移量)
            // 获取手指的偏移量
            CGPoint transY = [pan translationInView:pan.view];
            // 修改bounds
            CGRect bounds = self.bounds;
            bounds.origin.y -= transY.y;
            self.bounds = bounds;
            // 复位
            [pan setTranslation:CGPointZero inView:pan.view];
            break;
        }
            
        default:{//左右滑动(我们只需要获取它的X轴的偏移量即可)
             // 获取手指的偏移量
            CGPoint transX = [pan translationInView:pan.view];
            CGRect bounds = self.bounds;
            bounds.origin.x -= transX.x;
            self.bounds = bounds;
            [pan setTranslation:CGPointZero inView:pan.view];
            break;
        }
    }
}

具体的实现

#import "ScrollViewController.h"
#import "ZYScrollView.h"
@interface ScrollViewController ()
@property (nonatomic, strong) ZYScrollView * upScrollView;
@property (nonatomic, strong) ZYScrollView * aboutScrollView;
@end

@implementation ScrollViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    self.view.backgroundColor = [UIColor whiteColor];
    self.upScrollView = [[ZYScrollView alloc] initWithFrame:CGRectMake(0, 0, YSCREEN_WIDTH, YSCREEN_HEIGHT/2)];
    self.upScrollView.type = ScrollViewUpandDown;
    [self.view addSubview:self.upScrollView];
    self.aboutScrollView = [[ZYScrollView alloc] initWithFrame:CGRectMake(0, YSCREEN_HEIGHT/2, YSCREEN_WIDTH, YSCREEN_HEIGHT/2)];
    self.aboutScrollView.type = ScrollViewabout;
    [self.view addSubview:self.aboutScrollView];
    UIView * redView = [[UIView alloc] initWithFrame:CGRectMake(50, 100, 100, 100)];
    redView.backgroundColor = [UIColor redColor];
    [self.upScrollView addSubview:redView];
    UIView * blueView = [[UIView alloc] initWithFrame:CGRectMake(50, 100, 100, 100)];
    blueView.backgroundColor = [UIColor blueColor];
    [self.aboutScrollView addSubview:blueView];
}
@end

这样我们基本就完成视图的滑动,还有很多可以改进与优化的地方这里只是简单的向大家展示了UIScrollView的滑动原理。

上一篇下一篇

猜你喜欢

热点阅读