1. Create a custom Uicollectionviewcell
Selected works, right key-new File ... Select "Cocoa Touch Class"-next, choose to inherit from the Uicollectionviewcell class, give a reasonable name Collectionviewcell, and then complete the Next.
1 creating
Define the controls you need in the Uicollectionviewcell
Image
@property (strong,nonatomic) Uiimageview *fruitimage;
Title
@property (strong,nonatomic) Uilabel *fruittitle;
Price
@property (strong,nonatomic) Uilabel *pricelabel;
overriding in UICOLLECTIONVIEWCELL.M files
-(Instancetype) initWithFrame: (CGRect) frame{
self = [super Initwithframe:frame];
if (self) {
_fruitimage = [[Uiimageview alloc]initwithframe:cgrectmake (0, 0, kscreenwidth/2-1, kscreenheight/3.4)];
_fruitimage.image = [UIImage imagenamed:@ "Pic_fruit"];
[Self.contentview Addsubview:_fruitimage];
_fruittitle = [[Uilabel alloc]initwithframe:cgrectmake (7, kscreenheight/3.4, Kscreenwidth/2-6, 50)];
_fruittitle.numberoflines = 0;
_fruittitle.font = [Uifont systemfontofsize:13];
_fruittitle.textcolor = [Uicolor Graycolor];
[Self.contentview Addsubview:_fruittitle];
}
return self;
}
2. Create a Uicollectionview instance in the Viewcontroller.m file
Create CollectionView
-(void) creatcollectionview{
1. Initialization of layout
Uicollectionviewflowlayout *layout = [[Uicollectionviewflowlayout alloc] init];
Set CollectionView scrolling Direction
[Layout setscrolldirection:uicollectionviewscrolldirectionhorizontal];
Set the size of the Headerview
Layout.headerreferencesize = Cgsizemake (kscreenwidth, 100);
This method can also be set itemsize
Layout.itemsize =cgsizemake (0, 150);
2. Initialization of CollectionView
Maincollectionview = [[Uicollectionview alloc]initwithframe:cgrectmake (0, kscreenheight/1.1, KScreenWidth, kscreenheight*1.6) Collectionviewlayout:layout];
[Self.updownscrollview Addsubview:maincollectionview];
Maincollectionview.backgroundcolor = [Uicolor colorwithred:235/255.0 green:235/255.0 blue:235/255.0 alpha:1];
3. Register Collectionviewcell
Note that the reuseidentifier must be consistent with the Cellforitematindexpath method cellid
[Maincollectionview Registerclass:[fruitcollectionviewcell class] forcellwithreuseidentifier:@ "CellId"];
Registration Headerview Here The Reuseidentifier must be consistent with the Cellforitematindexpath method Reusableview
[Maincollectionview Registerclass:[uicollectionreusableview class] Forsupplementaryviewofkind: Uicollectionelementkindsectionheader withreuseidentifier:@ "Reusableview"];
4. Set up Agent
Maincollectionview.delegate = self;
Maincollectionview.datasource = self;
}
3. Implement Uicollectionview Proxy method
#pragma mark CollectionView Agent method
Returns the number of section
-(Nsinteger) Numberofsectionsincollectionview: (Uicollectionview *) CollectionView
{
return 1;
}
Item count for each section
-(Nsinteger) CollectionView: (Uicollectionview *) CollectionView numberofitemsinsection: (NSInteger) Section
{
return 6;
}
-(Uicollectionviewcell *) CollectionView: (Uicollectionview *) CollectionView Cellforitematindexpath: (NSIndexPath *) Indexpath
{
Fruitcollectionviewcell *cell = (Fruitcollectionviewcell *) [CollectionView dequeuereusablecellwithreuseidentifier:@ "Cellid" Forindexpath:indexpath];
if (indexpath.section = = 0 && indexpath.row = 1) {
Cell.fruitTitle.text = @ "Authentic Taiwanese specialty Tropical Banana delicious packet mail 123";
}else{
Cell.fruitTitle.text = @ "Hot imports of Malaysian specialties big Golden Dragon Mango packet mail 500g";
}
Cell.backgroundcolor = [Uicolor Whitecolor];
return cell;
}
Set the size of each item
-(Cgsize) CollectionView: (Uicollectionview *) CollectionView layout: (uicollectionviewlayout *) collectionviewlayout Sizeforitematindexpath: (Nsindexpath *) Indexpath
{
Return Cgsizemake (kscreenwidth/2-4, kscreenheight/2.5);
}
Size of the footer
-(Cgsize) CollectionView: (Uicollectionview *) CollectionView layout: (Uicollectionviewlayout *) Collectionviewlayout referencesizeforfooterinsection: (nsinteger) Section
//{
Return Cgsizemake (10, 10);
//}
Size of header
-(Cgsize) CollectionView: (Uicollectionview *) CollectionView layout: (Uicollectionviewlayout *) Collectionviewlayout referencesizeforheaderinsection: (nsinteger) Section
//{
Return Cgsizemake (10, 10);
//}
Set the uiedgeinsets for each item
-(Uiedgeinsets) CollectionView: (Uicollectionview *) CollectionView layout: (Uicollectionviewlayout *) Collectionviewlayout Insetforsectionatindex: (nsinteger) Section
{
Return Uiedgeinsetsmake (0, 2, 0, 2);
}
Set Horizontal spacing per item
-(CGFloat) CollectionView: (Uicollectionview *) CollectionView layout: (uicollectionviewlayout *) collectionviewlayout Minimuminteritemspacingforsectionatindex: (Nsinteger) Section
{
return 2;
}
Set vertical spacing for each item
-(CGFloat) CollectionView: (Uicollectionview *) CollectionView layout: (uicollectionviewlayout *) collectionviewlayout Minimumlinespacingforsectionatindex: (Nsinteger) Section
{
return 5;
}
Set the Supplementaryviewofkind to set the view on the head or bottom, where the Reuseidentifier value must be the same as the registration, in this case "Reusableview"
-(Uicollectionreusableview *) CollectionView: (Uicollectionview *) CollectionView Viewforsupplementaryelementofkind: (NSString *) kind Atindexpath: (Nsindexpath *) Indexpath
//{
Uicollectionreusableview *headerview = [CollectionView dequeuereusablesupplementaryviewofkind: Uicollectionelementkindsectionheader withreuseidentifier:@ "Reusableview" Forindexpath:indexpath];
Headerview.backgroundcolor =[uicolor Graycolor];
Uilabel *label = [[Uilabel alloc] initWithFrame:headerView.bounds];
Label.text = @ "This is CollectionView's head";
Label.font = [Uifont systemfontofsize:20];
[Headerview Addsubview:label];
return headerview;
//}
Click Item method
-(void) CollectionView: (Uicollectionview *) CollectionView Didselectitematindexpath: (Nsindexpath *) IndexPath
{
Fruitcollectionviewcell *cell = (Fruitcollectionviewcell *) [CollectionView Cellforitematindexpath:indexpath];
NSString *msg = Cell.fruitTitle.text;
NSLog (@ "%@", msg);
}
See here believe you have mastered the use of Uicollectionview