思路
思路很简单，对模型数据操作或则控制界面显示
先看下json部分数据
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
|
"chapterdtolist": [{ "token": null, "id": 1295, "chaptername": "第一章", "parentid": 0, "chapterlevel": 0, "attachmenturl": "", "description": null, "startdatetimestamp": null, "enddatetimestamp": null, "startdate": 1490889600000, "enddate": 1491062400000, "browsecount": 0, "workid": null, "chapterstatus": 3, "hadread": 0, "subchapterlist": [{ "token": null, "id": 1296, "chaptername": "第一节", "parentid": 1295, "chapterlevel": 1, "attachmenturl": "", "description": null, "startdatetimestamp": null, "enddatetimestamp": null, "startdate": null, "enddate": null, "browsecount": 0, "workid": null, "chapterstatus": null, "hadread": 0, "subchapterlist": [], "classuserreadinfo": [] }, |
这种数据对应的一般都是个tableview， 然后根据章节分开，最终界面如下：
分析
这里采用uitableviewstyleplain样式，chapterdtolist对应章，subchapterlist对应节。章的话我们使用headerview来做，节的话我们使用cell来做。然后只需要给headerview添加一个点击手势，点击的时候给对应的模型添加标识，从而去控制章节的收合。
方法一：
对模型数组进行操作，我们可以将返回的json数据转化为两个模型数组chapterlistarray和tempchapterlistarray，通过控制subchapterlist的count来实现。界面的模型数据统一使用tempchapterlistarray，展开与合并就等价于是否将“章数组“中的”节数组“赋值为nil
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
|
- (nsinteger)tableview:(uitableview *)tableview numberofrowsinsection:(nsinteger)section { yjtonlinetaskdetailmodel *onlinetaskdetailmodel = self.tempchapterlistarray[section]; return onlinetaskdetailmodel.subchapterlist.count;}- (uiview *)tableview:(uitableview *)tableview viewforheaderinsection:(nsinteger)section { yjtonlinechapetercell *headerview = [tableview dequeuereusablecellwithidentifier:onlinechapetercell]; yjtonlinetaskdetailmodel *onlinetaskdetailmodel = self.chapterlistarray[section]; headerview.backgroundcolor = [uicolor whitecolor]; headerview.onlinetaskdetailmodel = onlinetaskdetailmodel; if (section == 0) { headerview.tipslableheight.constant = 30; }else { headerview.tipslableheight.constant = 0; } [headerview whentapwithblock:^{ onlinetaskdetailmodel.isselected = !onlinetaskdetailmodel.isselected; yjtonlinetaskdetailmodel *detailmodel = self.tempchapterlistarray[section]; if (detailmodel.subchapterlist == nil) { detailmodel.subchapterlist = onlinetaskdetailmodel.subchapterlist; }else { detailmodel.subchapterlist = nil; } [self.tableview reloaddata]; }]; return headerview;} |
方法二：
上面的方法是通过控制模型数组来实现的，我们也可以采用控制界面的显示，从而达到我们的要求。既然我们在点击headview的时候已经标记过对应的模型数据是否展开，那么我们完全可以通过控制界面对应分组的个数来实现。当然也可以通过控制rowheight来到达效果。相比之下，该方法简单明了些。
|
1
2
3
4
5
6
7
8
|
- (nsinteger)tableview:(uitableview *)tableview numberofrowsinsection:(nsinteger)section { yjtonlinetaskdetailmodel *onlinetaskdetailmodel = self.chapterlistarray[section]; return onlinetaskdetailmodel.isselected ? onlinetaskdetailmodel.subchapterlist.count : 0;} [headerview whentapwithblock:^{ onlinetaskdetailmodel.isselected = !onlinetaskdetailmodel.isselected; [self.tableview reloaddata]; }]; |
总结
以上所述是小编给大家介绍的ios 实现类似qq分组样式的两种方式，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对服务器之家网站的支持！
原文链接：http://www.cnblogs.com/chao8888/archive/2017/07/18/7200421.html
