IOS UIScrollView詳解 & 圖片縮放功能

一 UIScrollView 簡介

UIScrollView是能滾動的視圖控件，能夠經過滾動的方式來展現類容。

二 UIScrollView常見屬性

//設置UIScrollView滾動的位置
@property(nonatomic) CGPoint contentOffset; 

//設置UIScrollView內容的尺寸，滾動範圍
@property(nonatomic) CGSize contentSize; 

//設置UIScrollView的4周增長額外的滾動區域
@property(nonatomic) UIEdgeInsets contentInset; 

//設置UIScrollView是否須要彈簧效果
@property(nonatomic) BOOL bounces;

//設置UIScrollView是否能滾動
@property(nonatomic,getter=isScrollEnabled) BOOL scrollEnabled; 

//設置UIScrollView是否顯示水平滾動條
@property(nonatomic) BOOL showsHorizontalScrollIndicator;

//設置UIScrollView是否顯示垂直滾動條
@property(nonatomic) BOOL showsVerticalScrollIndicator;

三 UIScrollView 代理（delegate）

UIScrollView在滾動過程當中 或者 中止滾動 時，若是須要作一些特定的操做，可用經過設置代理的方式（delegate）來監聽UIScrollView的整個滾動過程，當UIScrollView發生一系列的滾動操做時， 會自動通知它的代理（delegate）對象，而後經過代理來監聽UIScrollView的滾動過程。

UIScrollView將delegate須要實現的方法都定義在UIScrollViewDelegate協議中，所以UIScrollView的delegate必須遵照UIScrollViewDelegate協議，而後實現協議中相應的方法，就能夠監聽UIScrollView的滾動過程

// 用戶開始拖拽時調用
- (void)scrollViewWillBeginDragging:(UIScrollView *)scrollView;

// 滾動到某個位置時調用
- (void)scrollViewDidScroll:(UIScrollView *)scrollView;

// 用戶結束拖拽時調用
- (void)scrollViewDidEndDragging:(UIScrollView *)scrollView willDecelerate:(BOOL)decelerate;

四 內容縮放

UIScrollView不只能滾動顯示大量內容，還能對其內容進行縮放處理

當在UIScrollView身上使用捏合手勢時，UIScrollView會調用代理（delegate）的viewForZoomingInScrollView方法，這個方法返回的控件就是須要進行縮放的控件，縮放涉及的屬性和方法

/****屬性****/
//縮小的對小比例
@property(nonatomic) CGFloat minimumZoomScale;

//放大的最大比例
@property(nonatomic) CGFloat maximumZoomScale;    



/****方法****/
//縮放時調用
- (UIView *)viewForZoomingInScrollView:(UIScrollView *)scrollView;

//開始縮放的時候調用 
- (void)scrollViewWillBeginZooming:(UIScrollView *)scrollView withView:(UIView *)view

//正在縮放的時候調用
- (void)scrollViewDidZoom:(UIScrollView *)scrollView

五 UIScrollView沒法滾動的解決辦法

若是UIScrollView沒法滾動，多是如下緣由：

5.1 沒有設置contentSize屬性

5.2 設置屬性scrollEnabled = NO

5.3 沒有接收到觸摸事件（userInteractionEnabled = NO）

5.4 取消autolayout功能,要想scrollView滾動，必須取消autolayout

六 代碼區

6.1 代碼

#import "ViewController.h"

@interface ViewController ()<UIScrollViewDelegate>
/**
 *UIScrollView
 */
@property(nonatomic,strong)UIScrollView *scrollView;

/**
 *  UIImageView
 */
@property(nonatomic,strong)UIImageView *imageView;
@end

@implementation ViewController
- (void)viewDidLoad {
    
    //2.設置 UIImageView

    UIImage *image = [UIImage imageNamed:@"scroll.jpg"];
    self.imageView.image = image;
    
    //2.1 設置圖片範圍
    CGFloat imageH = image.size.height;
    CGFloat imageW = image.size.width;
    CGFloat imageX = 0;
    CGFloat imageY = 0;
    self.imageView.frame = CGRectMake(imageX, imageY, imageW, imageH);
    
    

    //3 設置UIScrollView 屬性
    
    //3.2 設置UIScrollView內容的尺寸，滾動範圍
    self.scrollView.contentSize=CGSizeMake(imageW, imageH);
    
    //3.2 設置UIScrollView的4周增長額外的滾動區域
    CGFloat distance = 100.0f;
    self.scrollView.contentInset = UIEdgeInsetsMake(distance, distance, distance, distance);
    
    //3.3 設置彈簧效果
    self.scrollView.bounces = YES;
    
    //3.4 設置滾動不顯示
    self.scrollView.showsHorizontalScrollIndicator=NO;
    self.scrollView.showsVerticalScrollIndicator=NO;
    
    
    
    
    //4 UIImageView 添加到 UIScrollView 中
    [self.scrollView addSubview:self.imageView];
    
    //5 UIScrollView
    [self.view addSubview:self.scrollView];
    
    
    //6 設置代理
    self.scrollView.delegate = self;
    
    
    //7 縮放
    self.scrollView.minimumZoomScale=0.2f;
    self.scrollView.maximumZoomScale=2.0f;
    
}

#pragma mark 代理方法
// 用戶開始拖拽時調用
- (void)scrollViewWillBeginDragging:(UIScrollView *)scrollView
{
    NSLog(@"開始拖拽");
}

// 滾動到某個位置時調用
- (void)scrollViewDidScroll:(UIScrollView *)scrollView
{
    NSLog(@"拖拽中");
}

// 用戶結束拖拽時調用
- (void)scrollViewDidEndDragging:(UIScrollView *)scrollView willDecelerate:(BOOL)decelerate
{
    NSLog(@"結束拖拽");
}




#pragma mark 縮放
/**
 *  縮放結束時調用
 *
 *  @param scrollView <#scrollView description#>
 *
 *  @return <#return value description#>
 */
- (UIView *)viewForZoomingInScrollView:(UIScrollView *)scrollView
{
    NSLog(@"開始縮放");
    return self.imageView;
}


/**
 *  縮放過程當中調用
 *
 *  @param scrollView <#scrollView description#>
 */
- (void)scrollViewDidZoom:(UIScrollView *)scrollView
{
    NSLog(@"正在縮放");
}



/**
 *  縮放結束時調用
 *
 *  @param scrollView <#scrollView description#>
 *  @param view       <#view description#>
 *  @param scale      <#scale description#>
 */
- (void)scrollViewDidEndZooming:(UIScrollView *)scrollView withView:(UIView *)view atScale:(CGFloat)scale
{
    NSLog(@"縮放結束");
}





#pragma mark 屬性get方法

- (UIScrollView *)scrollView
{
    if (!_scrollView) {
        _scrollView = [[UIScrollView alloc] initWithFrame:self.view.frame];
    }
    return _scrollView;
}



- (UIImageView *)imageView
{
    if (!_imageView) {
        _imageView = [[UIImageView alloc] init];
    }
    return _imageView;
}



@end

6.2 展現

縮放前                                              縮放後