IOS development-simple table View

Table view is the most frequently used view in iOS development. We usually choose to display data in the form of tables, such as address book and channel list. The table view's functions such as segmentation, grouping, and indexing make the displayed data look more regular and conditioned. what's even more exciting is that the table view can also display data at multiple levels using detailed display and other functions, A table wins thousands of words. However, compared with other controls, table views are more complex to use. However, compared with the various flexible functions of table views, our effort in use is quite worthwhile.

 

Simple Table View

The form of table views is flexible and changeable. Based on the Principle of simplicity, we should first start learning from simple table views. The simple table view described in this section is a dynamic table. (before iOS 5, dynamic tables are all different from static tables ).

Create a simple table View

After iOS 5, we can use XIB or storyboard technology to create a table view. to display a basic table, we only need to implement the method that must be implemented in the uitableviewdatasource protocol, tableview: numberofrowsinsection: And tableview: cellforrowatindexpath. :

Constructor: initwithframe: it is called when the table view is instantiated. If XIB or storyboard is used to design the table view, the table view is created when the table View Controller is instantiated. When the table view is displayed, tableview: numberofrowsinsection: the message is sent to query the number of rows in the current section, when a single cell is displayed in the table view, the tableview: cellforrowatindexpath: message is sent to provide display data for cells.

We create a simple table view. The Cell uses the default style and has icons and primary titles, displaying information about the World Cup team.

 

Use the "single view application" template to create a project named "simpletable". Open the IB design screen and select "View Controller" in "View Controller scene" to delete the controller, drag a "Table View Controller" from the control library to the design screen.

 

Modify the parent class of viewcontroller in the H file from the original uiviewcontroller to uitableviewcontroller.

Select "Table View Controller scene"> "Table View Controller" from the scene list on the left side of the IB design screen to enable the identity checker of the table View Controller, select "viewcontroller" in the class option, which is our own view controller.

Select "Table View Controller scene"> "Table View Controller"> "Table View Controller"> "Table View" in the scene list to open the attribute checker of the table view. Content has two options: "dynamic prototypes" and "static cells", which are available only in the storyboard. "Dynamic Prototypes" is to build "Dynamic tables"

If you use code to create cells, set the "prototype cells" project to 0. The code implementation mode code is as follows:

static NSString *CellIdentifier = @”CellIdentifier”;UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier];if (cell == nil) {cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:CellIdentifier];}

 

Identifier is a reusable cell identifier, which is the same as the reusable cell concept in the collection view. First, check whether there are reusable cells in the table view. If not, use initwithstyle: reuseidentifier: constructor to create a cell object.

If you want to design Cells Using the storyboard, select "Table View Controller scene"> "Table View Controller"> "Table view cell ", open the cell property checker. There are many options in style. identifier refers to reusable cell identifiers.

 

After this operation, the cell does not need to be instantiated in the code. We can directly retrieve the cell instance through the set identifier to reuse the cell.

Static nsstring * cellidentifier = @ "cellidentifier"; uitableviewcell * cell = [tableview failed: cellidentifier]; If (cell = nil) {Cell = [[uitableviewcell alloc] initwithstyle: uitableviewcellstyledefault reuseidentifier: cellidentifier];} We need to set "team. plist and team image are added to the project, viewcontroller. the hfile code is as follows: # import <uikit/uikit. h> @ interface viewcontroller: uitableviewcontroller @ property (nonatomic, strong) nsarray * listteams; @ end

 

 

Modify the parent class of viewcontroller to uitableviewcontroller. The listteams attribute of the nsarray * type is also defined. listteams is used to load the data read from the file. The operations to read the attribute list file team. plist are implemented in the viewdidload method.

 

The viewdidload method code of the viewcontroller. M file is as follows:

-(Void) viewdidload {[Super viewdidload]; nsbundle * bundle = [nsbundle mainbundle]; nsstring * plistpath = [bundle pathforresource: @ "team" oftype: @ "plist"]; // obtain all data in the property list file self. listteams = [[nsarray alloc] initwithcontentsoffile: plistpath];} Let's look at the uitableviewdatasource protocol method. The Code is as follows:-(nsinteger) tableview :( uitableview *) tableview numberofrowsinsection) section {return [self. listteams count];}-(uitableviewcell *) tableview :( uitableview *) tableview cellforrowatindexpath :( nsindexpath *) indexpath {static nsstring * cellidentifier = @ "cellidentifier "; uitableviewcell * cell = [tableview failed: cellidentifier]; If (cell = nil) {Cell = [[uitableviewcell alloc] initwithstyle: descrireuseidentifier: cellidentifier];} nsuinteger ROW = [indexpath row]; nsdictionary * rowdict = [self. listfilterteams objectatindex: Row]; cell. textlabel. TEXT = [rowdict objectforkey: @ "name"]; nsstring * ImagePath = [rowdict objectforkey: @ "image"]; ImagePath = [ImagePath stringbyappendingstring :@". PNG "]; cell. imageview. image = [uiimage imagenamed: ImagePath]; cell. accessorytype = uitableviewcellaccessorydisclosureindicator; return cell ;}

 

 

Because the current table actually has only one section, you do not need to distinguish the sections. In tableview: numberofrowsinsection: method, you can directly return the length of the listteams attribute. Tableview: cellforrowatindexpath: The Row Method of the nsindexpath parameter in the method to obtain the row index of the current cell. The cell. accessorytype attribute sets the extended view type.

We can replace the cell style uitableviewcellstyledefault with the other three to experience the effects of the other three cell styles.

Simple Table case running result