iOS树状视图(折叠单元格)详细使用

RATreeView是一个第三方的iOS树视图(通俗的讲就是折叠单元格),它是对UITableView的封装,定义自己的委托和数据源的法,RATreeView是高度可定制的,并且有很多功能。很多朋友都说使用的不好,官方讲的也不够详细,所以我就给大家讲一下,怎么使用.


  • 首先先看下实现效果
1.gif
  • 使用方法

CocoaPods pod 'RATreeView', '~> 2.1.0'

  • 具体使用
    1.创建model
#import <Foundation/Foundation.h>

@interface RaTreeModel : NSObject

@property (nonatomic,copy) NSString *name;//标题

@property (nonatomic,strong) NSArray *children;//子节点数组


//初始化一个model
- (id)initWithName:(NSString *)name children:(NSArray *)array;

//遍历构造器
+ (id)dataObjectWithName:(NSString *)name children:(NSArray *)children;

@end
#import "RaTreeModel.h"

@implementation RaTreeModel

- (id)initWithName:(NSString *)name children:(NSArray *)children
{
    self = [super init];
    if (self) {
        self.children = children;
        self.name = name;
    }
    return self;
}

+ (id)dataObjectWithName:(NSString *)name children:(NSArray *)children
{
    return [[self alloc] initWithName:name children:children];
}
@end

2.创建cell

  • 特别注意 xib创建的cell, 一定不要勾选Use Auto Layout,否则cell上的布局不会执行.

找不到的,请看下图

Snip20160525_1.png

cell创建具体如下:

这是我用xib设置的cell,你们按照你们的需求做

Snip20160525_4.png
#import <UIKit/UIKit.h>

@interface RaTreeViewCell : UITableViewCell
@property (weak, nonatomic) IBOutlet UIImageView *iconView;//图标

@property (weak, nonatomic) IBOutlet UILabel *titleLable;//标题

//赋值
- (void)setCellBasicInfoWith:(NSString *)title level:(NSInteger)level children:(NSInteger )children;
@end
#import "RaTreeViewCell.h"

@interface RaTreeViewCell ()


@end

@implementation RaTreeViewCell

- (void)awakeFromNib {
    // Initialization code
    self.selectionStyle = UITableViewCellSelectionStyleNone;
}

- (void)setSelected:(BOOL)selected animated:(BOOL)animated {
    [super setSelected:selected animated:animated];

    // Configure the view for the selected state
}


- (void)setCellBasicInfoWith:(NSString *)title level:(NSInteger)level children:(NSInteger )children{

    //有自孩子时显示图标
    if (children==0) {
        self.iconView.hidden = YES;

    }
    else { //否则不显示
        self.iconView.hidden = NO;
    }

    self.titleLable.text = title;
    self.iconView.image = [UIImage imageNamed:@"close"];
    
  
    //每一层的布局
    CGFloat left = 10+level*30;
    
    //头像的位置
    CGRect  iconViewFrame = self.iconView.frame;
    
    iconViewFrame.origin.x = left;
    
    self.iconView.frame = iconViewFrame;
    
    //title的位置
    CGRect titleFrame = self.titleLable.frame;
    
    titleFrame.origin.x = 40+left;
    
    self.titleLable.frame = titleFrame;
   
    
 
}

3.创建RATreeView
只展示核心代码

数据
//加载数据
- (void)setData {
    
    //宝鸡市 (四层)
    RaTreeModel *zijingcun = [RaTreeModel dataObjectWithName:@"紫荆村" children:nil];
    
    RaTreeModel *chengcunzheng = [RaTreeModel dataObjectWithName:@"陈村镇" children:@[zijingcun]];
    
    RaTreeModel *fengxiang = [RaTreeModel dataObjectWithName:@"凤翔县" children:@[chengcunzheng]];
    RaTreeModel *qishan = [RaTreeModel dataObjectWithName:@"岐山县" children:nil];
    RaTreeModel *baoji = [RaTreeModel dataObjectWithName:@"宝鸡市" children:@[fengxiang,qishan]];
    
    //西安市
    RaTreeModel *yantaqu = [RaTreeModel dataObjectWithName:@"雁塔区" children:nil];
    RaTreeModel *xinchengqu = [RaTreeModel dataObjectWithName:@"新城区" children:nil];
    
    RaTreeModel *xian = [RaTreeModel dataObjectWithName:@"西安" children:@[yantaqu,xinchengqu]];
    
    RaTreeModel *shanxi = [RaTreeModel dataObjectWithName:@"陕西" children:@[baoji,xian]];
    
    [self.modelArray addObject:shanxi];
}

