IOS 轮播图(UIScrollView)

轮播图在App上面到处可见 ,也是最容易上手操作的。下面就介绍下怎么自己动手做轮播图
首先 轮播图用到 UIScrollView 和 PageControll;
再次用到时间控制器 控制 其自动播放
还要遵循代理方法

@interface RootController ()<UIScrollViewDelegate>

声明scrollview 和pagecontroll timer

@property (nonatomic, strong)UIScrollView *scrollVC;
@property (nonatomic, strong)UIPageControl *pageCT;
@property (nonatomic, strong)NSTimer *timer;

1 创建scrollview

- (void)addScroll
{
//  初始化一个scrollview
    self.scrollVC = [[UIScrollView alloc]initWithFrame:CGRectMake(0, 10, kScrrenWith, kScrrenHeight  - 10)];
    //设置代理
    self.scrollVC .delegate = self;
    //  循环创建图片 
    for (int i = 0; i < 5; i ++) {
        UIImageView *imageView = [[UIImageView alloc]initWithFrame:CGRectMake(kScrrenWith * i, 10, kScrrenWith, kScrrenHeight - 10)];
        imageView.image = [UIImage imageNamed:[NSString stringWithFormat:@"%d.jpg", i + 1]];
        // 将imegeview 添加到scrollview上面
        [self.scrollVC addSubview:imageView];
    }
    //  创建scrollview 可以滑动的区域
    self.scrollVC.contentSize = CGSizeMake(kScrrenWith * 5, kScrrenHeight - 20);
   // 设置  scrollview 是整页可以滑动
    self.scrollVC.pagingEnabled = YES;
    // 把scrollview 添加到页面
    [self.view addSubview:self.scrollVC];
}

创建pagecontrol

#pragma mark pageControl
- (void)addPage
{
    self.pageCT = [[UIPageControl alloc]initWithFrame:CGRectMake((kScrrenWith - 300) / 2, kScrrenHeight - 20, 300, 20)];
    self.pageCT.numberOfPages = 5;
    self.pageCT.pageIndicatorTintColor = [UIColor greenColor];
    self.pageCT.currentPageIndicatorTintColor = [UIColor yellowColor];
    //  把 pagecontrol 插入到  scrollview  上面
    [self.view insertSubview:self.pageCT aboveSubview:self.scrollVC];
}

设置图片滑动一页 page显示对应的位置 这就需要用到scrollview的代理方法

#pragma mark 代理方法
- (void)scrollViewDidScroll:(UIScrollView *)scrollView{

    //  计算当前的偏移量
    NSInteger page = scrollView.contentOffset.x / kScrrenWith + 0.5;
    self.pageCT.currentPage = page;
}

写道这里测试 可以看到图片可以用手滑动 pagecontrol也在图片上面显示
下面就需要 通过时间控制器 去控制 图片轮播

创建时间控制器

#pragma  mark timer
- (void)addTIM
{
    self.timer = [NSTimer scheduledTimerWithTimeInterval:2.0 target:self selector:@selector(ationNext) userInfo:nil repeats:YES];

    [[NSRunLoop currentRunLoop]addTimer:self.timer forMode:NSRunLoopCommonModes];

}

去实现 actionNext方法 在actionNext方法里区控制图片的自动轮播

- (void)ationNext
{
    NSInteger page = self.pageCT.currentPage;
    page++;
    if (page == 5) {
        page = 0;
    }

    CGPoint poin = CGPointMake(kScrrenWith * page, 0);

    [self.scrollVC setContentOffset:poin animated:YES];
}

这样图片就可以自动轮播 page也可以跟着一起动 但是 当我们手动拖动的时候 不能拖动
就需要添加手动拖动方法

#pragma mark 可以手动滑动

//  当视图将要拖动的时候触发
- (void)scrollViewWillBeginDragging:(UIScrollView *)scrollView{
    //[self removeTimer];
    [self removeTimer];
}

//  将要停止拖动的时候
-(void)scrollViewDidEndDragging:(UIScrollView *)scrollView willDecelerate:(BOOL)decelerate
{
    dispatch_after(DISPATCH_TIME_NOW, dispatch_get_main_queue(), ^{
        [self addTIM];
    });
}

- (void)removeTimer
{
    [self.timer invalidate];
    self.timer = nil;
}
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值