仿QQ好友的分组收缩展开界面

界面效果

 

主要思路:

1.利用viewForHeaderInSection方法,自定义UITableView的header,在其上放置一个按钮

2.点击按钮后,判断指定section的数据是否展开

3.在返回numberOfRowsInSection数量时,如果发现是收缩的,则返回0,展开时,才给真实数据的行号

这样就可以达到显示/隐含数据的效果

 

实现代码:

1.自定义UITableView的header

 

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

   return 40;
}

 


- (UIView *)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section;  
{
 
  
 UIView *hView;
 if (UIInterfaceOrientationLandscapeRight == [[UIDevice currentDevice] orientation] ||
   UIInterfaceOrientationLandscapeLeft == [[UIDevice currentDevice] orientation])
 {
  hView = [[UIView alloc]initWithFrame:CGRectMake(0, 0, 480, 40)];
 }
 else
 {
  hView = [[UIView alloc]initWithFrame:CGRectMake(0, 0, 320, 40)];

 }
  
 UIButton* eButton = [[UIButton alloc] init];
  
 //按钮填充整个视图
 eButton.frame = hView.frame;
 [eButton addTarget:self action:@selector(expandButtonClicked:)
 forControlEvents:UIControlEventTouchUpInside];
 eButton.tag = section;//把节号保存到按钮tag,以便传递到expandButtonClicked方法
  
 //根据是否展开,切换按钮显示图片
 if ([self isExpanded:section])
  [eButton setImage: [ UIImage imageNamed: @"btn_down.png" ] forState:UIControlStateNormal];
 else
  [eButton setImage: [ UIImage imageNamed: @"btn_right.png" ] forState:UIControlStateNormal];
  
  
 //由于按钮的标题,
 //4个参数是上边界,左边界,下边界,右边界。
 eButton.contentHorizontalAlignment = UIControlContentHorizontalAlignmentLeft;
 [eButton setTitleEdgeInsets:UIEdgeInsetsMake(5, 10, 0, 0)];
 [eButton setImageEdgeInsets:UIEdgeInsetsMake(5, 5, 0, 0)];
  
  
 //设置按钮显示颜色
 eButton.backgroundColor = [UIColor lightGrayColor];
 [eButton setTitle:[[data objectAtIndex:section] objectForKey:@"groupname"] forState:UIControlStateNormal];
 [eButton setTitleColor:[UIColor blackColor] forState:UIControlStateNormal];
  //[eButton setTitleColor:[UIColor blackColor] forState:UIControlStateNormal];
 
 [eButton setBackgroundImage: [ UIImage imageNamed: @"btn_listbg.png" ] forState:UIControlStateNormal];//btn_line.png"
 //[eButton setTitleShadowColor:[UIColor colorWithWhite:0.1 alpha:1] forState:UIControlStateNormal];
 //[eButton.titleLabel setShadowOffset:CGSizeMake(1, 1)];
  
 [hView addSubview: eButton];

 

2. 点击按钮后相关处理代码


//对指定的节进行“展开/折叠”操作
-(void)collapseOrExpand:(int)section{
 Boolean expanded = NO;
 //Boolean searched = NO;
 NSMutableDictionary* d=[data objectAtIndex:section];
 
 //若本节model中的“expanded”属性不为空,则取出来
 if([d objectForKey:@"expanded"]!=nil)
  expanded=[[d objectForKey:@"expanded"]intValue];
 
 //若原来是折叠的则展开,若原来是展开的则折叠
 [d setObject:[NSNumber numberWithBool:!expanded] forKey:@"expanded"];

}


//返回指定节的“expanded”值
-(Boolean)isExpanded:(int)section{
 Boolean expanded = NO;
 NSMutableDictionary* d=[data objectAtIndex:section];
 
 //若本节model中的“expanded”属性不为空,则取出来
 if([d objectForKey:@"expanded"]!=nil)
  expanded=[[d objectForKey:@"expanded"]intValue];
 
 return expanded;
}


//按钮被点击时触发
-(void)expandButtonClicked:(id)sender{
 
 UIButton* btn= (UIButton*)sender;
 int section= btn.tag; //取得tag知道点击对应哪个块
 
 // NSLog(@"click %d", section);
 [self collapseOrExpand:section];
 
 //刷新tableview
 [tbView reloadData];
 
}

  
 [eButton release];
 return hView;

}


3. 实现UITableView的Delegate

 


- (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView {
    // Return the number of sections.

    return [data count];
}


- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section {
    // Return the number of rows in the section.
 
 
 //对指定节进行“展开”判断
 if (![self isExpanded:section]) {
  
  //若本节是“折叠”的,其行数返回为0
  return 0;
 }
 
 NSDictionary* d=[data objectAtIndex:section];
 return [[d objectForKey:@"users"] count];
 
}


// Customize the appearance of table view cells.
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
   
    static NSString *CellIdentifier = @"Cell";
   
    UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier];
    if (cell == nil) {
        cell = [[[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:CellIdentifier] autorelease];
    }
   

 NSDictionary* m= (NSDictionary*)[data objectAtIndex: indexPath.section];
 NSArray *d = (NSArray*)[m objectForKey:@"users"];
  
 if (d == nil) {
  return cell;
 }
 
 //显示联系人名称

 cell.textLabel.text = [d objectAtIndex: indexPath.row];

 cell.textLabel.backgroundColor = [UIColor clearColor];
 
 //UIColor *newColor = [[UIColor alloc] initWithRed:(float) green:(float) blue:(float) alpha:(float)];
 cell.backgroundColor =  [UIColor colorWithPatternImage:[UIImage imageNamed:@"btn_listbg.png"]];
 cell.imageView.image = [UIImage imageNamed:@"mod_user.png"];

 
 //选中行时灰色
 cell.selectionStyle = UITableViewCellSelectionStyleGray;
 [cell setAccessoryType: UITableViewCellAccessoryDisclosureIndicator];

    return cell;
}


源代码下载地址:http://download.csdn.net/detail/txinfo/4131623

你可能感兴趣的:(iphone开发)