UIScrollView简单原理
2020-06-11 本文已影响0人
小矮胖是吧
注:本文只是本人学习的记录。如有错误的地方请大佬纠正、如涉嫌抄袭请联系我删除,谢谢!
原理:UIScrollView
继承于UIView
,通过添加手势来改变bounds.origin
的位置来实现滚动的效果。
提到这里我们可以来区分一下bounds
与frame
的区别
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
的滑动原理。