IOS development-UI (3) Collection, ios-ui
Knowledge Point
1. Create UICollectionView
2. Common proxy methods for UICollectionView
3. UICollectionView-related XIB operations
======================================
Create UICollectionView
1. UICollectionViewLayout
Role: an abstract class that controls the layout of collectionView
Note: This class is generally not used directly, because many methods of this class are not implemented, but many attributes and methods are defined. to customize the layout, you must create a class to inherit from UICollectionViewLayout, then set the custom Layout
2. UICollectionViewFlowLayout
Role: A waterfall flow layout written by the System
// Use a waterfall stream layout written by the System
UICollectionViewFlowLayout * layout = [UICollectionViewFlowLayout new];
/*
UICollectionViewScrollDirectionVertical,
Uicollectionviewscrolldirehorhorizontal
*/
// Set the sliding direction
Layout. scrollDirection = UICollectionViewScrollDirectionVertical;
// Set the minimum spacing between items (horizontal and vertical)
Layout. minimumInteritemSpacing = 35;
// Set the minimum spacing between items (Vertical spacing indicated by vertical sliding and horizontal sliding)
Layout. minimumLineSpacing = 10;
3.-(instancetype) initWithFrame :( CGRect) frame collectionViewLayout :( UICollectionViewLayout *) layout;
Purpose: Create a UICollectionView. A UICollectionViewLayout must be provided.
// Instantiate a UICollectionView
UICollectionView * collectionView = [[UICollectionView alloc] initWithFrame: self. view. bounds collectionViewLayout: layout];
4. Protocol proxy
1) UICollectionViewDataSource
2) UICollectionViewDelegateFlowLayout
======================================
Common proxy methods for UICollectionView
# Proxy method of pragma mark-UICollectionView
1.-(NSInteger) numberOfSectionsInCollectionView :( UICollectionView *) collectionView
Role: number of returned groups
-(NSInteger) collectionView :( UICollectionView *) collectionView numberOfItemsInSection :( NSInteger) section {
Return 10;
}
2.-(NSInteger) collectionView :( UICollectionView *) collectionView numberOfItemsInSection :( NSInteger) section;
Purpose: return the number of elements.
// Returns the number of all elements in each group.
-(NSInteger) collectionView :( UICollectionView *) collectionView numberOfItemsInSection :( NSInteger) section
{
Return 10;
}
3.-(UICollectionViewCell *) collectionView :( UICollectionView *) collectionView cellForItemAtIndexPath :( NSIndexPath *) indexPath;
Purpose: return the UICollectionViewCell used by the element.
// Return the UICollectionViewCell object used by each element
-(UICollectionViewCell *) collectionView :( UICollectionView *) collectionView cellForItemAtIndexPath :( NSIndexPath *) indexPath
{
// Reuse the queue to find the cell
UICollectionViewCell * cell = [collectionView dequeueReusableCellWithReuseIdentifier: @ "cell" forIndexPath: indexPath];
// Change the background color
Cell. backgroundColor = [UIColor redColor];
Return cell;
}
4.-(CGSize) collectionView :( UICollectionView *) collectionView layout :( UICollectionViewLayout *) collectionViewLayout sizeForItemAtIndexPath :( NSIndexPath *) indexPath;
Purpose: return the CGSize of the element.
// Modify the width and height of each item
-(CGSize) collectionView :( UICollectionView *) collectionView layout :( UICollectionViewLayout *) collectionViewLayout sizeForItemAtIndexPath :( NSIndexPath *) indexPath {
Return CGSizeMake (100,100 );
}
5.-(CGFloat) collectionView :( UICollectionView *) collectionView layout :( UICollectionViewLayout *) collectionViewLayout minimumInteritemSpacingForSectionAtIndex :( NSInteger) section;
Purpose: return the minimum allowed spacing between elements. If it is horizontal sliding, it indicates the vertical distance. If it is vertical sliding, it indicates the horizontal distance.
// The effect is the same as layout. minimumInteritemSpeacing. Either of them is true.
-(CGFloat) collectionView :( UICollectionView *) collectionView layout :( UICollectionViewLayout *) collectionViewLayout minimumInteritemSpacingForSectionAtIndex :( NSInteger) section {
}
6.-(CGFloat) collectionView :( UICollectionView *) collectionView layout :( UICollectionViewLayout *) collectionViewLayout minimumLineSpacingForSectionAtIndex :( NSInteger) section;
Purpose: return the minimum allowed spacing between elements. horizontal sliding means horizontal distance. Vertical Sliding means vertical distance.
// The effect is the same as that of layout. minimumLineSpacing.
-(CGFloat) collectionView :( UICollectionView *) collectionView layout :( UICollectionViewLayout *) collectionViewLayout minimumLineSpacingForSectionAtIndex :( NSInteger) section {
}
7.-(UIEdgeInsets) collectionView :( UICollectionView *) collectionView layout :( UICollectionViewLayout *) collectionViewLayout insetForSectionAtIndex :( NSInteger) section
Purpose: control the distance between a group of views and the screen boundary (top, left, bottom, right ).
// Return the distance between each group of elements and the four boundary of the screen (top, left, bottom, right)
-(UIEdgeInsets) collectionView :( UICollectionView *) collectionView layout :( UICollectionViewLayout *) collectionViewLayout insetForSectionAtIndex :( NSInteger) section {
// Create a structure of UIEdgeInsets
Return UIEdgeInsetsMake (10, 10, 10, 10 );
}
8.-(CGSize) collectionView :( UICollectionView *) collectionView layout :( UICollectionViewLayout *) collectionViewLayout referenceSizeForHeaderInSection :( NSInteger) section
Purpose: return the CGSize of the header view. For horizontal sliding, the width is valid. For vertical sliding, only the height is valid.
// Return the width and height of the header View
-(CGSize) collectionView :( UICollectionView *) collectionView layout :( UICollectionViewLayout *) collectionViewLayout referenceSizeForHeaderInSection :( NSInteger) section {
// Note: For vertical sliding, only the height is valid. For horizontal sliding, only the width is valid.
Return CGSizeMake (50, 50 );
}
9.-(UICollectionReusableView *) collectionView :( UICollectionView *) collectionView viewForSupplementaryElementOfKind :( NSString *) kind atIndexPath :( NSIndexPath *) indexPath
Purpose: Return to the header view.
// Return the UICollectionReusableView object used by the header and tail views.
-(UICollectionReusableView *) collectionView :( UICollectionView *) collectionView viewForSupplementaryElementOfKind :( NSString *) kind atIndexPath :( NSIndexPath *) indexPath {
// Because this method is required for the instantiation of the header and tail views, you need to use kind to determine whether the generated header view or tail view is
If ([kind isEqualToString: UICollectionElementKindSectionHeader]) {
// Indicates that the header view needs to be created.
// Create a header view in the form of reuse
UICollectionReusableView * headerView = [collectionView dequeueReusableSupplementaryViewOfKind: UICollectionElementKindSectionHeader withReuseIdentifier: @ "header" forIndexPath: indexPath];
// Change the background color
HeaderView. backgroundColor = [UIColor greenColor];
Return headerView;
}
Return nil;
}
10.-(void) collectionView :( UICollectionView *) collectionView didSelectItemAtIndexPath :( NSIndexPath *) indexPath;
Purpose: select an element.
// Select an item
-(Void) collectionView :( UICollectionView *) collectionView didSelectItemAtIndexPath :( NSIndexPath *) indexPath {
NSLog (@ "% ld", indexPath. section, indexPath. item );
}