iOS Storyboard构造自定义表格UITableView

注:本文所有图片保存EverNote 印象笔记(www.yinxiang.com)当中, 如果有其帐号登录后即可查看全部图片。 如没有帐号可用e-mail >>点击注册免费印象笔记


iOS Storyboard构造自定义表格UITableView

在storyboard 如何构造自定义(custom cell)表格

Alt text

这是一个带图像和文字表格,不用代码情况,用自定如何实现?

一.数据结构

如果没有构造专用类的情况下,我个人比较喜欢用
基于 NSDictionary的数组,它可以用key-value来存储不同类型值在头文件定义

@property (strong,nonatomic) NSMutableArray *nFinders;

viewDidLoad 初始化数组

self.nFinders = [NSMutableArray arrayWithCapacity:16];

并初始化数据

  • (void)initFinderData
    {
NSDictionary *finder1;

finder1 = [NSDictionary dictionaryWithObjectsAndKeys:
           [NSString stringWithFormat:@"%d", 1],@"id",
           @"笔记本电脑", @"name",
           @"icon_laptop", @"image",
           @"status_far", @"state",
           @"OFF", @"power",
           @"a:b:c:d:e:f", @"addr",
           nil];

[ self.nFinders addObject:finder1 ];

NSDictionary *finder2;

finder2 = [NSDictionary dictionaryWithObjectsAndKeys:
           [NSString stringWithFormat:@"%d", 2],@"id",
           @"钱包", @"name",
           @"icon_bag", @"image",
           @"status_near", @"state",
            @"OFF", @"power",
           @"a:b:c:d:e:f", @"addr",
           nil];

 [ self.nFinders addObject:finder2 ];


 NSDictionary *finder3;
finder3 = [NSDictionary dictionaryWithObjectsAndKeys:
           [NSString stringWithFormat:@"%d", 3],@"id",
           @"钥匙", @"name",
           @"icon_keys", @"image",
           @"status_linkloss", @"state",
            @"OFF", @"power",
           @"a:b:c:d:e:f", @"addr",
           nil];

[ self.nFinders addObject:finder3 ];

}

在构造cell 需使用 objectForKey 来查询相应用值

NSString * imageName = [ finder objectForKey:@"image"];

二.构造自定义cell模板

在故事板中画出 cell定义,不同控件用不空的tag
Alt text

那数组里数据如何与界面对应上呢?这里需要用到viewWithTag 这个方法来查找控件了,这里有详细方法

http://www.appcoda.com/ios-programming-customize-uitableview-storyboard/

具体需要修改的控件,定义不同的tag

定义表格数量

-(NSInteger)numberOfSectionsInTableView:(UITableView )tableView
{
return 1;
}
-(NSInteger)tableView:(UITableView
)tableView numberOfRowsInSection:(NSInteger)section
{
// Return the number of rows in the section.
return [ self.nFinders count ];
}

关键方法,构造Cell的方法

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

    static NSString *CellIdentifier = @"Finder";
    UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier];

    if (cell == nil) {
        cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:CellIdentifier];
    }

    NSDictionary *finder = [ self.nFinders objectAtIndex:indexPath.row];


    UIImageView * ImageView = (UIImageView *)[cell viewWithTag:101];

    NSString * imageName = [ finder objectForKey:@"image"];
    ImageView.image = [UIImage imageNamed:imageName];

    UILabel *label = (UILabel *)[cell viewWithTag:102];
     NSString * name = [ finder objectForKey:@"name"];
    [ label setText:name];

    UISwitch * power = (UISwitch *)[cell viewWithTag:103];
    NSString * isOn = [ finder objectForKey:@"power"];

    if( [isOn isEqual:@"ON" ]){
        [ power setOn:YES ];
    }
    else {
        [ power setOn:NO ];
    }


    UIImageView * ImageState = (UIImageView *)[cell viewWithTag:104];
    NSString * stateName = [ finder objectForKey:@"state"];
    ImageState.image = [UIImage imageNamed:stateName];





    return cell;
}

这里可以看image 的设置,用viewWithTag

UIImageView ImageView = (UIImageView )[cell viewWithTag:101];

NSString * imageName = [ finder objectForKey:@"image"];
ImageView.image = [UIImage imageNamed:imageName];

三.UITableCell 创建button 点击事件处理

在表格里按钮是动态创建的,所以事件处理也必须在cell构造用addTarget:来创建事件处理方法

UIButton button = (UIButton )[cell viewWithTag:105];

[button addTarget:self action:@selector(buttonClicked:) forControlEvents:UIControlEventTouchUpInside];

UISwitch connectSwitch = (UISwitch )[cell viewWithTag:103];
[connectSwitch addTarget:self action:@selector(connectSwitchAction:) forControlEvents:UIControlEventValueChanged];

button处理方法中,如何判断是哪一行点击?

一种方法,找出这个button的UITableCell类,进而找到这个cell在表格的行数,下面的getCellBySender就是查找cell的方法

 -(IBAction) buttonClicked:(id)sender {
    UITableViewCell* cell= [Utils getCellBySender:sender ];
    NSIndexPath* indexPath= [self.tableView indexPathForCell:cell];


    DLog(@"click row %d",indexPath.row);

     NSDictionary *finder = [ self.nFinders objectAtIndex:indexPath.row];



     NSString * name = [ finder objectForKey:@"name"];

    NSString * title = [ NSString stringWithFormat:@"%@%@%@", @"bwRange 标签 ",name ,@"发出哔的声音."];



}

查找cell方法,注意在iOS7有所不同,他们多一层ContentView和ScrollView ,因此是4层

//iOS7 UITableViewCell -> UITableViewCellScrollView -->UITableViewCellContentView --> sender
//old version UITableViewCell -> UITableViewCellContentView --> sender

+ (UITableViewCell *)getCellBySender:(UIView *)view
{
    if ([[[view superview] superview] isKindOfClass:[UITableViewCell class]]) {
        return (UITableViewCell *)[[view superview] superview];
    }
    else if ([[[[view superview] superview] superview] isKindOfClass:[UITableViewCell class]]) {
        return (UITableViewCell *)[[[view superview] superview] superview];
    }
    else{
        NSLog(@"something Panic happens");
    }
    return nil;
}

  
  

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值