如何在UITableView中实现目录树展示功能?

如何在UITableView中实现目录树效果?
iOS 系统没有提供开箱即用的目录树(也叫树形层级列表、折叠展开列表)标准组件,不需要完全从零自定义开发,你可以基于已有的UITableView/UITableViewController做适配即可,核心实现逻辑如下:
- 首先改造数据源结构,替换原来的单层级section/row结构,自定义节点模型,每个节点需要包含以下核心属性:
- 节点层级深度,用于控制cell的左侧缩进
- 展开状态标记,记录当前节点是否处于展开状态
- 子节点数组,存储当前节点的所有下级节点
- 节点展示内容,比如标题、图标等
- 调整UITableView数据源方法的逻辑:
numberOfSectionsInTableView一般可以固定返回1,所有层级的节点都放在同一个section里统计numberOfRowsInSection要遍历所有节点,只统计根节点+已展开父节点的所有子节点的总数量cellForRowAtIndexPath根据当前索引对应的节点层级,设置cell内容的左侧边距,层级越高缩进越大;如果当前节点有子节点,还要在cell上添加展开/折叠状态的箭头标识
- 处理cell点击事件:
- 点击cell时先判断当前节点是否有子节点,如果没有就响应普通的点击逻辑;如果有子节点,修改该节点的展开状态,同时计算需要新增/删除的行索引,调用UITableView的
insertRowsAtIndexPaths/deleteRowsAtIndexPaths方法配合系统动画完成展开折叠效果
- 点击cell时先判断当前节点是否有子节点,如果没有就响应普通的点击逻辑;如果有子节点,修改该节点的展开状态,同时计算需要新增/删除的行索引,调用UITableView的
你当前提供的基础数据源代码可以按上面的逻辑改造,这里给出修正后的代码参考:
#pragma mark - Table view data source - (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView { // 树形列表一般单section即可,有特殊需求也可以多section拆分 return 1; } - (NSInteger)tableView:(nonnull UITableView *)tableView numberOfRowsInSection:(NSInteger)section { // 这里返回统计后的已展开节点总数量 return self.expandNodeList.count; } - (nonnull UITableViewCell *)tableView:(nonnull UITableView *)tableView cellForRowAtIndexPath:(nonnull NSIndexPath *)indexPath { UITableViewCell *cellView = [tableView dequeueReusableCellWithIdentifier:@"cell"]; if (!cellView) { cellView = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:@"cell"]; } TreeNode *node = self.expandNodeList[indexPath.row]; // 按节点层级设置左侧缩进 cellView.contentView.layoutMargins = UIEdgeInsetsMake(0, 15 * node.level, 0, 0); cellView.textLabel.text = node.title; // 有子节点的话添加箭头标识 cellView.accessoryType = node.subNodes.count > 0 ? UITableViewCellAccessoryDisclosureIndicator : UITableViewCellAccessoryNone; return cellView; }
内容的提问来源于stack exchange,提问作者Vulkan
相关产品推荐
相关产品推荐

