Common TableView Protocol Design
Summary for a common UITableView design pattern to support the following cases:
| Use Cases | Description |
|---|---|
| A | Single section with single empty/loading/error layout |
| B | Multiple section in table, but the table have a unified empty/loading/error layout |
| C | Multiple section in table, each has isolated loading lifecyle and display its own empty/loading/error layout |
1. Design Focuses:
1.1 Layout Management:
Provide two types of loading preference:
full_table: The table itself will show a whole error/loading/empty page. the status of the table will include: normal/error/loading/emptyby_section: Each section will have their own state layout for error/loading/empty pages, the table will no longer display a unified error/load/empty page. In this layout mode, the table will only have two status: normal and loading , as long as there is any section currently loading, the overall table is in loading status, otherwise, the table is normal(means loading is done)
1.2 Status Synchronization
The protocol provides a unified refresh function from the table layer, which calls the onSectionLoadStart method for each of the section, the section is then entering the loading status.
Once the loading task of each section is done, the section is responsible for update its loading status. The loading status will be mapped to the table’s overall status. The tableview/controller can observe the tables status to decide whether to show/hide loading process or update relevant UI. The relation between table loading status and each sections loading status can be summarized in the following matrix:
- For cases where there is a unified empty/error/loading page for the table, the table loading status and section loading status is mapped as below:
| Table Loading Status | Section Loading Status |
|---|---|
| normal | 1. All section is either in empty or normal status 2.At least one section is in normal status |
| error | 1. As long as any section in error status 2. All section is not in loading status |
| empty | 1. All section are in empty status |
| loading | 1. As long as any section is in loading status |
- For cases where multiple sections need to display different view state like loading/error/empty, the table loading status and section loading status is mapped as below:
| Table Loading Status | Section Loading Status |
|---|---|
| normal | 1. All sections are not in loading status |
| loading | 1. As long as any section is in loading status |
2. Protocol Overview:
The following class diagram provides a simplified sketch on how the section layer and table layer protocols are correlated:
