//  主要核心是点击自定义header来展开和收起每一组里面的cell,模型里面应该有isShow此属性来记录开展还是收起。
//  ViewController.m
//  实现类似QQ的折叠效果
//
//  Created by skg_Myfly on 16/3/3.
//  Copyright © 2016年 skg_Myfly. All rights reserved.
//

#import "ViewController.h"
#import "QQCellModel.h"
@interface ViewController ()<UITableViewDataSource,UITableViewDelegate>
/** tableview */
@property (nonatomic , strong ) UITableView *tableView;

/** 全局数据源 */
@property (nonatomic , strong ) NSMutableArray *dateArray;

@end

@implementation ViewController
//懒加载
-(NSMutableArray *)dateArray{
    if (!_dateArray) {
        self.dateArray = [NSMutableArray array];
    }
    return _dateArray;
}

- (void)viewDidLoad {

    [super viewDidLoad];
    //添加数据
    for (int i = 'A';  i <= 'Z'; i ++) {
        QQCellModel* model =   [[QQCellModel alloc] init];
        model.name =  [NSString stringWithFormat:@"%c",i];
//        model.isShow = YES;
        for (int j = 0;  j < 10; j ++) {
            [model.array addObject: [NSString stringWithFormat:@"%c - %d",i,j]];
        }
       
        [self.dateArray addObject:model];
       
    }
//实例化表单
    _tableView =  [[UITableView alloc] initWithFrame:CGRectMake(0, 0, [UIScreen mainScreen].bounds.size.width, [UIScreen mainScreen].bounds.size.height) style:UITableViewStyleGrouped];
    _tableView.delegate = self;
    _tableView.dataSource = self;
    _tableView.rowHeight = 50;
    [self.view addSubview:_tableView];
   
   
}
 
//合计多少组
-(NSInteger)numberOfSectionsInTableView:(UITableView *)tableView{
   
    return  [_dateArray count];
}
 
//每组里面含多少行
-(NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section{
    QQCellModel* model =  [_dateArray objectAtIndex:section];
    if (model.isShow) {
        return  model.array.count;
    }else{
       
        return 0;
    }
}
//添加每行显示的内容
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
    static NSString* ID = @"Cell";
    UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:ID ];
    if (!cell) {
        cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleSubtitle reuseIdentifier:ID];
    }
   
    QQCellModel* model =  [_dateArray objectAtIndex:indexPath.section];
    NSString* str =  [[model array] objectAtIndex:indexPath.row];
    cell.textLabel.text = str;
    return cell;
}
// 定义头标题的视图,添加点击事件
-(UIView *)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section{
    QQCellModel* model =  [_dateArray objectAtIndex:section];
   
    UIButton* btn =[UIButton buttonWithType:UIButtonTypeCustom];
    btn.frame = CGRectMake(0, 0, [UIScreen mainScreen].bounds.size.width, 50);
    [btn setTitle:model.name forState:UIControlStateNormal];
    btn.tag = section;
    [btn addTarget:self action:@selector(btnClick:with:) forControlEvents:UIControlEventTouchUpInside];
    if (section % 2) {
        btn.backgroundColor =  [UIColor darkGrayColor];
       
    }else{
        btn.backgroundColor =  [UIColor lightGrayColor];
       
    }
    return btn;

}

 
//点击后事件相应
-(void)btnClick:(UIButton*)btn with:(NSInteger*)section{
    QQCellModel* model =  [_dateArray objectAtIndex:btn.tag];
   
    if ([model isShow]) {
        [model setIsShow:NO];
    }else{
        [model setIsShow:YES];
    }
   
    [_tableView reloadSections:[NSIndexSet indexSetWithIndex:btn.tag] withRowAnimation:UITableViewRowAnimationFade];
//    [_tableView reloadRowsAtIndexPaths:<#(nonnull NSArray<NSIndexPath *> *)#> withRowAnimation:<#(UITableViewRowAnimation)#>]
}
@end
 
 
-------------------------------------------------------------------------------------------
//
//  QQCellModel.h
//  实现类似QQ的折叠效果
//
//  Created by skg_Myfly on 16/3/3.
//  Copyright © 2016年 skg_Myfly. All rights reserved.
//

#import <Foundation/Foundation.h>

@interface QQCellModel : NSObject
/**名字 */
@property (nonatomic ,copy ) NSString* name;
/**是否展开 */
@property (nonatomic , assign ) BOOL isShow;
/** 每组的数据 */
@property (nonatomic , strong ) NSMutableArray *array;

@end

