IOS中UICollectionView中DecorationView的使用

Decoration View是UICollectionView的装饰视图。苹果官方给的案例都没涉及到这个视图的使用。没有具体的细节。我今天用UICollectionView做了一个简易的书架。主要是Decoration View的使用方法。

创新互联服务项目包括乌审网站建设、乌审网站制作、乌审网页制作以及乌审网络营销策划等。多年来，我们专注于互联网行业，利用自身积累的技术优势、行业经验、深度合作伙伴关系等，向广大中小型企业、政府机构等提供互联网行业的解决方案，乌审网站推广取得了明显的社会效益与经济效益。目前，我们服务的客户以成都为中心已经辐射到乌审省份的部分城市，未来相信会继续扩大服务区域并继续获得客户的支持与信任！

效果如下：

基本的UICollectionView使用方法请自己查询。

#import"CVViewController.h"

#import"CVCell.h"

#import"CVLayout.h"

@interfaceCVViewController ()

@end

@implementation CVViewController

- (void)viewDidLoad

{

   [superviewDidLoad];

   [self.collregisterClass:[CVCellclass]forCellWithReuseIdentifier:@"cell"];

   CVLayout *layout=[[CVLayoutalloc] init];

   [self.collsetCollectionViewLayout:layout];

}

- (void)didReceiveMemoryWarning

{

   [superdidReceiveMemoryWarning];

}

-(NSInteger)numberOfSectionsInCollectionView:(UICollectionView *)collectionView{

 return3;

}

-(NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section{

  return3;

}

-(UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath{

UICollectionViewCell *cell = [collectionViewdequeueReusableCellWithReuseIdentifier:@"cell"forIndexPath:indexPath];

return cell;

}

@end

其中CVCell是我自定义的一个

UICollectionViewCell

其中CVLayout是我自定义的一个

UICollectionViewLayout

接下来主要看一下自定义的layout

#import"CVLayout.h"

#import"CVDEView.h"

@implementation CVLayout

-(void)prepareLayout{

   [superprepareLayout];

   [self  registerClass:[CVDEView  class]forDecorationViewOfKind:@"CDV"];//注册Decoration View

}

-(CGSize)collectionViewContentSize{

  return  self.collectionView.frame.size;

}

- (UICollectionViewLayoutAttributes *)layoutAttributesForItemAtIndexPath:(NSIndexPath *)path

{

 UICollectionViewLayoutAttributes* attributes =     [UICollectionViewLayoutAttributeslayoutAttributesForCellWithIndexPath:path];

   attributes.size = CGSizeMake(215/3.0, 303/3.0);

   attributes.center=CGPointMake(80*(path.item+1), 62.5+125*path.section);

  return attributes;

}

//Decoration View的布局。

- (UICollectionViewLayoutAttributes *)layoutAttributesForDecorationViewOfKind:(NSString*)decorationViewKind atIndexPath:(NSIndexPath *)indexPath{

UICollectionViewLayoutAttributes* att = [UICollectionViewLayoutAttributeslayoutAttributesForDecorationViewOfKind:decorationViewKindwithIndexPath:indexPath];

   att.frame=CGRectMake(0, (125*indexPath.section)/2.0, 320, 125);

   att.zIndex=-1;

return att;

}

- (NSArray *)layoutAttributesForElementsInRect:(CGRect)rect{

NSMutableArray* attributes = [NSMutableArrayarray];

//把Decoration View的布局加入可见区域布局。

for (int y=0; y<3; y++) {

NSIndexPath* indexPath = [NSIndexPathindexPathForItem:3inSection:y];

       [attributesaddObject:[selflayoutAttributesForDecorationViewOfKind:@"CDV"atIndexPath:indexPath]];

   }

for (NSInteger i=0 ; i < 3; i++) {

for (NSInteger t=0; t<3; t++) {

NSIndexPath* indexPath = [NSIndexPathindexPathForItem:t inSection:i];

           [attributesaddObject:[selflayoutAttributesForItemAtIndexPath:indexPath]];

       }

   }

return attributes;

}

下面是最后的Decoration View的设计。

首先要继承

UICollectionReusableView

然后

@implementation CVDEView

- (id)initWithFrame:(CGRect)frame

{

self = [superinitWithFrame:frame];

if (self) {

UIImageView *p_w_picpathView=[[UIImageViewalloc] initWithFrame:frame];

       p_w_picpathView.p_w_picpath=[UIImagep_w_picpathNamed:@"BookShelfCell.png"];

       [selfaddSubview:p_w_picpathView];

   }

returnself;

}

OK。就可以看到上面图上的效果了。