#######代理方法

#pragma mark -----------delegate 

//返回行高
- (CGFloat)treeView:(RATreeView *)treeView heightForRowForItem:(id)item {
 
    return 50;
}

//将要展开
- (void)treeView:(RATreeView *)treeView willExpandRowForItem:(id)item {
    
    RaTreeViewCell *cell = (RaTreeViewCell *)[treeView cellForItem:item];
    cell.iconView.image = [UIImage imageNamed:@"open"];
   
}
//将要收缩
- (void)treeView:(RATreeView *)treeView willCollapseRowForItem:(id)item {
    
    RaTreeViewCell *cell = (RaTreeViewCell *)[treeView cellForItem:item];
    cell.iconView.image = [UIImage imageNamed:@"close"];

}

//已经展开
- (void)treeView:(RATreeView *)treeView didExpandRowForItem:(id)item {
    
    
    NSLog(@"已经展开了");
}
//已经收缩
- (void)treeView:(RATreeView *)treeView didCollapseRowForItem:(id)item {
    
    NSLog(@"已经收缩了");
}

####### dataSource方法

//返回cell
- (UITableViewCell *)treeView:(RATreeView *)treeView cellForItem:(id)item {
 
    
   
    //获取cell
    RaTreeViewCell *cell = [treeView dequeueReusableCellWithIdentifier:@"RaTreeViewCell"];
    
    //当前item
    RaTreeModel *model = item;
    
    //当前层级
    NSInteger level = [treeView levelForCellForItem:item];
   
    //赋值
    [cell setCellBasicInfoWith:model.name level:level children:model.children.count];
   
    return cell;

}

/**
 *  必须实现
 *
 *  @param treeView treeView
 *  @param item    节点对应的item
 *
 *  @return  每一节点对应的个数
 */
- (NSInteger)treeView:(RATreeView *)treeView numberOfChildrenOfItem:(id)item
{
     RaTreeModel *model = item;
    
     if (item == nil) {

        return self.modelArray.count;
    }

    return model.children.count;
}
/**
 *必须实现的dataSource方法
 *
 *  @param treeView treeView
 *  @param index    子节点的索引
 *  @param item     子节点索引对应的item
 *
 *  @return 返回 节点对应的item
 */
- (id)treeView:(RATreeView *)treeView child:(NSInteger)index ofItem:(id)item {

    RaTreeModel *model = item;
    if (item==nil) {
       
        return self.modelArray[index];
    }
   
    return model.children[index];
}


//cell的点击方法
- (void)treeView:(RATreeView *)treeView didSelectRowForItem:(id)item {

    //获取当前的层
    NSInteger level = [treeView levelForCellForItem:item];

    //当前点击的model
    RaTreeModel *model = item;

    NSLog(@"点击的是第%ld层,name=%@",level,model.name);

}

//单元格是否可以编辑 默认是YES
- (BOOL)treeView:(RATreeView *)treeView canEditRowForItem:(id)item {
    
    return YES;
}

//编辑要实现的方法
- (void)treeView:(RATreeView *)treeView commitEditingStyle:(UITableViewCellEditingStyle)editingStyle forRowForItem:(id)item {
    
    NSLog(@"编辑了实现的方法");


}

4.基本能用到的方法 我都写了注释,如有错误请指出.是不是比官方的清楚的多.

demo地址:https://git.oschina.net/zhukaiqi/RATreeDemo.git

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 概述在iOS开发中UITableView可以说是使用最广泛的控件,我们平时使用的软件中到处都可以看到它的影子,类似...
    liudhkk阅读 9,093评论 3 38
  • *面试心声:其实这些题本人都没怎么背,但是在上海 两周半 面了大约10家 收到差不多3个offer,总结起来就是把...
    Dove_iOS阅读 27,219评论 30 472
  • WebSocket-Swift Starscream的使用 WebSocket 是 HTML5 一种新的协议。它实...
    香橙柚子阅读 24,133评论 8 183
  • 一 从小到大 大家都说 我家老二跟我长得像 双胞胎 我们总爱跟别人玩玩『猜猜谁才是老大』 老二比我高很多 就被人认...
    yingde阅读 192评论 0 0
  • ――送给生活中的平常人 这一生 我注定不是一个令人敬仰的伟人 因为 我没有伟人的才能与胸怀 但我 ...
    白露丹枫阅读 177评论 0 0