How to Use Xib to customize UITableViewCell and xibuitableviewcell

How to Use Xib to customize UITableViewCell and xibuitableviewcell
How to Use Xib to customize UITableViewCell

First, what is UITableView? View chart

Second, what is cell?

Then: Why do we need to customize the cell? Isn't the UITableView built-in cell?

In daily development, the cell provided by the system cannot meet the needs of customers and developers (and the content \ size \ style of each cell is the same ), we need to customize the cell to implement more optimized functions. for example

Finally, how to customize cells?

1. Create a new project and drag two imageviews and two labels to the storyboard.

 

 

2. Create UITableView in ViewController

1 // 2 // ViewController. m 3 // Xib custom UITableViewCell 4 // 5 // Created by admin on 16/5/16. 6 // Copyright©KXZDJ. all rights reserved. 7 // 8 9 # import "ViewController. h "10 11 @ interface ViewController () <UITableViewDelegate, UITableViewDataSource> 12 @ property (nonatomic, strong) UITableView * tableView; 13 @ end14 15 @ implementation ViewController16 17-(void) viewDidLoad {18 [super viewDidLoad]; 19 // Do any additional setup after loading the view, typically from a nib.20 [self config]; 21} 22 23-(v Oid) didReceiveMemoryWarning {24 [super didReceiveMemoryWarning]; 25 // Dispose of any resources that can be recreated.26} 27 28 29-(void) config {30 // initialize tableView, and set frame and style 31 self for tableView. tableView = [[UITableView alloc] initWithFrame: [UIScreen mainScreen]. bounds style: UITableViewStylePlain]; 32 // follow the proxy and Data Source (because the proxy and data source method are required) 33 self. tableView. delegate = self; 34 self. tableView. dataSource = self; 35/ /Add it to the ViewController View 36 [self. view addSubview: self. tableView]; 37} 38 39/** 40 * How many groups are returned (the default value is 1 group. If there is only one group, this method is not implemented) 41*42 * @ param tableView current tableView43 * 44 * @ number of return groups 45 */46-(NSInteger) numberOfSectionsInTableView :( UITableView *) tableView {47 return 1; 48} 49/** 50 * How many rows are returned in each group 51*52 * @ param tableView current tableView53 * @ param section current group 54*55 * @ return rows 56 * /57-(NSInteger) tableView :( UITableView *) TableView numberOfRowsInSection :( NSInteger) section {58 return 20; 59} 60 61-(UITableViewCell *) tableView :( UITableView *) tableView cellForRowAtIndexPath :( NSIndexPath *) indexPath {62 // reuse identifier of the specified cell 63 static NSString * reuseIdentifier = @ "CELL"; 64 // find cell65 UITableViewCell * cell named reuseIdentifier in the cache pool = [tableView dequeuereusablewitcellhidentifier: reuseIdentifier]; 66 // if the cache pool does not exist, create a new cell67 if (! Cell) {68 cell = [[UITableViewCell alloc] initWithStyle: UITableViewCellStyleDefault reuseIdentifier: reuseIdentifier]; 69} 70 // return Current cell71 return cell; 72}UITableView

Running Effect

4. Xib custom cell

 

First, we need to create an xib file in two ways:

Direct

First:

Second:

The second method is convenient to create xib at the same time when you create a class. If you create a class in the first method, You have to associate the class.

Drag the control to the cell of the Xib and set the layout (constraints) for the control.

 

Enter the code stage

5. Get the Xib custom cell

Code: (XibTableViewCell. h)

1 // 2 // XibTableViewCell. h 3 // Xib custom UITableViewCell 4 // 5 // Created by admin on 16/5/16. 6 // Copyright©KXZDJ. all rights reserved. 7 // 8 9 # import <UIKit/UIKit. h> 10 11 @ interface XibTableViewCell: UITableViewCell12 // Method for loading xib (self-written, not built-in) 13 + (instancetype) xibTableViewCell; 14 15 @ end

(XibTableViewCell. m)

