UIScrollView的基本使用方法和注意事项 - iOS - UI基础知识总结10

1、UIScrollView为了显示多于一个屏幕的内容,UIScrollView为你处理缩小放大手势,并且替你处理对于它们的探测和回应。
2、contentsize.width是内容的宽度，contentsize.heght是内容的高度，contentsize是UIScrollView的一个属性，它是CGSize类型，是由核心图形所定义的架构，它定义了可以滚动的内容的宽度和高度。

3、在滚轴视图中，有一个叫做ContentOffset的属性跟踪UIScrollView的具体位置，你能够自己获取和设置它，ContentOffset是你当前可视内容相对于滚轴视图边界左上角那个点的位置的偏移量；这个点不是从contentInset的左上角开始的，而是内容的左上角，ContentOffset有时是正值，但有时也是负值。

先在.h文件中声明两个属性（记得在.m中释放内存）

<span style="font-size:18px;">#import <UIKit/UIKit.h>@interface RootViewController : UIViewController@property (nonatomic, retain) UIScrollView *myScrollView;@property (nonatomic, retain) UIButton *myButton;@end</span>

释放内存

<span style="font-size:18px;">- (void)dealloc{    [_myScrollView release];    [_myButton release];    [super dealloc];}</span>

下面通过程序介绍UIScrollView的详细用法

<span style="font-size:18px;">// 创建一张图片    UIImage *image = [UIImage imageNamed:@"image"];    UIImageView *imageView = [[UIImageView alloc]initWithImage:image];// 用该步骤可以省略下面这行代码    // imageView.frame = CGRectMake(0, 0, image.size.width, image.size.height);        // 添加scrollView    self.myScrollView = [[UIScrollView alloc]initWithFrame:CGRectMake(20, 100, 335, 355)];    self.myScrollView.backgroundColor = [UIColor redColor];    [self.view addSubview:self.myScrollView];    [self.myScrollView release];        // 把imageView添加到scrollView上    [self.myScrollView addSubview:imageView];    [imageView release];        // 设置scrollView的内容大小(滚动范围)    self.myScrollView.contentSize = CGSizeMake(image.size.width, image.size.height);        // 设置scrollView滑动到边缘的时候有没有弹簧效果（默认是YES）//    self.myScrollView.bounces = NO;        // 设置scrollView滑动时横向条和纵向条（indicator）是否显示（默认是YES）//    self.myScrollView.showsHorizontalScrollIndicator = NO;//    self.myScrollView.showsVerticalScrollIndicator = NO;        // 设置indicator的风格    self.myScrollView.indicatorStyle = UIScrollViewIndicatorStyleWhite;        // 设置scrollView滑动到边缘时内容距离边界的偏移量    self.myScrollView.contentInset = UIEdgeInsetsMake(10, 10, 10, 10);    // 设置scrollView滑动时横向条和纵向条（indicator）显示的位置距离边界的偏移量    self.myScrollView.scrollIndicatorInsets = UIEdgeInsetsMake(10, 10, 10, 10);        // 控制内容是否可以滑动//    self.myScrollView.scrollEnabled = NO;        // 展现indicator//    [self.myScrollView flashScrollIndicators];        // 设置一次滚动只能进行横向滚动或纵向滚动中的一种    self.myScrollView.directionalLockEnabled = YES;// 设置成YES时，试图锁定垂直或水平滚动        // 是否打开分页效果（常与UIPageControl结合使用）    self.myScrollView.pagingEnabled = YES;</span>

除了这些常用的属性之外，UIScollView还有其他一些不常用的属性：

BOOL dragging 是否正在被拖拽
     BOOL tracking 当touch后还没有拖动的时候值是YES，否则NO
     BOOL decelerating 正在减速，手指放开但是内容还在继续滚动中，这个时候是 YES，其它时候是 NO
     BOOL zooming 当正在缩放的时候值是 YES，否则 NO（是否正在缩放）
     BOOL zoomBouncing 当内容放大到最大或者最小的时候值是 YES，否则 NO
     BOOL pagingEnabled 当值是 YES 会自动滚动到 subview 的边界。默认是NO
     
     decelerationRate 设置手指放开后的减速率
     
     delaysContentTouches
     是个布尔值，当值是 YES 的时候，用户触碰开始，scroll view要延迟一会，看看是否用户有意图滚动。假如滚动了，那么捕捉 touch-down 事件，否则就不捕捉。假如值是NO，当用户触碰， scroll view 会立即触发 touchesShouldBegin:withEvent:inContentView:，默认是 YES
     
     canCancelContentTouches
     当值是 YES 的时候，用户触碰后，然后在一定时间内没有移动，scrollView 发送 tracking events，然后用户移动手指足够长度触发滚动事件，这个时候，scrollView 发送了 touchesCancelled:withEvent: 到 subview，然后 scroView 开始滚动。假如值是 NO，scrollView 发送 tracking events 后，就算用户移动手指，scrollView 也不会滚动。
     
     bounces
     默认是 yes，就是滚动超过边界会反弹有反弹回来的效果。假如是 NO，那么滚动到达边界会立刻停止。
     
     bouncesZoom
     和 bounces 类似,区别在于：这个效果反映在缩放上面，假如缩放超过最大缩放，那么会反弹效果；假如是 NO，则到达最大或者最小的时候立即停止。
     
     directionalLockEnabled
     默认是 NO，可以在垂直和水平方向同时运动。当值是 YES 时，假如一开始是垂直或者是水平运动，那么接下来会锁定另外一个方向的滚动。 假如一开始是对角方向滚动，则不会禁止某个方向
     
      UIScrollView 要想实现缩放和平移，必须实现委托方法 - (UIView *)viewForZoomingInScrollView:(UIScrollView *)scrollView  和  - (void)scrollViewDidEndZooming:(UIScrollView *)scrollView withView:(UIView *)view atScale:(CGFloat)scale

