UIScrollView的简单使用



一、 基本使用

1. 作用

UIScrollView可以用于显示多于一个屏幕的内容，超出屏幕范围的内容可以通过滑动进行查看

 

2. 常见属性

l CGSize contentSize ：设置UIScrollView的滚动范围

l CGPoint contentOffset ：UIScrollView当前滚动的位置

l UIEdgeInsets contentInset ：这个属性可以在四周增加滚动范围

 

 

3. 其他属性

l BOOL bounces是否有弹簧效果

l BOOL scrollEnabled是否能滚动

l BOOL showsHorizontalScrollIndicator是否显示水平方向的滚动条

l BOOL showsVerticalScrollIndicator     是否显示垂直方向的滚动条

l UIScrollViewIndicatorStyle indicatorStyle  设定滚动条的样式

l BOOL dragging 是否正在被拖拽

l BOOL tracking  当touch后还没有拖动的时候值是YES，否则NO

l BOOL decelerating 是否正在减速

l BOOL zooming 是否正在缩放

 

二、 手势缩放

1. 设置UIScrollView的id<UISCrollViewDelegate> delegate代理对象  （如果控制器承当代理对象需要遵从协议）

2. 设置minimumZoomScale ：缩小的最小比例

3. 设置maximumZoomScale ：放大的最大比例

4. 让代理对象实现下面的方法，返回需要缩放的视图控件

- (UIView *)viewForZoomingInScrollView:(UIScrollView *)scrollView

l 跟缩放相关的常用方法还有

u 正在缩放的时候调用

-(void)scrollViewDidZoom:(UIScrollView *)scrollView

u 缩放完毕的时候调用

-(void)scrollViewDidEndZooming:(UIScrollView *)scrollView withView:(UIView *)view atScale:(float)scale

#import "MJViewController.h"

@interface MJViewController () <UIScrollViewDelegate>
{
 
   UIImageView *_imageView;

}

@end

@implementation MJViewController

- (void)viewDidLoad
{
    [super viewDidLoad];

   
    // 1.添加UIScrollView

    UIScrollView *scrollView = [[UIScrollView alloc] init];

//    scrollView.frame = CGRectMake(0, 0, 320, 460);

    scrollView.frame = self.view.bounds;

    [self.view addSubview:scrollView];

   
    // 2.添加图片

    UIImage *image = [UIImage imageNamed:@"big.jpg"];

    // 调用initWithImage:方法创建出来的UIImageView，它的宽高默认跟图片的宽高一样

    _imageView = [[UIImageView alloc] initWithImage:image];
//    // 设置图片
//
    imageView.image = [UIImage imageNamed:@"big.jpg"];

//   
//    // 设置frame
//
    imageView.frame = CGRectMake(0, 0, imageView.image.size.width, imageView.image.size.height);

    [scrollView addSubview:_imageView];

   
    // 设置内容范围

    scrollView.contentSize = image.size;

   
    // 设置scrollview的代理对象

    scrollView.delegate = self;

   
    // 设置最大伸缩比例

    scrollView.maximumZoomScale = 2.0;

    // 设置最小伸缩比例

    scrollView.minimumZoomScale = 0.2;
}

#pragma mark - UIScrollView 的 代理方法

#pragma mark 这个方法返回的控件就能进行捏合手势缩放操作

#pragma mark 当UIScrollView尝试进行缩放的时候就会调用

- (UIView *)viewForZoomingInScrollView:(UIScrollView *)scrollView
{

    return _imageView;

}

#pragma mark 当缩放完毕的时候调用

- (void)scrollViewDidEndZooming:(UIScrollView *)scrollView withView:(UIView *)view atScale:(float)scale
{

//    NSLog(@"结束缩放 - %f", scale);

}

#pragma mark 当正在缩放的时候调用

- (void)scrollViewDidZoom:(UIScrollView *)scrollView
{

//    NSLog(@"-----");

}
@end
 

三、 分页效果

l 设置pagingEnabled=YES即可，UIScrollView会被分割成多个独立页面，用户的滚动体验则变成了页面翻转

l 一般会配合UIPageControl增强分页效果，UIPageControl常用属性：

u NSInteger numberOfPages : 总页数

u NSInteger currentPage : 当前的页码

u BOOL hidesForSinglePage : 当只有一页的时候，是否要隐藏视图

l 监听UIPageControl的页面改变：

// 添加监听器

[pageControl addTarget:self action:@selector(pageChange:) 

forControlEvents:UIControlEventValueChanged];

// 监听方法

- (void)pageChange:(UIPageControl *)pageControl 

{  

}

#import "MJViewController.h"

#define kCount 8     //page的页数
@interface MJViewController () <UIScrollViewDelegate>
{
 
   UIPageControl *_pageControl;

}

@property (weak, nonatomic) IBOutlet UIScrollView *scrollView;
@implementation MJViewController
- (void)viewDidLoad
{

    [super viewDidLoad]; 
    CGFloat w = self.view.frame.size.width;

    CGFloat h = self.view.frame.size.height;

    for (int i = 0; i< kCount; i++) {

        UIImageView *imageView = [[UIImageView alloc] init];    
        // 1.设置frame

        imageView.frame = CGRectMake(i * w, 0, w, h);      
        // 2.设置图片

        NSString *imgName = [NSString stringWithFormat:@"0%d.jpg", i + 1];
        imageView.image = [UIImage imageNamed:imgName];        
        [_scrollView addSubview:imageView];

    }   
    // height == 0 代表 禁止垂直方向滚动

    _scrollView.contentSize = CGSizeMake(kCount * w, 0);

    _scrollView.showsHorizontalScrollIndicator = NO;

    _scrollView.pagingEnabled = YES;

    _scrollView.delegate = self;

   
    // 添加PageControl

    UIPageControl *pageControl = [[UIPageControl alloc] init];

    pageControl.center = CGPointMake(w * 0.5, h - 20);

    pageControl.bounds = CGRectMake(0, 0, 150, 50);

    pageControl.numberOfPages = kCount;
 // 一共显示多少个圆点（多少页）

    // 设置非选中页的圆点颜色

    pageControl.pageIndicatorTintColor = [UIColor redColor];

    // 设置选中页的圆点颜色

    pageControl.currentPageIndicatorTintColor = [UIColor blueColor];   
    // 禁止默认的点击功能

    pageControl.enabled = NO;    
    [self.view addSubview:pageControl];

    _pageControl = pageControl;
}

#pragma mark - UIScrollView的代理方法

#pragma mark 当scrollView正在滚动的时候调用

- (void)scrollViewDidScroll:(UIScrollView *)scrollView
{

    int page = scrollView.contentOffset.x / scrollView.frame.size.width;

//    NSLog(@"%d", page);   

  // 设置页码
    _pageControl.currentPage = page;

}
@end