1 // 2 // XibTableViewCell. m 3 // Xib custom UITableViewCell 4 // 5 // Created by admin on 16/5/16. 6 // Copyright©KXZDJ. all rights reserved. 7 // 8 9 # import "XibTableViewCell. h "10 11 @ implementation XibTableViewCell12 // implementation Class Method 13 + (instancetype) xibTableViewCell {14 // load the xib file in the class method. Note: loadNibNamed: owner: options: this method returns NSArray, so you can add either firstObject or lastObject or [0] to it. Because in our Xib file, there is only one cell15 return [[NSBundle mainBundle] loadNibNamed: @ "XibTableViewCell" owner: nil options: nil] lastObject]; 16} 17 18-(void) awakeFromNib {19 // Initialization code20} 21 22-(void) setSelected :( BOOL) selected animated :( BOOL) animated {23 [super setSelected: selected animated: animated]; 24 25 // Configure the view for the selected state26} 27 28 @ end

6. Load the xib file to the UITableView of the system to replace the cell that comes with the system.

This step must be performed in

-(UITableViewCell *) tableView :( UITableView *) in the tableView cellForRowAtIndexPath :( NSIndexPath *) indexPath method, or encapsulated in your own defined class, this method also needs to be called.

6.1 drag the control to associate it with a class to facilitate the call of the control

6.2 code:

1 // 2 // ViewController. m 3 // Xib custom UITableViewCell 4 // 5 // Created by admin on 16/5/16. 6 // Copyright©KXZDJ. all rights reserved. 7 // 8 9 # import "ViewController. h "10 // import the header file 11 # import" XibTableViewCell. h "12 13 @ interface ViewController () <UITableViewDelegate, UITableViewDataSource> 14 @ property (nonatomic, strong) UITableView * tableView; 15 @ end16 17 @ implementation ViewController18 19-(void) viewDidLoad {20 [super viewDidLoad]; 21 // Do any additional setup after loading the view, typically f Rom a nib.22 [self config]; 23} 24 25-(void) didReceiveMemoryWarning {26 [super didreceivemorywarning]; 27 // Dispose of any resources that can be recreated.28} 29 30 31-(void) config {32 // initialize tableView and set frame and style 33 self for tableView. tableView = [[UITableView alloc] initWithFrame: [UIScreen mainScreen]. bounds style: UITableViewStylePlain]; 34 // follow the proxy and Data Source (because the proxy and data source method are required) 35 self. tableView. delegate = self; 36 self. tableView. dataSource = self; 37 // Add to ViewController view 38 [self. view addSubview: self. tableView]; 39} 40 41/** 42 * How many groups are returned (the default value is 1 group. If there is only one group, this method is not implemented) 43*44 * @ param tableView current number of tableView45 * 46 * @ return groups 47 */48-(NSInteger) numberOfSectionsInTableView :( UITableView *) tableView {49 return 1; 50} 51/** 52 * How many rows are returned in each group 53*54 * @ param tableView current tableView55 * @ param section current group 56*57 * @ return row count 5 8 */59-(NSInteger) tableView :( UITableView *) tableView numberOfRowsInSection :( NSInteger) section {60 return 20; 61} 62 63-(UITableViewCell *) tableView :( UITableView *) tableView cellForRowAtIndexPath :( NSIndexPath *) indexPath {64 // reuse identifier of the specified cell 65 static NSString * reuseIdentifier = @ "CELL "; 66 // go to the cache pool and find cell67 named reuseIdentifier. // replace cell68 XibTableViewCell * cell = [tableView dequeueReusableCellWithIde Ntifier: reuseIdentifier]; 69 // if the cache pool does not exist, create a new cell70 if (! Cell) {71 // replace it with your own defined cell and call the class method to load the xib file 72 cell = [XibTableViewCell xibTableViewCell]; 73} 74 // assign 75 cell to the cell. backView. image = [UIImage imageNamed: @ "223733vuf3mhajhd04hdh5"]; 76 cell. infoLabel. text = @ "Jin San fat really handsome"; 77 cell. infoLabel. textColor = [UIColor redColor]; 78 cell. zanView. image = [UIImage imageNamed: @ "103112778vn00czp59p6w7"]; 79 cell. zanLabel. text = @ "100"; 80 cell. zanLabel. textColor = [UIColor redColor]; 81 // return the current cell82 return cell; 83} 84/** 85 * returned cell Row Height 86*87 * @ param tableView current tableView88 * @ param indexPath89 * 90 * @ return cell Row Height 91 */92- (CGFloat) tableView :( UITableView *) tableView heightForRowAtIndexPath :( NSIndexPath *) indexPath {93 return 200; 94} 95 96 @ end

 

Running Effect

Conclusion: The Custom UITableViewCell of Xib has come to an end. If there is an error, please correct it. I hope it will help you, rather than mean it.