This chapter introduces UICollectionView and its common methods in general, and then combines an example to understand how to use UICollectionView.

UICollectionView and UICollectionViewController iOS6 is newly introduced API that is used to display a collection of view, the layout is more flexible, which can realize multi-column layouts, Usage is similar to the UITableView and UITableViewController classes. Using UICollectionView must implement UICollectionViewDataSource UICollectionViewDelegate, UICollectionViewDelegateFlowLayout these three agreements.

As a developer, it’s especially important to have a learning atmosphere and a networking community, and this is one of my iOS networking groups:812157648, no matter you are small white or big ox welcome to enter, share BAT, Ali interview questions, interview experience, discuss technology, we exchange learning growth together!

Here are some commonly used methods. (Only common ones are given, others can be viewed related APIS)

#pragma mark -- UICollectionViewDataSource  
Copy the code
// Define the number of uICollectionViewCells displayed -(NSInteger)collectionView (UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section { return 30; }Copy the code
/ / definition of the number of Section - (NSInteger) numberOfSectionsInCollectionView: (UICollectionView *) collectionView {return 1; }Copy the code
(UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath { static NSString * CellIdentifier = @"GradientCell"; UICollectionViewCell * cell = [collectionView dequeueReusableCellWithReuseIdentifier:CellIdentifier forIndexPath:indexPath]; Cell. BackgroundColor = [UIColor colorWithRed:((10 * indepath.row)/255.0) green:((20 * indepath.row)/255.0) blue:((30 * indexPath. Row) / 255.0) alpha: 1.0 f]; return cell; }Copy the code
#pragma mark --UICollectionViewDelegateFlowLayout 
Copy the code
// define the size of each UICollectionView - (CGSize)collectionView:(UICollectionView * layout:(UICollectionViewLayout*)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath *)indexPath { return CGSizeMake(96, 100); }Copy the code
// Define the margin -(UIEdgeInsets)collectionView (UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout insetForSectionAtIndex:(NSInteger)section { return UIEdgeInsetsMake(5, 5, 5, 5); }Copy the code
#pragma mark --UICollectionViewDelegate   
Copy the code
// the method called when UICollectionView is selected -(void)collectionView:(UICollectionView *)collectionView didSelectItemAtIndexPath:(NSIndexPath *)indexPath { UICollectionViewCell * cell = (UICollectionViewCell *)[collectionView cellForItemAtIndexPath:indexPath]; cell.backgroundColor = [UIColor whiteColor]; }Copy the code
-(BOOL)collectionView:(UICollectionView *)collectionView shouldSelectItemAtIndexPath:(NSIndexPath *)indexPath { return YES; }Copy the code

The following is a specific introduction through an example. (Examples from the Internet. However, it is obtained through a third party and cannot be linked. Excuse me.) OS CollectionView is a great benefit. It is no longer necessary to use TableView to define complex multi-column tables. The usage is similar to Table, except that cells must be added by themselves. So general or custom is convenient and fast

1. Customize the Cell1. Create class CollectionCell inherited from UICollectionViewCell

2. Create a Xib and name it CollectionCell.xib

A. Select CollectionCell.xib and delete the default View. Drag a Collection View Cell (Figure 3) from the control onto the canvas and set the size to 95*116.

B. Select the newly added Cell and change the class name to CollectionCell, as shown in Figure 4

C. Add an ImageView and a Label to the ectionCell of CollectionCell. Xib

D. Create the mapping, figure 6, Figure 7!

E. Select CollectionCell.m and override the init method

- (id)initWithFrame:(CGRect)frame { self = [super initWithFrame:frame]; NSArray *arrayOfViews = [[NSBundle mainBundle] loadNibNamed:@" collectionCell" owner:self options:nil]; // Return nil if (arrayofviews.count < 1) {return nil; } // If the view in the xib does not belong to the UICollectionViewCell class, return nil if (! [[arrayOfViews objectAtIndex:0] isKindOfClass:[UICollectionViewCell class]]) { return nil; } self = [arrayOfViews objectAtIndex:0]; } return self; }Copy the code

F. Select CollectionCell.xib and change its identifier to CollectionCell.

Define UICollectionView;

1. Drag a Collection View to the View of the specified ViewController

2. Connect dataSource and Delegate, and create a mapping called CollectionView

3. Select the ruler of the CollectionView and change the Width and Height of the Cell Size to 95*116, the same as those of the customized Cell, as shown in Figure 8

CollectionViewCell is a Class that is inherited from the EctionCell, and its properties can be changed, such as Vertical or Horizontal sliding, Vertical or Horizontal sliding

CollectionCell; CollectionCell; CollectionCell; CollectionCell; CollectionCell; CollectionCell;

[self.collectionView registerClass:[CollectionCell class] forCellWithReuseIdentifier:@"CollectionCell"];  
Copy the code

6. Declare the proxy in viewController.h

@interface ViewController : UIViewController<UICollectionViewDataSource,UICollectionViewDelegate>  
Copy the code

7. Implement proxy methods in.m files

// number of items per section -(NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section { return 12; } -(UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath { CollectionCell *cell = (CollectionCell *)[collectionView dequeueReusableCellWithReuseIdentifier:@"CollectionCell" forIndexPath:indexPath]; NSString *imageToLoad = [NSString stringWithFormat:@"%d.png", indexpath.row]; Imageview. image = [UIImage imageNamed:imageToLoad]; Cell.label. text = [NSString stringWithFormat:@"{%ld,%ld}",(long) indepath. row,(long) indepath.section]; return cell; }Copy the code

8. The effect is shown in Figure 10

Click on a jump event similar to UITableView to implement the proxy method

-(void)collectionView:(UICollectionView *)collectionView didSelectItemAtIndexPath:(NSIndexPath *)indexPath  
Copy the code

Can, not repeat

The apple bar

The original address: www.cnblogs.com/ios8/p/iOS-…