iOS QQ列表效果实现
效果如下：
实现效果主要分为两个部分：
-
数据模型
-
tableview
要实现tableview需要实现DataSource和delegate
datasource主要作用在于显示什么数据
delegate主要作用是事件响应即处理
代码如下：.h
// controller @interface ViewController : UIViewController <UITableViewDataSource, UITableViewDelegate> @property (nonatomic, retain) NSMutableArray *dataList; // 数据 @property (nonatomic, retain) UITableView *tableView; @end
.m 文件
@implementation ViewController - (void)viewDidLoad { [super viewDidLoad]; // Do any additional setup after loading the view, typically from a nib. [self initDataList]; // 初始化数据 // 向下移20 CGRect frame = self.view.frame; frame.origin.y = 20; frame.size.height = frame.size.height - 20; self.tableView = [[UITableView alloc] initWithFrame:frame style:UITableViewStylePlain]; // 设置委托 self.tableView.dataSource = self; self.tableView.delegate = self; [self.view addSubview:self.tableView]; } - (void)didReceiveMemoryWarning { [super didReceiveMemoryWarning]; // Dispose of any resources that can be recreated. } #pragma mark - DataSource实现 // 一共几个section - (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView { return [self.dataList count]; } // 每个section下有多少个组 - (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section { List *list = [self.dataList objectAtIndex:section]; NSMutableArray *array = list.groups; NSInteger all = [array count]; for (Group *group in array) { if (group.isDelop) { all = all + [group.friends count]; } } return all; } // 显示每个cell - (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath { if ([self isGroup:indexPath]) { return [self getGroupCell:tableView and:indexPath]; // 分组的cell } return [self getFriendCell:tableView and:indexPath]; // 好友cell } /* * 获得section标题 **/ - (NSString *)tableView:(UITableView *)tableView titleForHeaderInSection:(NSInteger)section { List *list = [self.dataList objectAtIndex:section]; return list.title; } #pragma mark - 点击事件 // 单击的处理，若是分组 则展开，否则不处理 - (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath { Group *group = [self isGroup:indexPath]; // 如果点击的是分组，则取当前状态的反并更新数据 if (group) { group.isDelop = !group.isDelop; [self.tableView reloadData]; } } #pragma mark - 获取点击位置的数据 /* * 所点位置是否是分组，返回所点分组数据 **/ - (Group *)isGroup:(NSIndexPath *)indexPath { int num = -1; NSUInteger index = indexPath.row; List *list = [_dataList objectAtIndex:indexPath.section]; NSMutableArray *groups = list.groups; for (Group *group in groups) { num++; if (index == num) { return group; } if (group.isDelop) { num += [group.friends count]; if (index <= num) { return nil; } } } return nil; } /* * 所点位置是否是好友，并返回所点好友数据 **/ - (Friend *)isFriend:(NSIndexPath *)indexPath { int num = -1; NSUInteger index = indexPath.row; List *list = [_dataList objectAtIndex:indexPath.section]; // 获取点的section NSMutableArray *groups = list.groups; // 获取section下的所有分组 for (Group *group in groups) { num++; if (group.isDelop) { int temp = num; num += [group.friends count]; if (index <= num) { int k = index - temp - 1; return [group.friends objectAtIndex:k]; } } } return nil; } #pragma mark - 初始化cell /* * 设置分组的cell **/ - (UITableViewCell *)getGroupCell:(UITableView *)tableView and:(NSIndexPath *)indexPath { Group *nowGroup = [self isGroup:indexPath]; static NSString *CellWithIdentifier = @"GroupCell"; UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:CellWithIdentifier]; if (cell == nil) { cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleValue1 reuseIdentifier:CellWithIdentifier]; cell.backgroundColor = [UIColor colorWithRed:227/250.0 green:168/250.0 blue:105/250.0 alpha:1]; } cell.textLabel.text = nowGroup.title; cell.detailTextLabel.text = nowGroup.detail; if (nowGroup.isDelop) { cell.imageView.image = [UIImage imageNamed:@"collect.png"]; } else { cell.imageView.image = [UIImage imageNamed:@"tomore.png"]; } return cell; } /* * 设置好友cell **/ - (UITableViewCell *)getFriendCell:(UITableView *)tableView and:(NSIndexPath *)indexPath { Friend *nowFriend = [self isFriend:indexPath]; static NSString *CellWithIdentifier = @"FriendCell"; UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:CellWithIdentifier]; if (cell == nil) { cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleSubtitle reuseIdentifier:CellWithIdentifier]; } // 设置cell数据 cell.textLabel.text = nowFriend.name; cell.detailTextLabel.text = nowFriend.state; cell.imageView.image = [UIImage imageNamed:nowFriend.image]; return cell; } #pragma mark - 大小样式设置 - (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath { if ([self isGroup:indexPath]) { return 30; // 分组高 } return 40; // 好友的行高 } - (CGFloat)tableView:(UITableView *)tableView heightForHeaderInSection:(NSInteger)section { return 20; } #pragma mark - 所显示的数据 /* * 数据初始化构造 **/ - (void)initDataList { Friend *friend1 = [[Friend alloc] initWithImage:@"back1.jpg" name:@"苦海无涯" states:@"[在线] 哎 心疼!!"]; Friend *friend2 = [[Friend alloc] initWithImage:@"back2.jpg" name:@"段天涯" states:@"[在线] 心疼!!"]; Friend *friend3 = [[Friend alloc] initWithImage:@"back3.jpg" name:@"小妹妹" states:@"[在线] 疼!!"]; Friend *friend4 = [[Friend alloc] initWithImage:@"back4.jpg" name:@"呼哈" states:@"[在线]心疼!!"]; NSMutableArray *array1 = [NSMutableArray arrayWithObjects:friend1, friend2, friend3, friend4, nil]; Group *group1 = [[Group alloc] initWithTitle:@"家人" delop:NO friends:array1]; group1.detail = @"4/4"; Friend *friend5 = [[Friend alloc] initWithImage:@"back5.jpg" name:@"段" states:@"[在线] 心疼!!"]; Friend *friend6 = [[Friend alloc] initWithImage:@"back6.jpg" name:@"小商人" states:@"[在线] 疼!!"]; Friend *friend7 = [[Friend alloc] initWithImage:@"back7.jpg" name:@"大哥" states:@"[离线] 心疼!!"]; NSMutableArray *array2 = [NSMutableArray arrayWithObjects:friend5, friend6, friend7, nil]; Group *group2 = [[Group alloc] initWithTitle:@"朋友" delop:NO friends:array2]; group2.detail = @"2/3"; NSMutableArray *l1 = [NSMutableArray arrayWithObjects:group1, group2, nil]; List *list1 = [[List alloc] initWithTitle:@"我的好友" groups:l1]; Friend *mobile = [[Friend alloc] initWithImage:@"back1.jpg" name:@"我的手机" states:@"[离线]手机未上线"]; NSMutableArray *array = [NSMutableArray arrayWithObjects:mobile, nil]; Group *group = [[Group alloc] initWithTitle:@"我的设备" delop:NO friends:array]; group.detail = @"0/1"; NSMutableArray *l2 = [NSMutableArray arrayWithObjects:group, nil]; List *list2 = [[List alloc] initWithTitle:@"我的手机" groups:l2]; self.dataList = [NSMutableArray arrayWithObjects:list2, list1, nil]; } @end ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
数据模型实现
// 好友数据对象 @interface Friend : NSObject @property (nonatomic, retain) NSString *image; // 头像 @property (nonatomic, retain) NSString *name; // 昵称 @property (nonatomic, retain) NSString *state; // 说说 @end // 分组对象 @interface Group : NSObject @property (nonatomic, assign) BOOL isDelop; // 是否展开 @property (nonatomic, retain) NSString *title; // 分组名称 @property (nonatomic, retain) NSString *detail; // 在线状态 @property (nonatomic, retain) NSMutableArray *friends; // 好友列表 @end // 整个qq列表 @interface List : NSObject @property (nonatomic, retain) NSString *title; // 列表名称 @property (nonatomic, retain) NSMutableArray *groups; // 列表内分组 @end
数据模型的构造方法就不贴上来了，实现部分每个类只有一个构造方法