您的位置:首页 > 产品设计 > UI/UE

iOS--UITableView 显示二级菜单

2016-03-23 22:59 579 查看
  UITableView上显示二级三级菜单的demo有很多,这里展示一个简单易复用的。

效果图:



代码:原理就是section的头作为展示的一级cell,section里的cell作为二级cell,通过section的状态(YES or NO)来控制是否显示section里的cell

#import "MyEquipmentViewController.h"
#import <Masonry.h>
#import "MyEquipmentCell.h"
#import "EquipmentDeatilViewController.h"

@interface MyEquipmentViewController ()
{
BOOL status[10]; //记录每个单元格的状态   默认no闭合
}
@end

@implementation MyEquipmentViewController

- (void)viewDidLoad {

[super viewDidLoad];
self.view.backgroundColor = [UIColor colorWithRed:239/255.0 green:241/255.0 blue:241/255.0 alpha:1];

//tableView
self.tableView = [[UITableView alloc] initWithFrame:CGRectMake(10, 64, ScreenWidth-20, ScreenHeight-64) style:UITableViewStyleGrouped]; //采用group分组样式
self.tableView.delegate = self;
self.tableView.dataSource = self;
self.tableView.backgroundColor = [UIColor colorWithRed:239/255.0 green:241/255.0 blue:241/255.0 alpha:1];
[self.view addSubview:self.tableView];
//默认第一个分组是打开的
status[0] = YES;
}

#pragma mark------tableview处理
//三个分组
- (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView{

return 3;

}
//每个分组的行数
- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section{

BOOL closeAge = status[section];
//关闭显示为0行
if (closeAge == NO) {
return 0;
}

return 3;
}

//UITableViewCell
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath{

static NSString *cell_id = @"cell_id";
MyEquipmentCell *cell = [tableView dequeueReusableCellWithIdentifier:cell_id];
if (cell == nil) {

cell = [[MyEquipmentCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:cell_id];
cell.backgroundColor = [UIColor whiteColor];
cell.textLabel.textColor = [UIColor grayColor];
}
cell.label.text = @"设备名称1";
return cell;
}
//自定义section的header view
- (UIView *)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section{

UIControl *titileView = [[UIControl alloc] initWithFrame:CGRectZero];
titileView.tag = section;
[titileView addTarget:self action:@selector(sectionAction:) forControlEvents:UIControlEventTouchUpInside];
//设置  头视图的标题什么的
UIImageView *firstImageView = [[UIImageView alloc] initWithFrame:CGRectMake(20, 5, 30, 30)];
firstImageView.backgroundColor = [UIColor redColor];
firstImageView.image = [UIImage imageNamed:@"share.png"];
[titileView addSubview:firstImageView];

UILabel *titleLable = [[UILabel alloc] initWithFrame:CGRectMake(25+30, 10, 100, 30)];
titleLable.backgroundColor = [UIColor clearColor];
titleLable.textColor = [UIColor blackColor];
titleLable.font = [UIFont systemFontOfSize:18];
titleLable.text = @"设备组1";
[titleLable sizeToFit];
[titileView addSubview:titleLable];

UIImageView *lastImageView = [[UIImageView alloc] initWithFrame:CGRectMake(ScreenWidth-30-20, 10, 30, 30)];
lastImageView.backgroundColor = [UIColor redColor];
lastImageView.image = [UIImage imageNamed:@"cellIndat"];
[titileView addSubview:lastImageView];

return titileView;
}
- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath{

return 44;
}
//点击section的header view的方法实现,保存当前section的闭合状态
- (void)sectionAction:(UIControl *)control{

NSInteger section = control.tag;

status[section] = !status[section];

NSIndexSet *indexSet = [NSIndexSet indexSetWithIndex:section];

[_tableView reloadSections:indexSet withRowAnimation:UITableViewRowAnimationFade]; //刷新制定单元格

}
//点击cell
- (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath{

//选中单元格的表现
[tableView deselectRowAtIndexPath:indexPath animated:YES];
[self.navigationController pushViewController:[[EquipmentDeatilViewController alloc] init] animated:YES];
}

//section的header view的高度
- (CGFloat)tableView:(UITableView *)tableView heightForHeaderInSection:(NSInteger)section{

return 44;
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: