当要实现如下图样式需求时(中间显示完整,左边和右边显示部分)
SwipeView使用1.png我们可以使用SwipeView来实现,传送门https://github.com/nicklockwood/SwipeView
首先将SwipeView.h/m文件拖入工程,创建SwipeView并设置样式以及数据源和代理
#pragma mark - getter and setter
- (SwipeView*)mySwipeView
{
if (_mySwipeView == nil) {
_mySwipeView = [[SwipeView alloc] initWithFrame:CGRectMake(0, 100, [UIScreen mainScreen].bounds.size.width, 220)];
_mySwipeView.backgroundColor = [UIColor blackColor];
// 设置数据源和代码
_mySwipeView.dataSource = self;
_mySwipeView.delegate = self;
_mySwipeView.itemsPerPage = 1;
_mySwipeView.pagingEnabled = YES;
// 设置居中对齐样式
_mySwipeView.alignment = SwipeViewAlignmentCenter;
// 设置首尾循环
_mySwipeView.wrapEnabled = YES;
_mySwipeView.truncateFinalPage = YES;
}
return _mySwipeView;
}
- (NSMutableArray*)dataArray
{
if (_dataArray == nil) {
_dataArray = [[NSMutableArray alloc] init];
DMModel *qrModel = [[DMModel alloc] init];
qrModel.titleStr = @"💗💗小妖超超💗💗";
qrModel.imageName = @"qrcode";
qrModel.signStr = @"By 点滴86";
[_dataArray addObject:qrModel];
DMModel *xzqModel = [[DMModel alloc] init];
xzqModel.titleStr = @"💗💗深深爱过你💗💗";
xzqModel.imageName = @"xuezhiqian";
xzqModel.signStr = @"By 薛之谦";
[_dataArray addObject:xzqModel];
DMModel *zlyModel = [[DMModel alloc] init];
zlyModel.titleStr = @"💗💗终于等到你💗💗";
zlyModel.imageName = @"zhangliangying";
zlyModel.signStr = @"By 张靓颖";
[_dataArray addObject:zlyModel];
}
return _dataArray;
}
数据源实现
#pragma mark - SwipeViewDataSource method
- (NSInteger)numberOfItemsInSwipeView:(SwipeView *)swipeView
{
return self.dataArray.count;
}
- (UIView *)swipeView:(SwipeView *)swipeView viewForItemAtIndex:(NSInteger)index reusingView:(UIView *)view
{
DMModel *tempModel = [self.dataArray objectAtIndex:index];
if (view == nil) {
DMSubView *dmSubView = [[DMSubView alloc] initWithFrame:CGRectMake(0, 0, ([UIScreen mainScreen].bounds.size.width - 2 * 15) / 5.0 * 3.0, self.mySwipeView.bounds.size.height)];
[dmSubView setDataModel:tempModel];
view = dmSubView;
} else {
DMSubView *dmSubView = (DMSubView *)view;
[dmSubView setDataModel:tempModel];
}
return view;
}
代理实现item大小
#pragma mark - SwipeViewDelegate method
- (CGSize)swipeViewItemSize:(SwipeView *)swipeView
{
return CGSizeMake(([UIScreen mainScreen].bounds.size.width - 2 * 15) / 5.0 * 3.0, self.mySwipeView.bounds.size.height);
}
加载swipeView视图
- (void)viewDidLoad
{
[super viewDidLoad];
self.view.backgroundColor = [UIColor whiteColor];
self.title = @"💗💗小妖超超💗💗";
[self.view addSubview:self.mySwipeView];
}
效果如下
SwipeView使用2.png添加指示控件并在代理回调中修改指示位置
- (UIPageControl*)currentPageControl
{
if (_currentPageControl == nil) {
_currentPageControl = [[UIPageControl alloc] init];
_currentPageControl.frame = CGRectMake(20, 350, 100, 30);
_currentPageControl.numberOfPages = self.dataArray.count;
_currentPageControl.currentPageIndicatorTintColor = [UIColor redColor];
_currentPageControl.pageIndicatorTintColor = [UIColor blackColor];
}
return _currentPageControl;
}
- (void)swipeViewCurrentItemIndexDidChange:(SwipeView *)swipeView
{
self.currentPageControl.currentPage = self.mySwipeView.currentPage;
}
效果图如下
SwipeView使用3.png添加定时器实现自动轮播
- (NSTimer *)myTimer
{
if (_myTimer == nil) {
_myTimer = [NSTimer scheduledTimerWithTimeInterval:self.timeInterval target:self selector:@selector(scrollToNextIndex) userInfo:nil repeats:YES];
}
return _myTimer;
}
#pragma mark - event response
- (void)scrollToNextIndex
{
NSInteger nextIndex = self.mySwipeView.currentItemIndex;
nextIndex = (nextIndex + 1) % (self.dataArray.count);
[self.mySwipeView scrollToItemAtIndex:nextIndex duration:0.5];
}
#pragma mark - private method
- (void)startTimer
{
[self stopTimer];
[self.myTimer setFireDate:[NSDate dateWithTimeIntervalSinceNow:self.timeInterval]];
}
- (void)pauseTimer
{
if (![self.myTimer isValid]) {
return;
}
[self.myTimer setFireDate:[NSDate distantFuture]];
}
- (void)stopTimer
{
if ([self.myTimer isValid]) {
[self.myTimer invalidate];
self.myTimer = nil;
}
}
-(void)resumeTimer
{
if (![self.myTimer isValid]) {
return;
}
[self.myTimer setFireDate:[NSDate dateWithTimeIntervalSinceNow:self.timeInterval]];
}
#pragma mark - life cycle
- (void)viewWillAppear:(BOOL)animated
{
[super viewWillAppear:animated];
if (_timeInterval > 0) {
[self startTimer];
}
}
- (void)viewDidDisappear:(BOOL)animated
{
[super viewDidDisappear:animated];
[self stopTimer];
}
- (void)viewDidLoad
{
[super viewDidLoad];
self.view.backgroundColor = [UIColor whiteColor];
self.title = @"💗💗小妖超超💗💗";
[self.view addSubview:self.mySwipeView];
[self.view addSubview:self.currentPageControl];
self.currentPageControl.center = CGPointMake(self.view.center.x, self.currentPageControl.center.y);
_timeInterval = 3;
if (_timeInterval > 0) {
[self startTimer];
}
}
中间显示完整,左边和右边显示部分样式并添加指示器以及自动轮播就实现啦...
网友评论