思路

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

先看下json部分数据

"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

- (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来到达效果。相比之下,该方法简单明了些。

- (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分组样式的两种方式,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对找一找教程网网站的支持!

html仿qq分组,iOS 实现类似QQ分组样式的两种方式相关推荐

  1. android RecyclerView一步步打造分组效果、类似QQ分组、折叠菜单、分组效果(一)

    第二篇文章链接: android RecyclerView一步步打造分组效果.类似QQ分组.折叠菜单.分组效果(二) 效果图: 前言 之前看到这种效果如果用recyclerview来实现没有一点思路, ...

  2. android RecyclerView一步步打造分组效果、类似QQ分组、折叠菜单、分组效果(二)

    第一篇链接: android RecyclerView一步步打造分组效果.类似QQ分组.折叠菜单.分组效果(一) 注!已更新代码! 上一篇写了分组效果的初步实现: 这一篇就继续增加分组折叠效果和基类的 ...

  3. html 点击加入qq群,怎么样加入QQ群?加入QQ群两种方式介绍

    怎么样加入QQ群?加入QQ群通常用于2种方式,一种是已知QQ群号,我们只需要查找添加,另外一种是自行搜索找群,下面我们分别介绍下. 最近有网友问小编:怎样加入脚本之家QQ群啊?随后小编给其发了一个QQ ...

  4. IOS开发基础之团购案例17-xib和UITableView两种方式实现

    IOS开发基础之团购案例17-xib和UITableView两种方式实现 Design By Johnson Shanghai 实现效果 系统和Xcode版本 注意的细节 关键性的代码 // // V ...

  5. iOS 自定义layer的两种方式

    在iOS中,你能看得见摸得着的东西基本都是UIView,比如一个按钮,一个标签,一个文本输入框,这些都是UIView: 其实UIView之所以能显示在屏幕上,完全是因为它内部的一个图层 在创建UIVi ...

  6. iOS WKWebView和JS交互的两种方式

    2019独角兽企业重金招聘Python工程师标准>>> 本文介绍两种方式实现iOS WKWebView和JS交互 WKWebViewConfiguration注入WKScriptMe ...

  7. iOS的音讯通知有两种方式,Badge Notification和Alert Notification

    当应用程序不处于前台运转中时,音讯通知能将某些信息及时告知用户.比方收到新音讯.收到新邮 件.程序下载已完成或者待办事项行将开端等.目前各挪动平台上抵消息通知的设计均有所差异,各有利害.这里整理了iO ...

  8. js操作元素:改变元素内容有两种方式: interText 和 innerHTML的区别, 常用的元素的属性操作, 仿电脑系统时间问好 ,表单元素的属性操作 ,案例:仿京东显示隐藏密码 ,样式属性操作

    文章目录 操作元素 改变元素内容有两种方式: interText 和 innerHTML的区别 常用的元素的属性操作 案例:仿电脑系统时间问好 表单元素的属性操作 案例:仿京东显示隐藏密码 样式属性操 ...

  9. iOS 一个类似QQ的图片添加、图片浏览Demo

    自己没事修改的一个小功能, 类似QQ的 添加图片和浏览图片( 基于ImagePicker.MJPhotoBrowser.SDWebImage) 功能: 1.添加图片.删除图片 2.浏览图片 3.自动换 ...

最新文章

  1. Spring Cloud Alibaba 消息队列:基于 RocketMQ 实现服务异步通信
  2. android加固多渠道,Android 多渠道打包(使用友盟统计,结合360加固宝进行多渠道打包)...
  3. Kali Linux 安全渗透教程第二更Linux安全渗透简介
  4. 面向对象第四单元小结
  5. [C++STL]常用查找算法
  6. 洛谷 P1736 创意吃鱼法
  7. php preg replace中文,php preg_replace函数用法
  8. @SuppressWarnings注解的详解
  9. 面试系列(三):Java反射机制
  10. 用puttygen工具把私钥id_rsa转换成公钥id_rsa.ppk
  11. hustoj 配置java_HUSTOJ增加其他语言出现RuntimeError解决办法
  12. 零基础如何用平面设计排版软件PS进行布局构图
  13. 一箭N雕:多任务深度学习实战
  14. IPV6网络简介及使用
  15. 扫描仪扫描器的功用和原理
  16. JavaScript if...else 语句
  17. Java实验报告误差分析怎么写_系统工程实验报告-031510131-郭文豪.doc
  18. 烽火2640路由器命令行手册-14-桥接配置命令
  19. Android 无法播放此视频
  20. 代码分析之numpy.array

热门文章

  1. 六安毛坦厂2021年高考成绩查询,六安市毛坦厂中学召开2021年高考誓师大会
  2. xp下日语输入法快捷键及打法若干
  3. 如何解决苹果Mac安装微信小助手,微信出现闪退情况?
  4. 【第17章】网络安全应急响应技术原理与应用( 软考: 信息安全工程师) --学习笔记
  5. 考研数学整理错题详细攻略,建议收藏!
  6. JavaScript如何将一个对象里的某些属性抽离出来
  7. Direct3D 10系统
  8. 2022新版神算网PHP八字算命风水测字占卜起名星座解梦周易程序源码搭建指南
  9. oracle 查询记录为空,返回默认值
  10. 微信小程序 实现自动换行