CollectionView的详细使用(一)

2017-10-16  本文已影响86人  凉白开0072

本人小白,欢迎各位大佬补充指点

基本知识点

tableView与collectionView比较

  1. 相同点
    1> 都是通过datasource和delegate驱动的(datasource和delegate),因此在使用的时候必须实现数据源与代理协议方法;
    2> 性能上都实现了循环利用的优化。
  2. 不同点
    1> UITableView的cell是系统自动布局好的,不需要我们布局。但是UICollectionView的cell是需要我们自己布局的。所以我们在创建UICollectionView的时候必须传递一个布局参数,系统提供并实现了一个布局样式:流水布局(UICollectionViewFlowLayout)
    2> UITableViewController的self.view == self.tableview;,但UICollectionViewController的self.view != self.collectionView;
    UICollectionViewController层次结构:控制器View 上面UICollectionView
    3> UITableView的滚动方式只能是垂直方向, UICollectionView既可以垂直滚动,也可以水平滚动;
    4> UICollectionView的cell只能通过注册来确定重用标识符。不能像tableViewcell一样initWith...
    5> 并不能直接设置cell的高度/section之间距离的数据源方法,只能通过设置layout来实现
    结论 : 换句话说,UITableView的布局是UICollectionView的flow layout布局的一种特殊情况,类比于同矩形与正方形的关系
    代码举例:
  UICollectionView *collection = [[UICollectionView alloc] init];
     collection.frame = frame;
     [self.view addSubview:collection];
     运行报错:
     reason: 'UICollectionView must be initialized with a non-nil layout parameter
     意思:collctionView初始化时必须要传一个非空布局(layout)参数(parameter);
     因此初始化方法如下:
  UICollectionView *collection = [[UICollectionView alloc] initWithFrame:frame collectionViewLayout:[[UICollectionViewFlowLayout alloc] init]];

UICollectionViewFlowLayout

   //一行代码足以,不需要向tableView2行代码
     layout.estimatedItemSize = CGSizeMake( 60, 60);

//设置滚动方向(默认垂直滚动)
scrollDirection
//每一组头视图的尺寸。如果是垂直方向滑动,则只有高起作用;如果是水平方向滑动,则只有宽起作用。
headerReferenceSize
//每一组尾部视图的尺寸。如果是垂直方向滑动,则只有高起作用;如果是水平方向滑动,则只有宽起作用。
footerReferenceSize
//每一组的内容缩进
sectionInset

代码举例:制作一个简单启动广告页

AppDelegate中代码
- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {
    UIWindow *window = [[UIWindow alloc] init];
    window.frame = [UIScreen mainScreen].bounds;
    window.rootViewController =[[CollectionViewController alloc] init];
    self.window = window;
    [window makeKeyAndVisible];
    return YES;
}
自定义的CollectionViewController控制器:
CollectionViewController.m文件
//  UICollection的基本使用-启动页制作
#import "ViewController.h"
#import "CollectionViewController.h"
@interface CollectionViewController ()
@end

@implementation CollectionViewController
static NSString * const reuseIdentifier = @"Cell";

- (void)viewDidLoad {
    [super viewDidLoad];
    //可以看到self.view != self.collectionView
    self.view.backgroundColor = [UIColor redColor];
    self.collectionView.backgroundColor = [UIColor greenColor];
    //取消弹簧效果
    self.collectionView.bounces = NO;
    self.collectionView.showsHorizontalScrollIndicator = NO;
    self.collectionView.pagingEnabled = YES;
    //1.必须通过注册cell
    [self.collectionView registerClass:[UICollectionViewCell class] forCellWithReuseIdentifier:reuseIdentifier];
}
//2.重写init方法,传值layout
// 初始化的时候必须设置布局参数,通常使用系统提供的流水布局UICollectionViewFlowLayout
-(instancetype)init{
    UICollectionViewFlowLayout *layout = [[UICollectionViewFlowLayout alloc] init];
    // 设置滚动的方向
    layout.scrollDirection = UICollectionViewScrollDirectionHorizontal;
    // 设置cell的尺寸
    layout.itemSize = [UIScreen mainScreen].bounds.size;
    // 设置cell之间间距
    layout.minimumInteritemSpacing = 0;
    // 设置行距
    layout.minimumLineSpacing = 0;
    // 设置每一组的内间距
    //    layout.sectionInset = UIEdgeInsetsMake(0, 10, 0, 10);
    return [super initWithCollectionViewLayout:layout];
}
//3.实现代理数据源方法
#pragma mark <UICollectionViewDataSource>
//返回多少组
- (NSInteger)numberOfSectionsInCollectionView:(UICollectionView *)collectionView {
    return 1;
}
//每组多少个cell
- (NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section {
    return 4;;
}
//返回展示的cell
- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath {
    //自定义cell,在cell里面放一张图片即可(略)
    UICollectionViewCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:reuseIdentifier forIndexPath:indexPath];
    [cell.contentView addSubview:[UISwitch new]];
    cell.backgroundColor = [UIColor blueColor];
    return cell;
}
#pragma mark <UICollectionViewDelegate>
//点击最后一张时替换掉keyWindow的rootViewcontroller
-(void)collectionView:(UICollectionView *)collectionView didSelectItemAtIndexPath:(NSIndexPath *)indexPath{
    if (indexPath.item == 3) {
        UIWindow *keyWindow = [UIApplication sharedApplication].keyWindow;
        UIViewController *VC = [[UIStoryboard storyboardWithName:@"Main" bundle:nil] instantiateInitialViewController];
        keyWindow.rootViewController = VC;
    }
}
//在这里检测到,一旦替换掉,当前控制器就会被销毁
-(void)dealloc{
    NSLog(@"对象已经销毁");
}
@end

效果图如下

Untitled1.gif
上一篇 下一篇

猜你喜欢

热点阅读