思路
思路很简单，对模型数据操作或则控制界面显示
先看下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