iOS RATreeView的簡單使用(樹狀列表)
阿新 • • 發佈:2019-01-25
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.基本能用到的方法 我都寫了註釋,如有錯誤請指出.是不是比官方的清楚的多.