ScrollView实现图片无限翻滚

本文介绍了一种在 iOS 应用中实现图片轮播的方法,通过 UIScrollView 和 UIPageControl 控件来展示连续图片,并利用 NSTimer 实现自动滚动效果。

 使用的是前后多加一张图片的方法,直接上代码

#import "ViewController.h"

@interface ViewController ()<UIScrollViewDelegate>

@property(assign,nonatomic)UIPageControl *pageControl;
@property(nonatomic,strong)NSTimer *timer;
@property(nonatomic,strong)UIScrollView *sc;

@end
#define HEIGHT (320.0*260.0)/600.0
@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    
    //设置UIScrollView - 加载连载图片
    [self setUpUI];
    //设置UIPageControl - 添加页数控制器
    [self setUpPageControl];
    //设置UITimer - 添加计时器
    [self setUpTimer];
}
-(void)setUpUI{
    UIScrollView *sc = [[UIScrollView alloc]initWithFrame:CGRectMake(0, 64, 320.0, HEIGHT)];
    sc.contentSize = CGSizeMake(320.0*7,HEIGHT);
    sc.delegate = self;
    
    UIImageView *iv1 = [[UIImageView alloc]initWithFrame:CGRectMake(0, 0, 320.0, HEIGHT)];
    
    UIImage *im1 = [UIImage imageNamed:[NSString stringWithFormat:@"img_05"]];
    
    iv1.image = im1;
    [sc addSubview:iv1];
    for (int i =1; i<=5; i++) {
        
        UIImageView *iv = [[UIImageView alloc]initWithFrame:CGRectMake(i*320.0, 0, 320.0, HEIGHT)];
        
        UIImage *im = [UIImage imageNamed:[NSString stringWithFormat:@"img_0%d",i]];
        
        iv.image = im;
        [sc addSubview:iv];
        
    }
    UIImageView *iv2 = [[UIImageView alloc]initWithFrame:CGRectMake(320.0*6, 0, 320.0, HEIGHT)];
    
    UIImage *im2 = [UIImage imageNamed:[NSString stringWithFormat:@"img_01"]];
    
    iv2.image = im2;
    [sc addSubview:iv2];
    
//    [sc setContentOffset:CGPointMake(320, 0)];
    sc.showsHorizontalScrollIndicator = NO;
    sc.pagingEnabled = YES;
    self.sc = sc;
    
    [self.view addSubview:sc];
 }

-(void)setUpPageControl{
    CGFloat top = (64+HEIGHT)-20;
    
    UIPageControl *pc = [[UIPageControl alloc]initWithFrame:CGRectMake(0, top, 320, 20)];
    
    self.pageControl = pc;
    //总页数
    pc.numberOfPages = 5;
    //当前页
    pc.currentPage = 0;
    //启动时显示的是第二张图片
    [self.sc setContentOffset:CGPointMake(320, 0)];
    //默认颜色
    pc.pageIndicatorTintColor = [UIColor whiteColor];
    //当前页颜色
    pc.currentPageIndicatorTintColor = [UIColor cyanColor];
    
    pc.userInteractionEnabled = NO;
    [self.view addSubview:pc];
}
-(void)setUpTimer{
    /**
     *  1.动作间隔时间
     *  2.self
     *  3.timerAction 需要响应的方法
     *  4.repeats 是否重复  YES
     */
    self.timer = [NSTimer timerWithTimeInterval:2 target:self selector:@selector(timerAction) userInfo:nil repeats:YES];
    
    //连接APP本身的计时器
    NSRunLoop *loop = [NSRunLoop mainRunLoop];
    [loop addTimer:self.timer forMode:NSRunLoopCommonModes];
    
}
-(void)timerAction{
    if (self.pageControl.currentPage == 4) {
        //倒数第二张变为第一张(两张图片相同)
        [self.sc setContentOffset:CGPointMake(0, 0) animated:NO];
        [self.sc setContentOffset:CGPointMake(320, 0) animated:YES];
        self.pageControl.currentPage = 0;
        
    }else{
        
        self.pageControl.currentPage++;
        [self.sc setContentOffset:CGPointMake(320*self.pageControl.currentPage+320, 0) animated:YES];
    }
}
//用户开始拖拽的时候响应的方法
-(void)scrollViewWillBeginDragging:(UIScrollView *)scrollView{
    //计时器停止
    //自动停止后,没有再启动的方法
    //只有重新初始化
    [self.timer invalidate];
}
//动画缓冲结束方法
-(void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView{
    //x轴的偏移量/屏幕宽度 = 当前页数
    int i = (scrollView.contentOffset.x-320)/320.0;
    self.pageControl.currentPage = i;
    /**
     一共五张图片,前后各加一张,第一张和第六张相同,第二张和第七张相同
     scrollView.contentOffset.x == 0时,变为第六张的偏移量,pageControl = 4
     scrollView.contentOffset.x == 6*320时,变为第二张得偏移量 pageControl = 0
     */
    if (scrollView.contentOffset.x == 0) {
        [self.sc setContentOffset:CGPointMake(5*320, 0) animated:NO];
        self.pageControl.currentPage = 4;
    }else if (scrollView.contentOffset.x == 6*320){
        [self.sc setContentOffset:CGPointMake(320, 0) animated:NO];
        self.pageControl.currentPage = 0;
    }
    //计时器停止后重新启动
    [self setUpTimer];
    
}
- (void)didReceiveMemoryWarning {
    [super didReceiveMemoryWarning];
    // Dispose of any resources that can be recreated.
}

@end

 

转载于:https://my.oschina.net/thewrold/blog/751348

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值