01.轮播图之三 : collectionView 轮播
个人觉得 collection view 做轮播是最方便的,设置下flowlayout 其他不会有很大的变动,没有什么逻辑的代码
let's begin……
创建自定义的view
.h 声明文件
@interface CollectionViewShuffling : UIView @property (nonatomic,strong)NSArray *array; @end
.m 实现文件
@interface CollectionViewShuffling ()<UICollectionViewDelegate, UICollectionViewDataSource> @property (nonatomic,strong)UICollectionView *collectionView; @property (nonatomic,strong)NSMutableArray *collectionArray; @end @implementation CollectionViewShuffling @synthesize array = _array; -(instancetype)initWithFrame:(CGRect)frame{ if (self == [super initWithFrame:frame]) { } return self; } /**
这个是横向滚动轮播的重点研究对象
*/ -( UICollectionViewFlowLayout *)creatFlowLayout{ // 创建UICollectionViewFlowLayout约束对象 UICollectionViewFlowLayout *flowLayout = [[UICollectionViewFlowLayout alloc] init]; // 设置item的Size大小 flowLayout.itemSize = CGSizeMake(self.frame.size.width, self.frame.size.height); // 设置uicollection 的 横向滑动 flowLayout.scrollDirection = UICollectionViewScrollDirectionHorizontal; flowLayout.minimumLineSpacing = 0; return flowLayout; } - (UICollectionView *)collectionView { if (!_collectionView) { UICollectionViewFlowLayout *flowLayout = [self creatFlowLayout]; _collectionView = [[UICollectionView alloc] initWithFrame:CGRectMake(0, 0, self.frame.size.width, self.frame.size.height) collectionViewLayout:flowLayout]; [self addSubview:_collectionView]; // 设置代理 _collectionView.delegate = self; _collectionView.dataSource = self; // _collectionView.showsHorizontalScrollIndicator = NO;// 设置不展示滑动条 _collectionView.pagingEnabled = YES; // 设置整页滑动 // 设置当前collectionView 到哪个位置(indexPath row 0 section 取中间(50个)) [_collectionView registerNib:[UINib nibWithNibName:@"ShufflingItem" bundle:nil] forCellWithReuseIdentifier:@"ShufflingItem"]; } return _collectionView; } -(void)setArray:(NSArray *)array{ NSAssert(array.count != 0, @"传入的滚动数组是 空的"); _array = array; [self prepareData]; [self prepareUI]; } -(void)prepareUI{ [self.collectionView scrollToItemAtIndexPath:[NSIndexPath indexPathForItem:1 inSection:0] atScrollPosition:UICollectionViewScrollPositionLeft animated:false]; [self.collectionView reloadData]; } - (void)prepareData{ self.collectionArray = [NSMutableArray new]; // 首位 添加数组最后的元素 [self.collectionArray addObject:_array.lastObject]; // 添加数组元素 [self.collectionArray addObjectsFromArray:_array]; // 末尾 补充第一个元素 [self.collectionArray addObject:_array.firstObject]; } /* collection view delegate */ - (NSInteger)numberOfSectionsInCollectionView:(UICollectionView *)collectionView { return 1; } - (NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section { return self.collectionArray.count; } - (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath { ShufflingItem *item = [collectionView dequeueReusableCellWithReuseIdentifier:@"ShufflingItem" forIndexPath:indexPath]; if (!item) { item = [[ShufflingItem alloc] init]; } item.imageView.backgroundColor = self.collectionArray[indexPath.row]; return item; } -(void)scrollViewDidScroll:(UIScrollView *)scrollView{ if (scrollView == self.collectionView) { NSLog(@"scroll content %@",NSStringFromCGPoint(scrollView.contentOffset)); //检测移动的位移 if (scrollView.contentOffset.x == (self.collectionArray.count-1)*(self.frame.size.width) ) { [self.collectionView scrollToItemAtIndexPath:[NSIndexPath indexPathForItem:1 inSection:0] atScrollPosition:UICollectionViewScrollPositionLeft animated:false]; }else if (scrollView.contentOffset.x == 0){ [self.collectionView scrollToItemAtIndexPath:[NSIndexPath indexPathForItem:(self.collectionArray.count-2) inSection:0] atScrollPosition:UICollectionViewScrollPositionLeft animated:false]; }else{ // 正常滚动 } } }
最简单的collection 轮播,实现啦……
总结下,他的实现为什么如此简单
- collection view 有个flow layout 设置这个属性就可以让他横向滚动,竖向滚动
- 还有一个重点 声明下 collection view 使用 item cell 的时候,是必须注册的
调用方法::::
-(void)prepareCollectShuffling{ CollectionViewShuffling *collectShuffling = [[CollectionViewShuffling alloc]initWithFrame:CGRectMake(10, 320, self.view.frame.size.width -20, 220)]; [self.view addSubview:collectShuffling];; collectShuffling.array = self.arr; }
这个写完,距离成功又进了一步,继续………………