首先要封装一个类，有了这个类，只要把类拖拽到你的工程，妈妈就再也不用担心你不会做轮播图了！
创建这个类如下：
类名：MGJScrollView 继承UIView
// MGJScrollView.h
@interface MGJScrollView : UIView
-(void)setImageByIndex(long)
currentIndex;
- (void)refreshImage;//刷新图片
@end
//
// MGJScrollView.m
#import "MGJScrollView.h"
#define imageX 0
#define imageY 0
#define imageW self.frame.size.width
#define imageH self.frame.size.height
#define kImageCount self.imageArray.count
#define kTimeChange 3.0f
@interface MGJScrollView ()
@property (nonatomic, strong) UIScrollView *scrollView;//滚动视图控件
@property (nonatomic, strong) UIPageControl *pageControl;//页码指示视图控件
@property (nonatomic, strong) NSTimer *timer;//定时器
@property (nonatomic, strong) UIImageView *leftImageView;//显示左边图片的控件
@property (nonatomic, strong) UIImageView *centerImageView;//显示中间图片的控件
@property (nonatomic, strong) UIImageView *rightImageView;//显示右边图片的控件
@property (nonatomic, strong) NSArray *imageArray;//保存图片的数组
@property (nonatomic, assign) long currentIndex;//图片当前的下标索引
@property (nonatomic, assign) BOOL isTimeUp;
@end
@implementation MGJScrollView
- (id)initWithFrame:(CGRect)frame
{
if ([super initWithFrame:frame])
{
self.currentIndex = 0;
[self layoutScrollView];
[self layoutImages];
[self layoutPageControl];
[self layoutImageView];
[self setImageByIndex:self.currentIndex];
}
return self;
}
//自定义ScrollView
- (void)layoutScrollView
{
self.scrollView = [[UIScrollView alloc]initWithFrame:CGRectMake(imageX, imageY,imageW , imageH)];
self.scrollView.contentOffset = CGPointMake(imageW, 0);
self.scrollView.contentSize = CGSizeMake(imageW * 3, 0);
//[self.scrollView setContentOffset:CGPointMake(imageW, 0) animated:NO];
self.scrollView.pagingEnabled = YES;
self.scrollView.delegate = self;
self.scrollView.bounces= NO;
self.scrollView.showsHorizontalScrollIndicator = NO;
[self addSubview:self.scrollView];
}
//图片数组
- (void)layoutImages
{
self.imageArray = @[@"h0.jpg",@"h1.jpg",@"h2.jpg",@"h3.jpg",@"h4.jpg",@"h5.jpg",@"h6.jpg",@"h7.jpg"];
}
//自定义添加PageControl
- (void)layoutPageControl
{
self.pageControl = [[UIPageControl alloc]initWithFrame:CGRectMake(imageX, imageY, imageW, 30)];
self.pageControl.center = CGPointMake(imageW / 2, imageH / 10 * 9);
self.pageControl.currentPageIndicatorTintColor = [UIColor purpleColor];//当前点的颜色
self.pageControl.pageIndicatorTintColor = [UIColor whiteColor];//其他点的颜色
self.pageControl.enabled = NO;
self.pageControl.numberOfPages = kImageCount;//page数
[self addSubview:self.pageControl];
}
//自定义添加ImageView
- (void)layoutImageView
{
self.leftImageView = [[UIImageView alloc]initWithFrame:CGRectMake(imageX, imageY, imageW, imageH)];
[self.scrollView addSubview:self.leftImageView];
self.centerImageView = [[UIImageView alloc]initWithFrame:CGRectMake(imageW, imageY, imageW, imageH)];
[self.scrollView addSubview:self.centerImageView];
self.rightImageView = [[UIImageView alloc]initWithFrame:CGRectMake(imageW *2, imageY, imageW, imageH)];
[self.scrollView addSubview:self.rightImageView];
self.timer = [NSTimer scheduledTimerWithTimeInterval:kTimeChange target:self selector:@selector(timerAction) userInfo:nil repeats:YES];
_isTimeUp = NO;
}
//刷新图片
- (void)refreshImage
{
if (self.scrollView.contentOffset.x > imageW)
{
self.currentIndex = ((self.currentIndex + 1) % kImageCount);
}else if(self.scrollView.contentOffset.x < imageW)
{
self.currentIndex = ((self.currentIndex - 1 + kImageCount) % kImageCount);
}
[self setImageByIndex:self.currentIndex];
}
//根据传回的下标设置三个ImageView的图片
- (void)setImageByIndex:(long)currentIndex
{
NSString *curruntImageName = [NSString stringWithFormat:@"h%ld.jpg",currentIndex];
//NSLog(@"———————————%ld",currentIndex);
self.centerImageView.image = [UIImage imageNamed:curruntImageName];
NSLog(@"当前页的名字是:%@",curruntImageName);
self.leftImageView.image = [UIImage imageNamed:[NSString stringWithFormat:@"h%ld.jpg",((self.currentIndex - 1 + kImageCount) % kImageCount)]];
NSLog(@"左边的图片名字是:%@",[NSString stringWithFormat:@"%ld.jpg",
((self.currentIndex - 1 + kImageCount)% self.kImageCount)]);
self.rightImageView.image = [UIImage imageNamed:[NSString stringWithFormat:@"h%ld.jpg",((self.currentIndex + 1) % kImageCount)]];
NSLog(@"右边的图片名字是:%@",[NSString stringWithFormat:@"%ld.jpg",((self.currentIndex + 1) % kImageCount)]);
self.pageControl.currentPage = currentIndex;
}
- (void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView
{
[self refreshImage];
self.scrollView.contentOffset = CGPointMake(imageW, 0);
self.pageControl.currentPage = self.currentIndex ;
NSLog(@"停止了加速,停在第%ld页",self.pageControl.currentPage+1);
//手动控制图片滚动应该取消那个三秒的计时器
if (!_isTimeUp)
{
[_timer setFireDate:[NSDate dateWithTimeIntervalSinceNow:kTimeChange]];
}
_isTimeUp = NO;
}
//计时器到时,系统滚动图片
- (void)timerAction
{
[self.scrollView setContentOffset:CGPointMake(imageW * 2, 0) animated:YES];
_isTimeUp = YES;
[NSTimer scheduledTimerWithTimeInterval:0.4f target:self selector:@selector(scrollViewDidEndDecelerating:) userInfo:nil repeats:NO];
}
@end
在视图控制器内直接调用上面创建好的类方法即可实现轮播图效果
调用方法如下:
// MGJViewController.h
@interface MGJViewController : UIViewController
@end
//
// MGJViewController.m
#import "MGJViewController.h"
#import "MGJScrollView.h"
@interface MGJViewController ()
@end
@implementation MGJViewController
- (void)viewDidLoad {
[super viewDidLoad];
MGJScrollView *scrollView = [[MGJScrollView alloc]initWithFrame:CGRectMake(0, 100,[UIScreen mainScreen].bounds.size.width, 200)];
[self.view addSubview:scrollView];
}
- (void)didReceiveMemoryWarning {
[super didReceiveMemoryWarning];
}
@end
网友评论