京东产品列表模仿之UICollectionView

由于工作需要，必须要实现一个类似京东的产品列表，左边产品类型，右边产品列表。点击不同的产品类型产品列表随之变化的功能；

#import"ViewController.h"
// 要使用UICollectionView必须要实现的两个代理协议
// UICollectionViewDataSource:数据源协议  这个和tableview比较类似
// UICollectionViewDelegateFlowLayout布局协议 这个是独有的 创建UICollectionView的时候必须跟上布局，不然会崩溃
@interfaceViewController()<UICollectionViewDataSource,UICollectionViewDelegateFlowLayout>

@property(strong,nonatomic)UICollectionView*collectionView;

@end

@implementationViewController

- (void)viewDidLoad {

[superviewDidLoad];

//确定是水平滚动，还是垂直滚动

UICollectionViewFlowLayout*flowLayout=[[UICollectionViewFlowLayoutalloc]init];

[flowLayoutsetScrollDirection:UICollectionViewScrollDirectionVertical];

self.collectionView=[[UICollectionViewalloc]initWithFrame:CGRectMake(0,20,self.view.bounds.size.width,self.view.bounds.size.height)collectionViewLayout:flowLayout];

self.collectionView.dataSource=self;

self.collectionView.delegate=self;

//self.collectionView.delegate = self; 这里要特别注意不能写成这样，必须分开成两句写才有效，否则出来的是空白

[self.collectionViewsetBackgroundColor:[UIColorclearColor]];

//注册Cell，必须要有

[self.collectionView registerClass:[UICollectionViewCell class]forCellWithReuseIdentifier:@"UICollectionViewCell"];

[self.view addSubview:self.collectionView];

}

#pragma mark -- UICollectionViewDataSource

//定义展示的UICollectionViewCell的个数

-(NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section
{
        return10;
}

//定义展示的Section的个数

-(NSInteger)numberOfSectionsInCollectionView:(UICollectionView *)collectionView
{
        return1;
}
//每个UICollectionView展示的内容

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

{

staticNSString* CellIdentifier =@"UICollectionViewCell";

UICollectionViewCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:CellIdentifier forIndexPath:indexPath];

cell.backgroundColor= [UIColorcolorWithRed:((10* indexPath.row) /255.0)green:((20* indexPath.row)/255.0)blue:((30* indexPath.row)/255.0)alpha:1.0f];

UILabel *label = [[UILabel alloc]initWithFrame:CGRectMake(0,0,20,20)];

label.textColor= [UIColorredColor];

label.text= [NSStringstringWithFormat:@"%ld",(long)indexPath.row];

for(idsubViewincell.contentView.subviews) {

[subViewremoveFromSuperview];

}

[cell.contentViewaddSubview:label];

returncell;

}

#pragma mark --UICollectionViewDelegateFlowLayout

//定义每个Item的大小

- (CGSize)collectionView:(UICollectionView*)collectionView layout:(UICollectionViewLayout*)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath*)indexPath

{

returnCGSizeMake(300,70);

}

//定义每个UICollectionView的margin

-(UIEdgeInsets)collectionView:(UICollectionView*)collectionView layout:(UICollectionViewLayout*)collectionViewLayout insetForSectionAtIndex:(NSInteger)section

{

returnUIEdgeInsetsMake(0,0,0,0);

}

#pragma mark --UICollectionViewDelegate

//UICollectionView被选中时调用的方法

-(void)collectionView:(UICollectionView*)collectionView didSelectItemAtIndexPath:(NSIndexPath*)indexPath

{

NSLog(@"item======%ld",(long)indexPath.item);

NSLog(@"row=======%ld",(long)indexPath.row);

NSLog(@"section===%ld",(long)indexPath.section);

}

//返回这个UICollectionView是否可以被选择

-(BOOL)collectionView:(UICollectionView*)collectionView shouldSelectItemAtIndexPath:(NSIndexPath*)indexPath

{

returnYES;

}

@end

运行效果如下图：