实现类似QQ的折叠效果的更多相关文章

  1. js仿qq分组折叠效果

    <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <m ...

  2. 使用plupload做一个类似qq邮箱附件上传的效果

    公司项目中使用的框架是springmvc+hibernate+spring,目前需要做一个类似qq邮箱附件上传的功能,暂时只是上传小类型的附件 处理过程和解决方案都需要添加附件,处理过程和解决方案都可 ...

  3. WinForm实现类似QQ停靠,显示隐藏过程添加特效效果

    原文:WinForm实现类似QQ停靠,显示隐藏过程添加特效效果 这可能是个老题长谈的问题了,只是在项目中会用到这个效果,所以今天做个记录.大家见了别喷我.在项目中的需求是这样的. 打开程序,在屏幕的右 ...

  4. winform-实现类似QQ停靠桌面上边缘隐藏的效果

    //实现类似QQ停靠桌面上边缘隐藏的效果! private void timer1_Tick(object sender, EventArgs e) { System.Drawing.Point pp ...

  5. css3折叠效果

    在开发过程中,经常会遇到一些交互效果,今天所联系的便是一个类似折纸的折叠效果,查看效果. 说到折纸,我们先看下图 这是我第一时间想到的大体思路,如果能让这6个面连续的变化角度到0不就可以了吗,运用cs ...

  6. MVC实现类似QQ的网页聊天功能-ajax(下)

    此篇文章主要是对MVC实现类似QQ的网页聊天功能(上)的部分代码的解释. 首先说一下显示框的滚动条置底的问题: 结构很简单一个大的div(高度一定.overflow:auto)包含着两个小的div第一 ...

  7. 创意HTML5文字特效 类似翻页的效果

    原文:创意HTML5文字特效 类似翻页的效果 之前在网上看到一款比较有新意的HTML5文字特效,文字效果是当鼠标滑过是出现翻开折叠的效果,类似书本翻页.于是我兴致勃勃的点开源码看了一下,发现其实实现也 ...

  8. .net winForm 实现类似qq 弹出新闻

    .net winForm 实现类似qq 弹出新闻   一.背景: echong 之前一直用 公司大牛c语言写的一个弹出托管,前几天写东西的时候发现com调用不是那么好使.而手头上写的这个东西又是.ne ...

  9. 用C#代码实现类似QQ窗体的“上、左、右”停靠功能

    大家都知道QQ有一个自动停靠功能,即“上.左.右”,当你把窗体拖到屏幕边缘,然后移开鼠标它会自动缩放,然后只显示一小小点出来,我们仔细观察会发现其实它只露3像素左右的边缘,当你鼠标移上去它又会伸出来, ...

随机推荐

  1. Mysql学习基础语法

    -- Mysql 数 据 库 语 法 创建数据库 create database 数据库名; 创建表 ) ); 复制表和数据 create table 复制后新的表名 select * from 旧表 ...

  2. testng,soket write error错误

    网上解决手段:  testng 工程报错java.net.SocketException SocketException: Software caused connection abort · Iss ...

  3. oldboy第四天学习

    一.感觉上课没有太多的知识.也可以去理解.但是作业太难了... 二.hash() #python里面的哈希类型是在一个程序中不变,如果换了python 哈希是不#一样的. #字典为什么快,因为他把字典 ...

  4. 『电脑技巧』浅谈Win7的文件共享设置

    随着移动存储设备的普及,很少有小伙伴喜欢使用局域网“文件共享”这一捷径了 而且自从XP之后,Windows系列主机共享设置貌似比较麻烦 虽然事实并不是看上去那样(Win7也很Easy的说 = =) 现 ...

  5. [工具]前端自动化工具grunt+bower+yoman

    安装过程 安装nodejs 安装grunt,bower,yoeman 命令:(-g 表示全局安装,否则安装到当前目录下) npm install -g grunt-cli npm install -g ...

  6. CPU进程与线程的关系和区别

    进程是具有一定独立功能的程序关于某个数据集合上的一次运行活动,进程是系统进行资源分配和调度的一个独立单位. 线程是进程的一个实体,是CPU调度和分派的基本单位,它是比进程更小的能独立运行的基本单位. ...

  7. ThreadLocal<T>类

    ThreadLocal<T>类                                        -------每个线程有仅拥有一个T对象                   ...

  8. assets文件夹资源的访问

    访问assets文件夹中的文件,分为以下几个步骤:1.在Activity里面调用getAssets(),获取AssetManager引用2.调用AssetManager.open(String fil ...

  9. ASCII、Unicode、GBK和UTF-8字符编码的区别联系[转]

    http://dengo.org/archives/901 这是我看过的最好的一篇讲述编码的文章 很久很久以前,有一群人,他们决定用8个可以开合的晶体管来组合成不同的状态,以表示世界上的万物.他们看到 ...

  10. [每日一题] 11gOCP 1z0-053 :2013-09-29 Flashback Data Archive ...................................6

    转载请注明出处:http://blog.csdn.net/guoyjoe/article/details/12205299 正确答案:A 具体请参考:http://blog.csdn.net/guoy ...