前言
在iOS開發(fā)技術(shù)群里看到骂束,一哥們求助樹狀圖怎么做,并附帶一張圖片成箫。一看到這效果圖展箱,第一反應是這不是網(wǎng)頁形式UI嗎?產(chǎn)品是SB蹬昌?當層次過多混驰,手機顯示不下怎么辦?好了皂贩,發(fā)牢騷到此結(jié)束栖榨。該實現(xiàn)的還是要去實現(xiàn)的,畢竟我們只是碼奴而不是狗產(chǎn)品明刷。
先上一張實現(xiàn)的簡單效果圖:
Simulator Screen Shot 2018年1月22日 下午4.16.28.png
實現(xiàn)思路
1.在UITableView基礎(chǔ)上進行封裝婴栽,組數(shù)為1,先展示根視圖辈末;
2.難點:數(shù)據(jù)處理愚争,怎么進行展開和收縮。
3.展開處理:點擊cell挤聘,判斷有無子視圖轰枝,有:獲取子視圖數(shù)據(jù),插入到點擊cell所在row的位置后面组去,更新數(shù)據(jù)源鞍陨。插入方法insertRowsAtIndexPaths。無:則不作處理从隆。
4.收縮:點擊cell诚撵,判斷該節(jié)點是否已經(jīng)展開缭裆,如果以展開,遍歷該節(jié)點下的所有子視圖砾脑,獲取所有已展開的數(shù)據(jù)幼驶,在原數(shù)據(jù)中刪除獲取的數(shù)據(jù)艾杏。并調(diào)用deleteRowsAtIndexPaths方法韧衣。
代碼實現(xiàn)
先看一下數(shù)據(jù)格式:
89F5D153-0E1B-4E50-A157-5A7D55FA64A3.png
模型代碼
.h文件
@interface Menu : NSObject
//標題
@property (nonatomic, copy) NSString *type;
//子層次的數(shù)據(jù)
@property (nonatomic, copy) NSArray *subType;
//有無展開
@property (nonatomic, assign) BOOL isOpen;
//層次級別
@property (nonatomic, assign) NSInteger level;
+ (id)menuWithDict:(NSDictionary *)dict;
.m文件
@implementation Menu
+ (id)menuWithDict:(NSDictionary *)dict {
return [[self alloc] initWithDict:dict];
}
- (id)initWithDict:(NSDictionary *)dict {
if (self = [super init]) {
[self setValuesForKeysWithDictionary:dict];
}
return self;
}
cell視圖
#import <UIKit/UIKit.h>
@class Menu;
@interface MenuCell : UITableViewCell
@property (weak, nonatomic) IBOutlet UIButton *selectBtn;
- (void)refreshUI:(Menu *)menu;
@end
#import "MenuCell.h"
#import "Menu.h"
@interface MenuCell ()
@property (weak, nonatomic) IBOutlet UILabel *type;
//距離左邊間距
@property (weak, nonatomic) IBOutlet NSLayoutConstraint *leftWidth;
@end
@implementation MenuCell
- (void)refreshUI:(Menu *)menu {
self.type.text = menu.type;
if (menu.subType.count == 0) {
//無子視圖,隱藏左邊圖標
self.selectBtn.hidden = YES;
} else {
self.selectBtn.hidden = NO;
}
//每個層次距離左邊的間距
self.leftWidth.constant = menu.level * 20 + 8;
}
VC
#import "MenuTableViewController.h"
#import "MenuCell.h"
#import "Menu.h"
@interface MenuTableViewController () <UITableViewDelegate,UITableViewDataSource>
@property (weak, nonatomic) IBOutlet UITableView *menuTableView;
//數(shù)據(jù)源
@property (nonatomic, strong) NSMutableArray *dataSource;
//展開或者收縮 存儲的indexpath
@property (nonatomic, strong) NSMutableArray *deleteOrInsertArray;
@end
@implementation MenuTableViewController
//懶加載數(shù)據(jù)源
- (NSMutableArray *)dataSource {
if (!_dataSource) {
_dataSource = [NSMutableArray new];
NSArray *array = [NSArray arrayWithContentsOfFile:[[NSBundle mainBundle] pathForResource:@"Property List" ofType:@"plist"]];
for (NSDictionary *dict in array) {
Menu *menu = [Menu menuWithDict:dict];
menu.level = 0;
[_dataSource addObject:menu];
}
}
return _dataSource;
}
- (void)viewDidLoad {
[super viewDidLoad];
self.deleteOrInsertArray = [NSMutableArray array];
}
- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section {
return self.dataSource.count;
}
- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath {
return 44;
}
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
MenuCell *cell = [tableView dequeueReusableCellWithIdentifier:@"MenuCell"];
[cell refreshUI:self.dataSource[indexPath.row]];
return cell;
}
- (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath {
Menu *menu = self.dataSource[indexPath.row];
if (menu.subType.count == 0) {
return;
} else {
[self.deleteOrInsertArray removeAllObjects];
if (menu.isOpen) {
//收縮操作
[self deleteRows:menu Row:indexPath.row];
NSMutableIndexSet *set = [NSMutableIndexSet indexSet];
for (int i = 0; i < self.deleteOrInsertArray.count; i ++) {
NSIndexPath *path = self.deleteOrInsertArray[i];
[set addIndex:path.row];
}
[self.dataSource removeObjectsAtIndexes:set];
[self.menuTableView deleteRowsAtIndexPaths:self.deleteOrInsertArray withRowAnimation:UITableViewRowAnimationNone];
} else {
//展開操作
for (int i = 0 ; i < menu.subType.count; i ++) {
Menu *model = [Menu menuWithDict:menu.subType[i]];
model.level = menu.level + 1;
[self.dataSource insertObject:model atIndex:indexPath.row + i + 1];
[self.deleteOrInsertArray addObject:[NSIndexPath indexPathForRow:indexPath.row + i + 1 inSection:0]];
NSLog(@"%@---%ld",model.type,model.level);
}
[self.menuTableView insertRowsAtIndexPaths:self.deleteOrInsertArray withRowAnimation:UITableViewRowAnimationNone];
}
}
menu.isOpen = !menu.isOpen;
MenuCell *cell = (MenuCell *)[tableView cellForRowAtIndexPath:indexPath];
cell.selectBtn.selected = menu.isOpen;
}
- (void)deleteRows:(Menu *)menu Row:(NSInteger)row {
for (int i = 0; i < menu.subType.count; i ++) {
Menu *model = self.dataSource[row + 1 + i];
NSIndexPath *path = [NSIndexPath indexPathForRow:row + i + 1 inSection:0];
[self.deleteOrInsertArray addObject:path];
if (model.subType > 0 && model.isOpen) {
model.isOpen = NO;
[self deleteRows:menu Row:row + menu.subType.count - 1];
}
}
}
所有代碼都已貼出购桑。