Uicollectionviewcell “left display”

Time:2021-2-13

1、 Preparation

1.UICollectionView Left Aligned Layout


2、 Project catalogue


3、 Custom uicollectionviewcell

Collectionviewcell. H creates the uilabel property to pass values

#import <UIKit/UIKit.h>
@interface CollectionViewCell : UICollectionViewCell
@property (nonatomic, strong) UILabel *titleLB;;
@end

Collectionviewcell. M creates a display text view

  • Here, the text size of titlelb should be the same as the calculated text size

#import "CollectionViewCell.h"
@implementation CollectionViewCell

- (instancetype)initWithFrame:(CGRect)frame{
    self = [super initWithFrame:frame];
    if (self) {
        self.backgroundColor = [UIColor colorWithRed:251/255.0 green:74/255.0 blue:71/255.0 alpha:1];
        self.layer.cornerRadius = 3;
        self.layer.masksToBounds = YES;
        self.layer.borderColor = [UIColor lightTextColor].CGColor;
        self.layer.borderWidth = 0.5;
        
        [self createSubViews];
    }
    return self;
}

- (void)createSubViews{
    _titleLB = [[UILabel alloc] initWithFrame:CGRectMake(0, 0, self.frame.size.width, self.frame.size.height)];
    //_titleLB.backgroundColor = [UIColor yellowColor];
    _titleLB.textColor = [UIColor whiteColor];
    _titleLB.textAlignment = NSTextAlignmentCenter;
    _titleLB.font = [UIFont systemFontOfSize:14];
    [self.contentView addSubview:_titleLB];
}
@end

4、 Creating uicollectionview in viewcontroller

ViewController.h

#import <UIKit/UIKit.h>
@interface ViewController : UIViewController

@end

ViewController.m

#import "ViewController.h"
#import "UICollectionViewLeftAlignedLayout.h"
#import "CollectionViewCell.h"
@interface ViewController ()<UICollectionViewDataSource, UICollectionViewDelegate, UICollectionViewDelegateFlowLayout>

@end

@implementation ViewController{
    NSArray *_allTextArr;
}

- (void)viewDidLoad {
    [super viewDidLoad];
    // Do any additional setup after loading the view, typically from a nib.
    self.view.backgroundColor = [UIColor whiteColor];
    [self initailData];
    [self createMianView];
}

/**
 *Virtual data
 */
- (void)initailData{
    _ Alltextarr = @ [@ "19 roses gift box", @ "19 red roses gift box + lily", @ "33 red roses gift box", @ "33 red roses gift box (love for three generations)", @ "33 champagne roses gift box (birthday recommendation), @" 38 red roses heart to heart gift box (love at first sight) ", @" 19 red roses gift box (hot sale recommendation), @ "19 pink roses gift box (hot sale recommendation), @" 19 mixed color roses gift box "];
}

/**
 *Create view
 */
- (void)createMianView{
    //Left constraint
     UICollectionViewLeftAlignedLayout *leftAlignedLayout = [[UICollectionViewLeftAlignedLayout alloc] init];
    leftAlignedLayout.minimumLineSpacing  =10; // minimum row spacing
    leftAlignedLayout.minimumInteritemSpacing  =10; // minimum column spacing
    leftAlignedLayout.sectionInset  =Uiedgeinsetsmake (20, 20, 20, 20); // space between top left bottom right of grid
    
    //Grid
    UICollectionView *mainCollectionView = [[UICollectionView alloc] initWithFrame:CGRectMake(0, 0, self.view.frame.size.width, self.view.frame.size.height) collectionViewLayout:leftAlignedLayout];
    mainCollectionView.backgroundColor = [UIColor whiteColor];
    mainCollectionView.dataSource = self;
    mainCollectionView.delegate = self;
    [self.view addSubview:mainCollectionView];
    [mainCollectionView registerClass:[CollectionViewCell class] forCellWithReuseIdentifier:@"cell"];
}

- (void)didReceiveMemoryWarning {
    [super didReceiveMemoryWarning];
    // Dispose of any resources that can be recreated.
}

#pragma mark -UICollectionViewDataSource
//Item content
- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath{
    CollectionViewCell *cell = (CollectionViewCell *)[collectionView dequeueReusableCellWithReuseIdentifier:@"cell" forIndexPath:indexPath];
    cell.titleLB.text = [NSString stringWithFormat:@"%@", [_allTextArr objectAtIndex:indexPath.row]];
    return cell;
}

//Number of items in section
- (NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section{
    return _allTextArr.count;
}

#pragma mark -UICollectionViewDelegate
//Click item to trigger method
- (void)collectionView:(UICollectionView *)collectionView didSelectItemAtIndexPath:(NSIndexPath *)indexPath{
    
}

#pragma mark -UICollectionViewDelegateFlowLayout
//Set the size of each item
- (CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath *)indexPath{
    NSString *textString = [_allTextArr objectAtIndex:indexPath.row];
    CGFloat cell_width = [self settingCollectionViewItemWidthBoundingWithText:textString];
    return CGSizeMake(cell_width, 30);
}

//Calculate text width
- (CGFloat)settingCollectionViewItemWidthBoundingWithText:(NSString *)text{
    //1. Set the content size, the height must be consistent with the item, and the width should be as large as possible
    CGSize size = CGSizeMake(MAXFLOAT, 20);
    //2. Set the calculation method
    //3. Set the font size property. The font size must be consistent with the font size set by label
    NSDictionary *attributeDic = @{NSFontAttributeName: [UIFont systemFontOfSize:14]};
    CGRect frame = [text boundingRectWithSize:size options: NSStringDrawingUsesLineFragmentOrigin attributes:attributeDic context:nil];
    //4. Add left and right spacing
    return frame.size.width + 15;
}

5、 Operation effect

Recommended Today

Analysis of super comprehensive MySQL statement locking (Part 1)

A series of articles: Analysis of super comprehensive MySQL statement locking (Part 1) Analysis of super comprehensive MySQL statement locking (Part 2) Analysis of super comprehensive MySQL statement locking (Part 2) Preparation in advance Build a system to store heroes of the Three KingdomsheroTable: CREATE TABLE hero ( number INT, name VARCHAR(100), country varchar(100), PRIMARY […]