What UITableView is:

1, UITableVIew is the most commonly used UI control, basic major apps are based on tableView design.

2. UITableView is often used for list presentation, and then custom cell types for different functions.

UITableView:

Create a UITableView:

Step 1: Comply with the proxy and data source protocols

@interface ViewController()"UITableViewDelegate.UITableViewDataSource>
Copy the code

Step 2: Create a UITableView

  • There are three style arguments, corresponding to three uitableViews (as needed) :

1, UITableViewStylePlain // no grouping

2, UITableViewStyleGrouped, // All the grouped parts were embedded at right angles

3, UITableViewStyleInsetGrouped / / grouping and embedded part of the group with rounded corners

Grouped // Created a UItableView from all zhai zhai or Plain zhai
    UITableView *tableView = [[UITableView alloc] initWithFrame:CGRectMake(0.20.self.view.frame.size.width, self.view.frame.size.height- 20) style:UITableViewStyleGrouped];
    // Declare the tableView's proxy and data source
    tableView.delegate = self;
    tableView.dataSource = self;
    // Add to view
    [self.view addSubview:tableView];
Copy the code

Step 3: Set the data source for the TableView. Implement the following methods

Style for UITableViewStyleGrouped and UITableViewStyleInsetGrouped need to set up as follows:

// The number of sections in tableView (- (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView {
    return 6;
}

// Number of cells per Section- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section {
    return 3;
}
Copy the code
  • There are four types of cells, as shown in the following figure:

1, UITableViewCellStyleDefault

2, UITableViewCellStyleValue1

3, UITableViewCellStyleValue2

4, UITableViewCellStyleSubtitle

  • There are two types of cell reuse (cell reuse mechanism is described below) :

1. Create cell manually when cell==nil

  cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:identifying];
Copy the code

2. The table view creates the cell by registering the cell

When a cell==nil is not in the cache pool, the cell is automatically created based on the registered type.

     [_tableView registerClass:[UITableViewCell class] forCellReuseIdentifier:identifying];/ / register cell
Copy the code

// Set each Cell- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
    // Create a cellID for cell reuse
    NSString *cellID = @"cellID";
    // Fetch a cell from the tableView reuse pool via cellID
    UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:cellID];
    if (cell == nil) {
         // If the tableView is not in the reuse pool, create a new cell with the style Value2 and mark it with cellID.
        cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleValue2 reuseIdentifier:cellID];
    }
    // Set the cell title
    cell.textLabel.text = [NSString stringWithFormat:@" This is the %li cell", (long)indexPath.row];
    // Set the subtitle of the cell
    cell.detailTextLabel.text = @" Subtitle";
    return cell;
}
Copy the code

Cell reuse mechanism

1, in order to save memory, tableView only creates the number of realistic screen size cells, and then reuse these cells, add the unused cells to the reuse queue, in order to display the cell, first see if there is no queue, if there is no new; Mainly through the queue, when he left visible range cell, will add it to reuse queue, when need to add new elements, will try to obtain from the reuse of queue reusable elements (dequeueReusableCellWithIdentifier), and removed from the reuse of the queue; If the queue is empty, create a new cell

     cell = [[BaseUITableViewCell alloc]initWithStyle:(UITableViewCellStyleDefault) reuseIdentifier:UserViewControllerSep];/ / create a cell
Copy the code

2. Create different identifiers for different cell types

When reusing cells, we can find cells of the required type from the reuse queue mainly by identifiers.

    cell = [tableView dequeueReusableCellWithIdentifier:UserViewControllerSep forIndexPath:indexPath];/ / return of the cell
Copy the code

Different cell types must create different identifiers, otherwise content will be loaded repeatedly!! :

UITableView proxy method:

 // Set the section header text
- (NSString *)tableView:(UITableView *)tableView titleForHeaderInSection:(NSInteger)section{
    return [NSString stringWithFormat:@"header-%li", (long)section];
}

// Set section footer text
- (NSString *)tableView:(UITableView *)tableView titleForFooterInSection:(NSInteger)section{
    return [NSString stringWithFormat:@"footer-%li", (long)section];
}

// Set the section header height
- (CGFloat)tableView:(UITableView *)tableView heightForHeaderInSection:(NSInteger)section{
    return 20;
}

