关闭

iOS UIScrollView实用之图片轮播 —— HERO博客

标签: 图片轮播UIScrollView练习UIScrollView图片轮播UIScrollView使用图片轮播实现原理
336人阅读 评论(0) 收藏 举报
分类:

上一篇简述了UIScrollView的属性及方法,本篇实际应用制作图片轮播效果。

具体属性及方法可以参考上一篇UIScrollView简介:UIScrollView简介

首先看一下效果图:

   

代码如下:

#import "ViewController.h"

#define KWidth 320
#define KHeight 180

@interface ViewController ()<UIScrollViewDelegate>

@property (nonatomic, strong) UIScrollView *scrollView;
@property (nonatomic, weak) UIPageControl *pageControl;
@property (nonatomic, strong) NSTimer *timer;
@property (nonatomic, strong) NSArray *imageArray;

@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    
    //初始化图片数组,展示4张图片(ABCD),首尾多添加2张(DABCDA)
    self.imageArray =  @[@"04.jpg", @"01.jpg", @"02.jpg", @"03.jpg", @"04.jpg", @"01.jpg"];
    
    //创建scrollView
    [self createScrollView];
    
    //创建pageControl
    [self createPageControl];
    
    //创建定时器
    [self createNSTimer];
}

- (void)createScrollView
{
    //初始化
    UIScrollView *scrollView = [[UIScrollView alloc] initWithFrame:CGRectMake(28, 50, KWidth, KHeight)];
    //循环添加图片
    for (int i = 0; i < _imageArray.count; i++) {
        UIImageView *imageView = [[UIImageView alloc] initWithFrame:CGRectMake(KWidth * i, 0, KWidth, KHeight)];
        imageView.image = [UIImage imageNamed:_imageArray[i]];
        [scrollView addSubview:imageView];
    }
    //设置可以滚动的区域
    scrollView.contentSize = CGSizeMake(KWidth * _imageArray.count, 0);
    //设置当前位置,图片应为第二张
    scrollView.contentOffset = CGPointMake(KWidth, 0);
    //设置代理
    scrollView.delegate = self;
    //整页翻动
    scrollView.pagingEnabled = YES;
    //隐藏水平方向滚动条
    scrollView.showsHorizontalScrollIndicator = NO;
    
    [self.view addSubview:scrollView];
    self.scrollView = scrollView;
}

- (void)createPageControl
{
    //初始化
    UIPageControl *pageControl = [[UIPageControl alloc]initWithFrame:CGRectMake(0, 0, 80, 30)];
    //中心位置
    pageControl.center = CGPointMake([UIScreen mainScreen].bounds.size.width * 0.5, CGRectGetMaxY(self.scrollView.frame) - 10);
    //总页数
    pageControl.numberOfPages = 4;
    //当前页
    pageControl.currentPage = 0;
    //取消交互
    pageControl.userInteractionEnabled = NO;
    
    [self.view addSubview:pageControl];
    self.pageControl = pageControl;
}

- (void)createNSTimer
{
    self.timer = [NSTimer scheduledTimerWithTimeInterval:1.0f target:self selector:@selector(nextPage) userInfo:nil repeats:YES];
    [[NSRunLoop mainRunLoop] addTimer:self.timer forMode:NSRunLoopCommonModes];
}

- (void)nextPage
{
    NSInteger currentPage = self.pageControl.currentPage;
    currentPage++;
    if (currentPage == 5) {
        currentPage = 0;
    }
    [self.scrollView setContentOffset:CGPointMake((currentPage + 1) * KWidth, 0) animated:YES];
}

#pragma mark - UIScrollViewDelegate
//滚动时调用
- (void)scrollViewDidScroll:(UIScrollView *)scrollView
{
    int index = scrollView.contentOffset.x / KWidth + 0.5;
    
    if (index > 0 && index < 5) {
        _pageControl.currentPage = index - 1;
        
    }else if (scrollView.contentOffset.x == KWidth * 5) {
        _pageControl.currentPage = 0;
        scrollView.contentOffset = CGPointMake(KWidth, 0);
        
    }else if (scrollView.contentOffset.x == 0) {
        _pageControl.currentPage = 3;
        scrollView.contentOffset = CGPointMake(KWidth * 4, 0);
    }
}
//开始拖拽视图调用
- (void)scrollViewWillBeginDragging:(UIScrollView *)scrollView
{
    [self.timer invalidate];
    self.timer = nil;
}
//完成拖拽调用
- (void)scrollViewDidEndDragging:(UIScrollView *)scrollView willDecelerate:(BOOL)decelerate
{
    [self createNSTimer];
}


3
0

查看评论
* 以上用户言论只代表其个人观点,不代表CSDN网站的观点或立场
    个人资料
    • 访问:64050次
    • 积分:1563
    • 等级:
    • 排名:千里之外
    • 原创:75篇
    • 转载:0篇
    • 译文:0篇
    • 评论:25条
    最新评论