思路

思路很简单，对模型数据操作或则控制界面显示

先看下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