要想实现图片的缩放和滚动们就要实现对应的代理方法

首先要添加代理

<span style="font-size:18px;">// scrollView 的缩放    self.myScrollView.delegate = self;// 添加代理    self.myScrollView.maximumZoomScale = 2.0;// 放大的最大倍数    self.myScrollView.minimumZoomScale = 0.2;// 缩小的最小倍数</span>

然后实现对应的两个代理方法

<span style="font-size:18px;">// 缩放的代理方法#pragma mark - UIScrollView Delegate// 告诉我们要缩放scrollView里面的哪一个视图- (UIView *)viewForZoomingInScrollView:(UIScrollView *)scrollView{    // 只有一张图，选第一个就行    return [self.myScrollView.subviews firstObject];}// 缩放之后要进行的操作- (void)scrollViewDidEndZooming:(UIScrollView *)scrollView withView:(UIView *)view atScale:(CGFloat)scale{    // 设置图片的中心点的时候：不要用myScrollView的center，因为myScrollView的center是相对于myScrollView的父视图的，而imageView的center是相对于myScrollView的    NSLog(@"scrollFrame = %.2f , %.2f" , self.myScrollView.frame.size.width / 2, self.myScrollView.frame.size.height / 2);    NSLog(@"center = %.2f , %.2f" , self.myScrollView.center.x, self.myScrollView.center.y);        ((UIImageView *)[self.myScrollView.subviews firstObject]).center = CGPointMake(self.myScrollView.frame.size.width / 2, self.myScrollView.frame.size.height / 2);}</span>

对于contentOffset这个属性，我们可以通过设置一个button，然后添加点击方法来看看它有什么作用

<span style="font-size:18px;">self.myButton = [UIButton buttonWithType:UIButtonTypeSystem];        self.myButton.frame = CGRectMake(160, 500, 80, 50);        [self.myButton setTitle:@"点击" forState:UIControlStateNormal];        self.myButton.backgroundColor = [UIColor redColor];        [self.view addSubview:self.myButton];        // 给myButton添加点击事件    [self.myButton addTarget:self action:@selector(myButtonAction:) forControlEvents:UIControlEventTouchUpInside];</span>

实现点击事件

<span style="font-size:18px;">#pragma mark - myButtonAction- (void)myButtonAction:(UIButton *)sender{    // 在多少秒内完成一个动画    [UIView animateWithDuration:1.0 animations:^{        CGPoint newPoint = self.myScrollView.contentOffset;        newPoint = CGPointMake(newPoint.x, newPoint.y + 150);        self.myScrollView.contentOffset = newPoint;    }];}</span>

下面说一下UIScrollView的主要代理（委托）方法

<span style="font-size:18px;">// 返回一个放大或者缩小的视图 - (UIView *)viewForZoomingInScrollView:(UIScrollView *)scrollView {  }  // 开始放大或者缩小 - (void)scrollViewWillBeginZooming:(UIScrollView *)scrollView withView: (UIView *)view {  }  // 缩放结束时 - (void)scrollViewDidEndZooming:(UIScrollView *)scrollView withView:(UIView *)view atScale:(float)scale {  }  // 视图已经放大或缩小 - (void)scrollViewDidZoom:(UIScrollView *)scrollView {  }// 是否支持滑动至顶部- (BOOL)scrollViewShouldScrollToTop:(UIScrollView *)scrollView{    return YES;}// 已经滑动到顶部- (void)scrollViewDidScrollToTop:(UIScrollView *)scrollView{ }// scrollView 已经滑动- (void)scrollViewDidScroll:(UIScrollView *)scrollView{ }// scrollView 将要开始拖动- (void)scrollViewWillBeginDragging:(UIScrollView *)scrollView{ }// scrollView 结束拖动（完成拖动）- (void)scrollViewDidEndDragging:(UIScrollView *)scrollView willDecelerate:(BOOL)decelerate{ }// scrollView 将要开始减速- (void)scrollViewWillBeginDecelerating:(UIScrollView *)scrollView{ }// scrollview 减速停止（完成减速）- (void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView{ }</span>

UIScrollView经常与UIPageControl配合使用，下一篇将着重介绍他们之间 的配合使用。