// Set section footer height
- (CGFloat)tableView:(UITableView *)tableView heightForFooterInSection:(NSInteger)section{
    return 20;
}

// Set the cell height
- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath{
    return 70;
}

// Set the cell text to shrink to the right
- (NSInteger)tableView:(UITableView *)tableView indentationLevelForRowAtIndexPath:(NSIndexPath *)indexPath{
    return 0.5;
}

// Customize header and footer, set header and footer to view of custom content
// Note: When using a custom header and footer, the above method of setting the text content of the header and footer is invalid. To display the text, you need to create it on the custom view.
- (UIView *)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section{
    UIView* headerView = [[UIView alloc]initWithFrame:CGRectMake(0.0.100.10)];
       //headerView.backgroundColor = [UIColor redColor];
       return headerView;
}

- (UIView *)tableView:(UITableView *)tableView viewForFooterInSection:(NSInteger)section{
    UIView* footerview = [[UIView alloc]initWithFrame:CGRectMake(0.0.100.10)];
       //footerview.backgroundColor = [UIColor orangeColor];
       return footerview;
    
}
 
Copy the code

UITableView response correlation

// Select the cell to trigger the method
- (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath{
       [tableView deselectRowAtIndexPath:indexPath animated:NO];  // Uncheck the status
}

// Sets whether the cell can slide left
- (BOOL)tableView:(UITableView *)tableView canEditRowAtIndexPath:(NSIndexPath *)indexPath{
    return true;
}

// Set the default left slide button for titie
- (NSString *)tableView:(UITableView *)tableView titleForDeleteConfirmationButtonForRowAtIndexPath:(NSIndexPath *)indexPath{
    return @" Left slide button";
}

// Click the left slider button to trigger
- (void)tableView:(UITableView *)tableView commitEditingStyle:(UITableViewCellEditingStyle)editingStyle forRowAtIndexPath:(NSIndexPath *)indexPath{
    NSLog(Click the left slide button is triggered);
}

// called at the end of the left swipe (only for default left swipe buttons, not custom buttons)
- (void)tableView:(UITableView *)tableView didEndEditingRowAtIndexPath:(NSIndexPath *)indexPath{
    NSLog(@" Left slide over");
}
Copy the code

Custom cell

Define your own cell class and arrange the layout as you wish.

Using Mycell as an example of a custom cell class, just change this method

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath{
    NSString* cellID = @"cellID";
   // Fetch a cell from the tableView reuse pool via cellID
    UITableViewCell* cell = [tableView dequeueReusableCellWithIdentifier:cellID];
    if(cell == nil) {//cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleValue2 reuseIdentifier:cellID]; System cell class
        cell = [[MyCell alloc] initWithStyle:UITableViewCellStyleValue2reuseIdentifier:cellID]; To use custom cells, you need to change heightForRow to change the cell height to140
    }
    cell.textLabel.text = [NSString stringWithFormat:@" This is the %li cell", (long)indexPath.row];
    cell.detailTextLabel.text = @"detail";
    return cell;
}
Copy the code

Pull down refresh, pull up refresh

Step 1: Import the MJRefresh framework

      #import "MJRefresh.h" 
Copy the code

Step 2: Add the refresh component

 MJRefreshNormalHeader* header = [[MJRefreshNormalHeader alloc]init];
    [header setRefreshingTarget:self refreshingAction:@selector(headerClick)];
    self.tableview.mj_header = header;
    
    // Pull up refresh
    MJRefreshAutoNormalFooter* footer = [[MJRefreshAutoNormalFooter alloc]init];
    [footer setRefreshingTarget:self refreshingAction:@selector(footerClick)];
    self.tableview.mj_footer = footer;
Copy the code

Step 3: Implementation method

- (void)headerClick{
    // Implement the code to be executed during pull-down loading here
    [NSThread sleepForTimeInterval:3];
    [self.tableview.mj_header endRefreshing]; } - (void)footerClick{
     // Implement the code to execute during pull-up loading here
    [NSThread sleepForTimeInterval:3]; // The load time is 3s
    [self.tableview.mj_footer endRefreshing];   // Stop loading
}
Copy the code

This is the end of UITableView basics, these are now easy to use, old iron you can do it.