Objective-C UI之自定义轮播图控件

Posted 2020-06-07

下面我们自定义一个轮播图类ImageLoop继承于UIView，类ImageLoop中包含一个UIScrollView和UIPageControl，其中定义三个属性：

pageControll，position，currentPage可以自定义pageControl样式，也可以使用position控制播放方向，或者设置从下标为currentPage的图片开始播放

下面是ImageLoop的接口文件:

#import <UIKit/UIKit.h>

typedef enum{Left,Right} Position;

@interface ImageLoop : UIView

@property (nonatomic,retain)UIPageControl *pageControll;
@property (nonatomic,assign)Position position;
@property (nonatomic,assign)NSInteger currentPage;

- (instancetype)initWithFrame:(CGRect)frame imageArray:(NSMutableArray *)array position:(Position)position;

@end

 

在初始化方法中初始化所有控件，除了pageControl，还有scrollView、三个UIImageView，一个计时器timer

此demo轮播的思路是利用三个UIImageView分别代表显示的图片，和显示的图片的左边以及显示的图片的右边，通过不断设置三个imageView的UIImage达到轮播的效果，当scrollView滑动到右边的时候，设置中间和左边的图片为下一张图片（注意边界问题），然后让scrollView滑动到中间，接着设置右边的图片为当前的图片的下一张（同样注意边界问题），如此重复就可以达到循环播放了

因为控件里包含一个计时器timer，所以当手势滑动时，要停止计时器，图片切换成功后就重新创建一个timer重新计时，同样，设置当前的图片currentPage时，要先停止计时器，之后再重新启动。设置方向时，定时器也会停止，然后重新根据方向和timer进行播放。

 

下面是demo的下载链接：

ImageLoop

 

 

---

转载请注明：作者SmithJackyson