Xcode控件使用筆記三:UIScrollView 查看大圖、縮放、分頁

1、簡單實用

    UIImage *image = [UIImage imageNamed:@"ipad.png"];
    UIImageView *imageView = [[UIImageView alloc] initWithImage:image];
    // 設置內容的寬高(滾動範圍)
    self.scroll.contentSize = image.size;
    
    // 增加滾動範圍
    self.scroll.contentInset = UIEdgeInsetsMake(0,0,0,40);
    self.scroll.backgroundColor = [UIColor grayColor];
    // 可視範圍
    //self.scroll.frame.size
    [self.scroll addSubview:imageView];


2、縮放:用到代理 UIScrollViewDelegate協議

 // 創建UIScrollView
    UIScrollView *scroll = [[UIScrollView alloc] init];
    scroll.frame = self.view.bounds;
    scroll.backgroundColor = [UIColor grayColor];
    [self.view addSubview:scroll];
    
    // 添加圖片
    UIImageView *imageView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"ipad.png"]];
    
    [scroll addSubview:imageView];
    
    // 設置scroll的滾動範圍
    scroll.contentSize = imageView.frame.size;
    // 增加滾動範圍--額外的
    //self.scroll.contentInset = UIEdgeInsetsMake(0, 0, 0, 40);
    //self.scroll.backgroundColor = [UIColor grayColor];
    // 設置代理
    scroll.delegate = self;
    self.imageView = imageView;
    // 最大縮放比例是2
    scroll.maximumZoomScale = 2;
    // 最小縮放比例0.5
    scroll.minimumZoomScale = 0.5;


#pragma mark - UIScrollView的代理方法
#pragma mark 返回需要進行縮放的控件(必須是UIScrollView的子控件)
- (UIView *)viewForZoomingInScrollView:(UIScrollView *)scrollView
{
    return self.imageView;
}


3、分頁 

//
//  ViewController.m
//  02-UIScrollView-分頁
//
//  Created by T-60 on 15/5/13.
//  Copyright (c) 2015年 com.zhang. All rights reserved.
//
#define kCount 5
#import "ViewController.h"

@interface ViewController ()
{
    UIPageControl *_control;
    UIScrollView *_scroll;
}
@end

@implementation ViewController

- (void)viewDidLoad
{
    [super viewDidLoad];
	
    // 1.添加UIScrollView
    UIScrollView *scroll = [[UIScrollView alloc] init];
    scroll.frame = self.view.bounds;
    [self.view addSubview:scroll];
    _scroll = scroll;
    
    CGFloat scrollWdith = scroll.frame.size.width;
    CGFloat scrollHeight = scroll.frame.size.height;
    
    // 2.添加所有的ImageView
    for (int i = 1; i<=kCount; i++) {
        // 加載圖片
        NSString *imageName = [NSString stringWithFormat:@"pages.bundle/%d.jpg", i];
        UIImage *image = [UIImage imageNamed:imageName];
        // 創建UIImageView
        UIImageView *imageView = [[UIImageView alloc] init];
        imageView.image = image;
        
        CGFloat x = (i - 1) * scrollWdith;
        imageView.frame = CGRectMake(x, 0, scrollWdith, scrollHeight);
        
        // 添加ImageView
        [scroll addSubview:imageView];
    }
    
    // 3.設置滾動範圍
    scroll.contentSize = CGSizeMake(kCount * scrollWdith, 0);
    
    // 隱藏水平滾動條
    scroll.showsHorizontalScrollIndicator = NO;
    
    // 4.開啓分頁功能
    scroll.pagingEnabled = YES;
    
    
    // 5.添加PageControl
    UIPageControl *pageControl = [[UIPageControl alloc] init];
    pageControl.bounds = CGRectMake(0, 0, 150, 50);
    pageControl.center = CGPointMake(scrollWdith * 0.5, scrollHeight - 50);
    // 設置頁數
    pageControl.numberOfPages = kCount;
    // 當前選中頁碼的顏色
    pageControl.currentPageIndicatorTintColor = [UIColor redColor];
    // 其他頁碼的顏色
    pageControl.pageIndicatorTintColor = [UIColor blackColor];
    
    // 頁碼改變了,就會調用self的pageChange方法
    [pageControl addTarget:self action:@selector(pageChange) forControlEvents:UIControlEventValueChanged];
    
    
    // 添加到控制器的view
    [self.view addSubview:pageControl];
    _control = pageControl;
    //pageControl.currentPage = 2;
    
    // 6.設置代理
    scroll.delegate = self;
    
    // 不需要彈簧效果
    scroll.bounces = NO;
}
- (void)pageChange
{
    NSLog(@"%d",_control.currentPage);
    CGFloat offsetX = _control.currentPage * self.view.frame.size.width;
    
    [UIView beginAnimations:nil context:nil];
    // 設置滾動位置
    _scroll.contentOffset = CGPointMake(offsetX, 0);
    
    [UIView commitAnimations];
    
}

#pragma mark - 滾動代理
#pragma mark scrollview減速完畢就會調用
- (void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView
{
    //  計算頁碼
    int pageNo = scrollView.contentOffset.x/scrollView.frame.size.width;
    // 設置頁碼
    _control.currentPage = pageNo;
}
@end


發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章