</pre><p><img src="webkit-fake-url://e0d69b2a-abd0-4ffe-9f08-f42c8c19d8fc/image.tiff" alt="" /></p><p></p><p></p><p><pre name="code" class="objc">#import <UIKit/UIKit.h>
@interface HomeHeaderView : UIView <UIScrollViewDelegate>
//定义相关属性
@property (nonatomic, strong) UIScrollView *scrollView;
@property (nonatomic, strong) UIPageControl *pageControl;
@property (nonatomic, strong) NSTimer *timer;
@end
设置左右无限滑动方法
// 首页头视图1 滑动视图
- (void)headerView1 {
//----------创建对象scrollView----------
_scrollView = [[UIScrollView alloc] initWithFrame:CGRectMake(0, 0, kSWidth, 160)];
_scrollView.delegate = self; // 设置代理
// 设置分页尺寸,注意设置这里的偏移量,图片总数前后多出来一张,如果是5张图片就设置偏移量为屏幕宽 * 7
_scrollView.contentSize = CGSizeMake(kSWidth * 7, 160);
// 设置偏移量,因为scrollView如果设置偏移量为0时就不能再往前滑了,要实现无限滚动的功能这里设置为屏幕的宽.其实是要从第二张图片开始循环,所以设置图片时要把第一张放到当前偏移量
_scrollView.contentOffset = CGPointMake(kSWidth, 0);
_scrollView.pagingEnabled = YES; //分页效果
_scrollView.showsHorizontalScrollIndicator = NO; //隐藏水平滑动条
[self addSubview:_scrollView];
// 循环创建添加到scrollView的图片
for (int i = 0; i <= 7; i++) {
/*
图片放置的顺序是前后两张图片各多出来一张,存放的顺序名称:
handover1.jpg(最后一张,handover6.jpg图片一样)
handover2.jpg(第一张)
handover3.jpg
handover4.jpg
handover5.jpg
handover6.jpg(最后一张)
handover7.jpg(第一张,跟handover2.jpg图片一样)
*/
UIImageView *imageView = [[UIImageView alloc] initWithFrame:CGRectMake(i *kSWidth, 0, kSWidth, 160)];
imageView.image = [UIImage imageNamed:[NSString stringWithFormat:@"headerView%d.jpg",i + 1]];
[_scrollView addSubview:imageView];
}
// ----------创建对象pageControl----------
_pageControl = [[UIPageControl alloc] initWithFrame:CGRectMake(0, 135, kSWidth, 20)];
_pageControl.numberOfPages = 5; // 总页数
_pageControl.pageIndicatorTintColor = [UIColor purpleColor]; // 页颜色
_pageControl.currentPageIndicatorTintColor = [UIColor orangeColor]; // 当前页颜色
//注意这里是添加到View而不是ScrollView,如果添加到scrollView则会添加到scrollView的第一张图片,滑动一下就没了
[self addSubview:_pageControl];
}
#pragma make - ScrollViewDelegate 一直拖拽
- (void)scrollViewDidScroll:(UIScrollView *)scrollView {
NSInteger currentPage = scrollView.contentOffset.x / kSWidth; //当前图片所在的位置(第几张).
_pageControl.currentPage = currentPage - 1;// 分页控制当前页数,跟scrollView当前显示的图片的页数同步.
if (currentPage == 6) { // 到第6张的时候返回0页
_pageControl.currentPage = 0;
scrollView.contentOffset = CGPointMake(kSWidth, 0); // scrollView偏移量
}else if (currentPage == 0) { // 到0张的时候返回5页
_pageControl.currentPage = 5;
scrollView.contentOffset = CGPointMake(5 * kSWidth, 0);
}
// 这样设置就可以实现我们的左右无限滑动效果了。
}
设置让定时器循环播放
// 头视图1自动播放 定时器
- (void)scrollViewTimer {
NSInteger currentPage = _scrollView.contentOffset.x / kSWidth;
//刚开始是0页,让它自增, 自增到5的时候就会自动返回1重新开始,因为实现这里方法上面那个一直拖拽的方法也会被执行, 执行到第6的时候就会返回0并重新设置当前页数和scrollView偏移量
currentPage++;
[_scrollView setContentOffset:CGPointMake(currentPage * kSWidth, 0) animated:YES];
// 让scrollView无限循环播放完成.
}
// 添加定时器
- (void)addTimer {
_timer = [NSTimer scheduledTimerWithTimeInterval:3.5 target:self selector:@selector(scrollViewTimer) userInfo:nil repeats:YES];
[[NSRunLoop currentRunLoop] addTimer:_timer forMode:NSRunLoopCommonModes]; // 让定时器不停调用
}
#pragma make - ScrollViewDelegate 开始拖拽
- (void)scrollViewWillBeginDragging:(UIScrollView *)scrollView {
[_timer invalidate]; // 因为拖拽的时候跟定时器发生冲突,所以要设置开始拖拽的时候让定时器停止.
}
#pragma make - ScrollViewDelegate 停止拖拽
- (void)scrollViewWillEndDragging:(UIScrollView *)scrollView withVelocity:(CGPoint)velocity targetContentOffset:(inout CGPoint *)targetContentOffset {
[self addTimer]; // 当停止拖拽的时候重新开启定时器
}
UIScrollView和UIPageControl 实现让图片无限循环播放和左右滑动设置完成,代码还是比较简单的。