CollectionView的使用

ColletionView(集合视图)是使用一个灵活的和可改变的布局来呈现一个有序的数据项集的方式。ColletionView最常见的用途是在网格状排列,但是在iOS集合视图可不仅仅是行和列。集合视图,精确的布局的视觉元素是定义通过子类时,可以动态地改变,所以你可以实现网格,栈,圆形布局,动态改变布局,或你能想象的任何类型的安排。


创建步骤:

(1)子类化UICollectionViewFlowLayout

(2)创建UIColletionView

(3)实现代理:UICollectionViewDataSource、UICollectionViewDelegate及第一步子类化后的布局代理


下面通过通过一个简单的demo来说明:

ViewController.m

#import "ViewController.h"
#import "ClassMatesCell.h"
#import "HPCollectionViewWaterfallLayout.h"

@interface ViewController ()<UICollectionViewDataSource,UICollectionViewDelegate,HPCollectionViewDelegateWaterfallLayout>

@property (nonatomic,strong)            UICollectionView *colletionView;
@property (nonatomic,strong)            NSMutableArray   *listData;

@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    // Do any additional setup after loading the view, typically from a nib.
     NSDictionary *dic1     = @{@"stu_name" : @"文字1"};
     NSDictionary *dic2     = @{@"stu_name" : @"文字2"};
     NSDictionary *dic3     = @{@"stu_name" : @"文字3"};
     NSDictionary *dic4     = @{@"stu_name" : @"文字4"};
     NSDictionary *dic5     = @{@"stu_name" : @"文字5"};
     NSDictionary *dic6     = @{@"stu_name" : @"文字6"};
     NSDictionary *dic7     = @{@"stu_name" : @"李晓7"};
     NSDictionary *dic8     = @{@"stu_name" : @"文字8"};
     NSDictionary *dic9     = @{@"stu_name" : @"文字9"};
     NSDictionary *dic10    = @{@"stu_name" : @"文字10"};
    
    _listData =[NSMutableArray arrayWithObjects:dic1,dic2,dic3,dic4,dic5,dic6,dic7,dic8,dic9,dic10 ,nil];
    
    [self createCollectionView];
}

- (void)createCollectionView
{
    if (!_colletionView) {
        
        HPCollectionViewWaterfallLayout *layout = [[HPCollectionViewWaterfallLayout alloc] init];
        layout.delegate=self;
        
        _colletionView = [[UICollectionView alloc] initWithFrame:self.view.bounds collectionViewLayout:layout];
        _colletionView.autoresizingMask = UIViewAutoresizingFlexibleHeight | UIViewAutoresizingFlexibleWidth;
        _colletionView.dataSource = self;
        _colletionView.delegate = self;
        _colletionView.backgroundColor = [UIColor clearColor];
        [_colletionView registerClass:[ClassMatesCell class] forCellWithReuseIdentifier:@"colletionviewcell"];
        [self.view addSubview:_colletionView];
    }
    else {
        [_colletionView reloadData];
    }
}

#pragma mark - UIColltionView datasource

- (NSInteger)numberOfSectionsInCollectionView:(UICollectionView *)collectionView{
    return 1;
}
- (NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section{
    
    return self.listData.count;
}
- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath{
    ClassMatesCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:@"colletionviewcell" forIndexPath:indexPath];
    NSUInteger row = [indexPath row];
    cell.tag = row + 1000;
    if ([self.listData count]>0) {
        NSDictionary *rowData = [self.listData objectAtIndex:(row)];
        [cell.imageView setImage:[UIImage imageNamed:@"money"]];
        //内容
        cell.nameLabel.text = [rowData  objectForKey:@"stu_name"];
    }
    return cell;
}


#pragma mark - HPCollectionViewDelegateWaterfallLayout
-(CGFloat)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout interItemSpaceForSection:(NSUInteger)section{
    return 0;
}
-(CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath *)indexPath{
    return CGSizeMake(100, 110);
}
-(NSUInteger)collectionView:(UICollectionView*)collectionView layout:(UICollectionViewLayout*)collectionViewLayout numberOfColumnsForSection:(NSUInteger)section{
    return section+3;
}

-(CGFloat)collectionView:(UICollectionView*)collectionView layout:(UICollectionViewLayout*)collectionViewLayout preferredColumnSpaceForSection:(NSUInteger)section{
    return 3;
}

- (void)didReceiveMemoryWarning {
    [super didReceiveMemoryWarning];
    // Dispose of any resources that can be recreated.
}

@end


想进一步了解UIColletionView使用方法,请访问:https://developer.apple.com/library/ios/documentation/WindowsViews/Conceptual/CollectionViewPGforIOS/Introduction/Introduction.html#//apple_ref/doc/uid/TP40012334-CH1-SW1



  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值