//  主要核心是点击自定义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. sublime在Mac osx下安装z-codeing(即emmet)

    sublime安装插件可以根据插件名称通过package control就可以很方便的安装好.但是sublime没有默认安装package control,所以我们必须先安装它. 安装package ...

  2. wamp目录索引图片不显示

    在wampserver安装目录下  \bin\apache\Apache2.2.21\conf\extra\httpd-autoindex.conf Alias /icons/ "c:/Ap ...

  3. iOS开发——C篇&函数解析

    关于函数,作为一个开发者事必须掌握的知识不管你在那一个领域,所以今天我就来说一说函数. 一:函数的介绍 关于函数,其实笔者在前面都已经演示不少了,其中用的最多的就是main函数,虽然直接说函数可能不太 ...

  4. .NET MVC 插件化框架源码

    本来想把源码整理了放github上,但最近一直忙,就直接在这里放出来了,还写得不太完整,里面有几个例子,插件上传也没写,只写了插件zip包解压,如果大家在使用中有什么疑问,可以加QQ群:1429391 ...

  5. PHP 之Mysql增删改查操作案例

    1:user表: CREATE TABLE `user` ( `id` ) NOT NULL AUTO_INCREMENT, `name` ) NOT NULL, PRIMARY KEY (`id`) ...

  6. Oracle实例与Oracle数据库

    数据库实例是用于和操作系统进行联系的标识,也就是说数据库和操作系统之间的交互使用的是数据库实例. 数据库实例名(instance_name) 实例名也被写入参数文件中,该参数为instance_nam ...

  7. activity5 流程 入门

    http://blog.csdn.net/yangyi22/article/details/9225849 谢谢原文作者提供!

  8. 【转】ArrayList遍历的同时删除----不错

    原文网址:http://javag.iteye.com/blog/403097 方法一 ArrayList<String> list = new ArrayList<String&g ...

  9. 重温Java的类加载机制

    原文地址:http://blog.csdn.net/hitxueliang/article/details/19992851 首先简要的说一下类加载器   我们知道,虚拟机的指令存储在以.class为 ...

  10. split

    import java.io.IOException; import org.jsoup.Jsoup; import org.jsoup.nodes.Document; /** * 解析知网文章的页面 ...