您的位置:首页 > 产品设计 > UI/UE

iOS开发 -- UICollectionView(集合视图)

2015-09-21 08:34 676 查看
UICollectionView 是一个新型的展示数据的视图,他和TableView一样 使用起来一样 都需要设置dataSource 和 delegate 只不过collectionView对应cell的设置比较复杂 可以实现很炫的效果

注意:

- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {
self.window = [[UIWindow alloc] initWithFrame:[[UIScreen mainScreen] bounds]];
// Override point for customization after application launch.
self.window.backgroundColor = [UIColor whiteColor];
[self.window makeKeyAndVisible];

//LineLayout是第三方的封装好的类
LineLayout *layout = [[LineLayout alloc]init];

//在使用UICollectionViewController时候 在创建初始时候就需要给定一个布局对象

ROOTViewController *rootVC = [[[ROOTViewController alloc]initWithCollectionViewLayout:layout]autorelease];

UINavigationController *naVC = [[[UINavigationController alloc]initWithRootViewController:rootVC]autorelease];

self.window.rootViewController = naVC;

return YES;
}


代码举例:

#import "RootViewController.h"
#import "MyCell.h"
#import "MyHeader.h"

@interface RootViewController ()<UICollectionViewDelegate,UICollectionViewDataSource,UICollectionViewDelegateFlowLayout>
@end

@implementation RootViewController
- (void)viewDidLoad {
[super viewDidLoad];
//设置title
self.navigationItem.title = @"集合视图";
//布局UICollectionView
[self layoutCollectionView];
}
-(void)layoutCollectionView{
//创建布局对象
UICollectionViewFlowLayout *layout = [[UICollectionViewFlowLayout alloc]init];
//    //设置cell大小
//    layout.itemSize = CGSizeMake(90, 120);
//    //设置上下间距
//    layout.minimumLineSpacing = 23;
//    //设置左右间距
//    layout.minimumInteritemSpacing =75/5;
//

//    //设置距离屏幕边缘的边距
//    layout.sectionInset = UIEdgeInsetsMake(33, 20, 50, 30);
//    //设置滚动方向
//    layout.scrollDirection = UICollectionViewScrollDirectionHorizontal;  //水平滚动

//1 创建控件对象  创建初始必须给定义cell布局对象
UICollectionView *collectionView = [[UICollectionView alloc]initWithFrame:self.view.bounds collectionViewLayout:layout];
//2 配置属性  collectionView默认背景颜色是黑色
collectionView.backgroundColor = [UIColor cyanColor];

//3 添加父视图
[self.view addSubview:collectionView];
//4 释放所有权
[collectionView release];

//设置代理
collectionView.delegate = self;
//设置数据源
collectionView.dataSource = self;

//注册cell

//不用xib  [collectionView registerClass:[UICollectionViewCell class] forCellWithReuseIdentifier:@"cell"];
//用xib
[collectionView registerNib:[UINib nibWithNibName:@"MyCell" bundle:[NSBundle mainBundle]] forCellWithReuseIdentifier:@"cell"];

//注册页眉
//不用xib [collectionView registerClass:[UICollectionReusableView class] forSupplementaryViewOfKind:UICollectionElementKindSectionHeader withReuseIdentifier:@"header"];
//     //注册页脚
//  [collectionView registerClass:[UICollectionReusableView class] forSupplementaryViewOfKind:UICollectionElementKindSectionFooter withReuseIdentifier:@"footer"];

//用xib
[collectionView registerNib:[UINib nibWithNibName:@"MyHeader" bundle:[NSBundle mainBundle]] forSupplementaryViewOfKind:UICollectionElementKindSectionHeader withReuseIdentifier:@"header"];
[collectionView registerNib:[UINib nibWithNibName:@"MyHeader" bundle:[NSBundle mainBundle]] forSupplementaryViewOfKind:UICollectionElementKindSectionFooter withReuseIdentifier:@"footer"];
}


#pragma mark -- UICollectionViewDataSource UICollectionViewDelegate
//分区数
-(NSInteger)numberOfSectionsInCollectionView:(UICollectionView *)collectionView{
return 5;
}
//行数(Item  数)
-(NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section{
return 15;
}
//设置cell
-(UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath{
MyCell *cell =  [collectionView dequeueReusableCellWithReuseIdentifier:@"cell" forIndexPath:indexPath];
cell.backgroundColor = [UIColor purpleColor];
//赋值
cell.textLB.text = [NSString stringWithFormat:@"S:%ld R:%ld",indexPath.section,indexPath.row];
cell.pic_imageView.image = [UIImage imageNamed:@"yyy.jpg"];

return cell;
}

//设置页眉 页脚
-(UICollectionReusableView *)collectionView:(UICollectionView *)collectionView viewForSupplementaryElementOfKind:(NSString *)kind atIndexPath:(NSIndexPath *)indexPath{
UICollectionReusableView *resuableView = nil;

if ([kind isEqualToString:UICollectionElementKindSectionHeader]) {
//获取header
resuableView = [collectionView dequeueReusableSupplementaryViewOfKind:kind withReuseIdentifier:@"header" forIndexPath:indexPath];
resuableView.backgroundColor = [UIColor brownColor];

((MyHeader *)resuableView).titleLB.text = [NSString stringWithFormat:@"第%ld分区",indexPath.section];

}else if ([kind isEqualToString:UICollectionElementKindSectionFooter]){
//获取footer
resuableView = [collectionView dequeueReusableSupplementaryViewOfKind:kind withReuseIdentifier:@"footer" forIndexPath:indexPath];
resuableView.backgroundColor = [UIColor redColor];
}
return resuableView;

}


#pragma  mark - UICollectionViewDelegateFlowLayout
//item 大小
-(CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath *)indexPath{
return CGSizeMake(90, 120);
}
//设置item 左右间距
-(CGFloat)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout minimumInteritemSpacingForSectionAtIndex:(NSInteger)section{
return 105/4;
}

//设置距离屏幕边缘的边距
-(UIEdgeInsets)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout insetForSectionAtIndex:(NSInteger)section{
//UIEdgeInsetsMake 上左下右
//    if (section ==0) {
//        return UIEdgeInsetsMake(100, 20, 50, 20);
//    }
return UIEdgeInsetsMake(50, 20, 50, 20);
}

//设置页眉大小
-(CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout referenceSizeForHeaderInSection:(NSInteger)section{
return CGSizeMake(375, 50);
}
//设置页脚大小
-(CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout referenceSizeForFooterInSection:(NSInteger)section{
return CGSizeMake(375, 50);
}

@end
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: