个人感觉CollectionView过于强大，基本什么界面都能用他来完成需求，只是如果自定义Layout的时候可能性能开销大。如果是普通的需求，他和tableView并没有多大的区别，同样都是通过datasource和delegate两个代理来进行用户交互稍微回顾下CollectionView的构成1.Cells2.Supplementary Views 追加视图 （sectionHeader or footer）3.Decoration Views 装饰视图 （用作背景展示） 这货貌似还没怎么用过另一方面，对于cell的组织方式和样式，确实由于collectionView比tableView要复杂的多，因此没有按照tableView的方式来定义，而是专门启用了一个布局类UICollectionViewlayout来对collectionView进行布局。废话不多说，系统自带的Layout已经是很常见了，今天写个自定义Layout来做些看起来还是蛮不错的Demo正常人的Demo弱智博主模仿了LOL选择英雄皮肤的Demo先理论BB以下，不想看的请跳过实现一个自定义Layout的正常做法就是继承与UICollectionViewlayout，然后重载以下方法，听我一一道来三个必须手动重载的方法1.-(CGSize)collectionViewContentSize返回可见区域内的大小2.-(NSArray *)layoutAttributesForElementsInRect:(CGRect)rect返回的是包含UICollectionViewlayoutAttributes对象的数组，该对象可以是cell，supplementary或装饰视图返回对应indexPath下cell的布局属性-(UICollectionViewLayoutAttributes _)layoutAttributesForItemAtIndexPath:(NSIndexPath _)indexPath返回对应indexpath下对应的追加视图属性 （没有可不重载）-(UICollectionViewLayoutAttributes _)layoutAttributesForSupplementaryViewOfKind:(NSString _)kind atIndexPath:(NSIndexPath *)indexPath返回对应indexpath下对应的追加视图属性 （没有可不重载）-(UICollectionViewLayoutAttributes * )layoutAttributesForDecorationViewOfKind:(NSString_)decorationViewKind atIndexPath:(NSIndexPath _)indexPath3.-(BOOL)shouldInvalidateLayoutForBoundsChange:(CGRect)newBounds当边界发生变化时，也就是滚动的时候，如果返回Yes，就是会一直调用，而且不断刷新重新计算布局信息一个自动重载的方法-(void)prepareLayout一般在该方法中设定一些必要的layout的结构和初始需要的参数等。注意：在需要更新layout时，需要给当前layout发送 -invalidateLayout，该消息会立即返回，并且预约在下一个loop的时候刷新当前layout，这一点和UIView的setNeedsLayout方法十分类似。在-invalidateLayout后的下一个collectionView的刷新loop中，又会从prepareLayout开始，依次再调用-collectionViewContentSize和-layoutAttributesForElementsInRect来生成更新后的布局。Demo分析1.简单的做个弹出的动画容器View 以下的self就是指弹出来的View，View上面给了一层underBackView，最终是在改View上面布局// self是继承于UIView的，给上面的第一个View容器加个动画- (void)showInSuperView:(UIView *)superView{ CAKeyframeAnimation *popAnimation = [CAKeyframeAnimation animationWithKeyPath:@"transform"]; popAnimation.duration = 0.25; popAnimation.values = @[[NSValue valueWithCATransform3D:CATransform3DMakeScale(0.1f, 0.1f, 1.0f)], [NSValue valueWithCATransform3D:CATransform3DMakeScale(1.0f, 1.0f, 1.0f)]]; popAnimation.keyTimes = @[@0.2f, @1.0f]; popAnimation.timingFunctions = @[[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut], [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut], [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut]]; // 在点击按钮的时候在改方法里面add到父视图上面去 [superView addSubview:self]; // 给View上面的容器View加动画 [self.underBackView.layer addAnimation:popAnimation forKey:nil];}2.简单的懒加载布局视图以及一些回调delegate的设置就没必要多说了，大家都知道#pragma mark - 懒加载- (UIView *)underBackView{ if (_underBackView == nil) {_underBackView = [[UIView alloc] init];_underBackView.backgroundColor = [[UIColor blackColor] colorWithAlphaComponent:0.8];_underBackView.originX = 30;_underBackView.originY = 60;_underBackView.width = SCREEN_WIDTH - 2 * _underBackView.originX;_underBackView.height = SCREEN_HEIGHT - 2 * _underBackView.originY;_underBackView.layer.cornerRadius = 5;_underBackView.layer.borderColor = [UIColor redColor].CGC_underBackView.layer.borderWidth = 2.0f; } return _underBackV}- (UILabel *)nameLabel{ if (_nameLabel == nil) {_nameLabel = [[UILabel alloc] init];_nameLabel.textAlignment = NSTextAlignmentC_nameLabel.backgroundColor = [UIColor whiteColor];_nameLabel.font = [UIFont boldSystemFontOfSize:20];_nameLabel.textColor = [UIColor blueColor];_nameLabel.layer.cornerRadius = 5.0f;_nameLabel.layer.borderColor = [UIColor blackColor].CGC_nameLabel.layer.borderWidth = 2.0f; } return _nameL}- (UIButton *)selectedButton{ if (_selectedButton == nil) {_selectedButton = [UIButton buttonWithType:UIButtonTypeCustom];_selectedButton.backgroundColor = [UIColor blackColor];[_selectedButton setTitle:@"选这个" forState:UIControlStateNormal];[_selectedButton setTitleColor:[UIColor whiteColor] forState:UIControlStateNormal];[_selectedButton addTarget:self action:@selector(chooseDone:) forControlEvents:UIControlEventTouchUpInside];_selectedButton.layer.cornerRadius = 20.0f;_selectedButton.layer.borderWidth = 2.0f;_selectedButton.layer.borderColor = [UIColor whiteColor].CGC } return _selectedB}- (void)chooseDone:(UIButton *)button{ if (self.delegate && [self.delegate respondsToSelector:@selector(selectedHero:)]) {[self.delegate selectedHero:self.dataSource[_selectedIndex]]; }}- (UIButton *)closeButton{ if (_closeButton == nil) {_closeButton = [UIButton buttonWithType:UIButtonTypeCustom];_closeButton.backgroundColor = [UIColor redColor];[_closeButton setImage:[UIImage imageNamed:@"close"] forState:UIControlStateNormal];[_closeButton addTarget:self action:@selector(close:) forControlEvents:UIControlEventTouchUpInside]; } return _closeB}- (void)close:(UIButton *)button{ if (self.delegate && [self.delegate respondsToSelector:@selector(closePopView)]) {[self.delegate closePopView]; }}- (UICollectionView *)collectionView{ if (_collectionView == nil) {MKJCollectionViewFlowLayout *flow = [[MKJCollectionViewFlowLayout alloc] init];flow.scrollDirection = UICollectionViewScrollDirectionHflow.itemSize = CGSizeMake(self.underBackView.width / 2, self.underBackView.width - 100);flow.minimumLineSpacing = 30;flow.minimumInteritemSpacing = 30;flow.needAlpha = YES;flow.delegate =CGFloat oneX =self.underBackView.width / 4;flow.sectionInset = UIEdgeInsetsMake(0, oneX, 0, oneX); _collectionView = [[UICollectionView alloc] initWithFrame:CGRectMake(0, 30, self.underBackView.bounds.size.width, self.underBackView.bounds.size.height * 0.65) collectionViewLayout:flow];_collectionView.backgroundColor = [UIColor whiteColor];_collectionView.delegate =_collectionView.dataSource =_collectionView.showsHorizontalScrollIndicator = NO;[_collectionView registerNib:[UINib nibWithNibName:indentify bundle:nil] forCellWithReuseIdentifier:indentify]; } return _collectionV}3.关键是还是要看最终自定义的FlowLayout一些小东西的实现重载的方法和方式在上面都已经理论了一番了，需要的自己去上面看看第一个效果：需要一个放大的效果和透明的效果 // 重载第一个方法// 返回可见区域的的内容尺寸- (CGSize)collectionViewContentSize{ return [super collectionViewContentSize];}// 重载方法第二个// 返回rect中所有元素的布局属性// 返回的是包含UICollectionViewLayoutAttributes的NSArray// UICollectionViewAttributes可以是cell，追加视图以及装饰视图的信息，通过以下三个不同的方法可以获取到不同类型的UICollectionViewLayoutAttributes属性// layoutAttributesForCellWithIndexPath：
返回对应cell的UICollectionViewAttributes布局属性// layoutAtttibutesForSupplementaryViewOfKind：withIndexPath： 返回装饰的布局属性 如果没有追加视图可不重载// layoutAttributesForDecorationViewOfKind：withIndexPath： 返回装饰的布局属性
如果没有可以不重载- (NSArray&UICollectionViewLayoutAttributes *& *)layoutAttributesForElementsInRect:(CGRect)rect{ //1. 获取可见区域 CGRect visibleRect = CGRectMake(self.collectionView.contentOffset.x, 0, self.collectionView.bounds.size.width, self.collectionView.bounds.size.height); //2. 获得这个区域的item NSArray *visibleItemArray = [super layoutAttributesForElementsInRect:visibleRect];//3. 遍历，让靠近中心线的item方法，离开的缩小 for (UICollectionViewLayoutAttributes *attributes in visibleItemArray) {//1. 获取每个item距离可见区域左侧边框的距离 有正负CGFloat leftMargin = attributes.center.x - self.collectionView.contentOffset.x;//2. 获取边框距离屏幕中心的距离（固定的）CGFloat halfCenterX = self.collectionView.frame.size.width / 2;//3. 获取距离中心的的偏移量，需要绝对值CGFloat absOffset = fabs(halfCenterX - leftMargin);//4. 获取的实际的缩放比例 距离中心越多，这个值就越小，也就是item的scale越小 中心是方法最大的CGFloat scale = 1 - absOffset / halfCenterX;//5. 缩放attributes.transform3D = CATransform3DMakeScale(1 + scale * MKJMinZoomScale, 1 + scale * MKJMinZoomScale, 1);// 是否需要透明if (self.needAlpha){if (scale & 0.6){ attributes.alpha = 0.6;}else if (scale & 0.99){ attributes.alpha = 1.0;}else{ attributes.alpha =}} } NSArray *attributesArr = [[NSArray alloc] initWithArray:visibleItemArray copyItems:YES]; return attributesA}第二个效果：如何让滚动的的item根据中心距离，自动居中对齐，避免滚动到哪停到哪这里做了第一个和最后一个的判断，不然在头和尾会出现对不齐的情况// 重载第四个属性，item自动中心对齐// 该方法可写可不写，主要是让滚动的item根据距离中心的值，确定哪个必须展示在中心，不会像普通的那样滚动到哪里就停到哪里- (CGPoint)targetContentOffsetForProposedContentOffset:(CGPoint)proposedContentOffset withScrollingVelocity:(CGPoint)velocity{ // ProposeContentOffset是本来应该停下的位子 // 1. 先给一个字段存储最小的偏移量 那么默认就是无限大 CGFloat minOffset = CGFLOAT_MAX; // 2. 获取到可见区域的centerX CGFloat horizontalCenter = proposedContentOffset.x + self.collectionView.bounds.size.width / 2; // 3. 拿到可见区域的rect CGRect visibleRec = CGRectMake(proposedContentOffset.x, 0, self.collectionView.bounds.size.width, self.collectionView.bounds.size.height); // 4. 获取到所有可见区域内的item数组 NSArray *visibleAttributes = [super layoutAttributesForElementsInRect:visibleRec];// 遍历数组，找到距离中心最近偏移量是多少 for (UICollectionViewLayoutAttributes *atts in visibleAttributes) {// 可见区域内每个item对应的中心X坐标CGFloat itemCenterX = atts.center.x;// 比较是否有更小的，有的话赋值给minOffsetif (fabs(itemCenterX - horizontalCenter) &= fabs(minOffset)) {minOffset = itemCenterX - horizontalC}} // 这里需要注意的是
上面获取到的minOffset有可能是负数，那么代表左边的item还没到中心，如果确定这种情况下左边的item是距离最近的，那么需要左边的item居中，意思就是collectionView的偏移量需要比原本更小才是，例如原先是1000的偏移，但是需要展示前一个item，所以需要1000减去某个偏移量，因此不需要更改偏移的正负// 但是当propose小于0的时候或者大于contentSize（除掉左侧和右侧偏移以及单个cell宽度）
、 // 防止当第一个或者最后一个的时候不会有居中（偏移量超过了本身的宽度），直接卡在推荐的停留位置 CGFloat centerOffsetX = proposedContentOffset.x + minO if (centerOffsetX & 0) {centerOffsetX = 0; }if (centerOffsetX & self.collectionView.contentSize.width -(self.sectionInset.left + self.sectionInset.right + self.itemSize.width)) {centerOffsetX = floor(centerOffsetX); } return CGPointMake(centerOffsetX, proposedContentOffset.y);}第三个效果：如何让视图滚动的时候（不触发点击事件），自动把滚动到第几个的图片展示出来（delegate）CGPoint pInView = [self.collectionView.superviewconvertPoint:self.collectionView.centertoView:self.collectionView];同学如果你无法理解上面的坐标转换可以点击以下传送门，帮你快速理解点击打开链接我要学习// 重载第三个属性// 滚动的时候会一直调用// 当边界发生变化的时候，是否应该刷新布局。如果YES那么就是边界发生变化的时候，重新计算布局信息
这里的newBounds变化的只有x值的变化，也就是偏移量的变化- (BOOL)shouldInvalidateLayoutForBoundsChange:(CGRect)newBounds{ // 把collectionView的父视图（underBackView）上的中心坐标，转换到整个CollectionView ContentSize中的坐标 根据point来计算对应的indexpath CGPoint pInView = [self.collectionView.superview convertPoint:self.collectionView.center toView:self.collectionView];// 通过坐标获取对应的indexpath NSIndexPath *indexPathNow = [self.collectionView indexPathForItemAtPoint:pInView];if (indexPathNow.row == 0) {if (newBounds.origin.x & SCREEN_WIDTH / 2){if (_index != indexPathNow.row){ _index = 0; if (self.delegate && [self.delegate respondsToSelector:@selector(collectioViewScrollToIndex:)]) {[self.delegate collectioViewScrollToIndex:_index]; } }} } else {if (_index != indexPathNow.row){_index = indexPathNow.if (self.delegate && [self.delegate respondsToSelector:@selector(collectioViewScrollToIndex:)]){ [self.delegate collectioViewScrollToIndex:_index];}} } [super shouldInvalidateLayoutForBoundsChange:newBounds]; return YES;}第四个效果：点击Item，自动中心对齐 // 点击item的时候- (void)collectionView:(UICollectionView *)collectionView didSelectItemAtIndexPath:(NSIndexPath *)indexPath{ // 这里的坐标相互转换 可看我写的另一个小博客 CGPoint pInUnderView = [self.underBackView convertPoint:collectionView.center toView:collectionView];// 获取中间的indexpath NSIndexPath *indexpathNew = [collectionView indexPathForItemAtPoint:pInUnderView];if (indexPath.row == indexpathNew.row) {NSLog(@"点击了同一个"); } else {// 点击不同就把点击的滚动到中心居中[self.collectionView scrollToItemAtIndexPath:indexPath atScrollPosition:UICollectionViewScrollPositionCenteredHorizontally animated:YES]; }}主要的一些方法和实现思路都已经介绍完了，小白写的Demo，大神勿喷，理解的同学可以自己试试Demo地址：点击打开链接Demo写的很仓促，有些细节还没做的很好，只是玩英雄联盟选择皮肤的时候突然想到要写一个试试，各位有什么问题可以留言，我会慢慢更正能阅读完博主的文章也是不容易，谢谢捧场，好人一生平安，博主会不断进步的，谢谢
最新教程周点击榜
微信扫一扫& iOS下载 &
口袋英雄 1.0.5
千万流量共享 百度高权重排名
软件大小： 63.7M
软件厂商：
软件语言： 简体中文
软件授权： 免费
更新时间：
支持类型： iPhone、iPad
太平洋本地下载
口袋英雄1.0.5应用截图
打破时间和空间的界限 穿越时空和超能英雄一起激战 绝不退缩
卡卡西、不知火舞、蜘蛛侠、美少女战士、超人、初音……
大家耳熟能详的超级英雄都能在《口袋英雄》中偶遇
邂逅传奇人物 成长路上满满都是奇遇
在竞技场的乱斗中成为传奇 在区域战中逆转战局 爆发英雄潜能
让游戏开始吧,在这里战斗将是一种享受
成为一个真正的王者,英雄齐聚,跨时空要战!
★★★全明星英雄阵容
集结乱斗★★★
《口袋英雄》将玩家所熟识的超能明星英雄在游戏中空前集结、华丽登场。无论是玩家心中粗犷的绿巨人、奎爷,还是可爱无比的凌波丽、不知火舞等知名英雄,都将出现在玩家面前,等你招募,在这里,你可以和超人组队,同卡卡西、不知火舞并肩作战,我的英雄我做主。
★★★基因强化 超级英雄多元化成长★★★
《口袋英雄》拥有高自由度的成长方式,玩家可以根据自身喜好来选择不同的基因强化自身。不同的强化方式将拥有不同的攻击特性,如春丽吞噬了拥有攻击属性的蜘蛛侠基因,她就可以发动超强攻击,从而将敌人一举击溃。
★★★穿越时空
每个人都有奇遇★★★
玩家将穿越时空,与影视、动漫、游戏中的超级英雄一一汇合。口袋世界里每天都有各种奇遇,在成长的道路上将体验多彩人生,这些将满足广大玩家对各种传奇战斗天赋的体验梦想,更可尽情体验一场久违的热人生!
★★★竞技群殴绝不退缩 人人都是超级英雄★★★
《口袋英雄》拉响红色警报,游戏中的超能英雄齐聚两大学院,双方之间战争不断,战场的喊杀声震天响起,正邪纠缠千年的仇恨对决震撼降临。这是一个热血的世界,让战斗伴随玩家,经历一场血色浪潮!在这里,人人都是超级英雄!
口袋英雄是我玩过的占用内存最少的网络游戏游戏了，简直是业界良心
还是太平洋下载靠谱，找了好几个网站都没找到能用的口袋英雄，在这里一下子就找到了
口袋英雄不算是我用过的最稳定，最快的，但绝对是最特别的。
找了好久终于找到了口袋英雄这款免费游戏
找了那么久终于找到口袋英雄了。。来人！给小编加个鸡腿
74MB|421MB|158MB|453MB|6MB|35MB|
今日更新推荐 同类软件下载排行
热门关键词}