`

新风作浪博客学习(十二)代码实现UITableViewCell表视图单元定制 .

    博客分类:
  • ios
ios 
阅读更多
通常情况下我们会希望单元格UITableViewCell显示自定义不同数据,一般有两种方法,一种是通过代码给UITableViewCell在添加子视图,另一个就是用nib文件加载子视图;




本文是在iPhone4与iPad开发基础教程上的一个实例,因为纯代码编写和书上Xcode版本过老的问题,代码和书上有些细微不同,笔者为什么还写出来呢,因为在写的时候种种细节都是影响视图不能正确显示的原因,虽然是看着书上代码敲得的,运行和没有一个错误警告但是就是不能正确显示出来,我想大部分初学者和我一样的感受,以此文告诫自己:做一个细心的人;




1.新建工程名为TableViewCell , File->New->Project ->single View Application -> next
[img]

[/img]





2.添加协议
#import <UIKit/UIKit.h>
#define kNameValueTag 1
#define kColorValueTag 2

@interface TVCViewController : UIViewController
<UITableViewDataSource,UITableViewDelegate>

@property (nonatomic,strong) UITableView *tableView;
@property (nonatomic,strong) UITableViewCell *tableViewCell;
@property (nonatomic,strong) NSArray *computers;

@end

并在.m文件的@implementation TVCViewController后面添加


@synthesize tableView = _tableView;

@synthesize tableViewCell = _tableViewCell;

@synthesize computers = _computers;





3.表视图的初始化
- (void)viewDidLoad
{
    [super viewDidLoad];
	
    _tableView = [[UITableView alloc] initWithFrame:self.view.frame];
    
    self.tableView.delegate=self;
    self.tableView.dataSource=self;
    [self.view addSubview:_tableView];
    
    NSDictionary *row1 = [[NSDictionary alloc] initWithObjectsAndKeys:@"MacBook",@"Name",@"White",@"Color", nil];
    NSDictionary *row2 = [[NSDictionary alloc] initWithObjectsAndKeys:@"MacBook Pro",@"Name",@"Sliver",@"Color",nil];
    NSDictionary *row3 = [[NSDictionary alloc] initWithObjectsAndKeys:@"iMac",@"Name",@"Sliver",@"Color", nil];
    NSDictionary *row4 = [[NSDictionary alloc] initWithObjectsAndKeys:@"Mac Mini",@"Name",@"Sliver",@"Color", nil];
    NSDictionary *row5 = [[NSDictionary alloc] initWithObjectsAndKeys:@"Mac Pro",@"Name",@"Sliver",@"Color", nil];
    
    NSArray *array = [[NSArray alloc]initWithObjects:row1,row2,row3,row4,row5, nil];
    _computers=array;
    
}


_computers=array等价于self.computers = array;






4.委托方法
-(NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section
{
    return [_computers count];
}


-(UITableViewCell *) tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
    static NSString *CellTableIdentifier = @"CellTabeIndentifier";
    
    UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:CellTableIdentifier];
    if (cell == nil) {
        cell = [[UITableViewCell alloc]initWithStyle:UITableViewCellStyleDefault reuseIdentifier:CellTableIdentifier];
        
        CGRect nameLabelRect = CGRectMake(0, 5, 70, 15);
        UILabel *nameLabel = [[UILabel alloc] initWithFrame:nameLabelRect];
        nameLabel.textAlignment = UITextAlignmentRight;
        nameLabel.text = @"Name:";
        nameLabel.font = [UIFont boldSystemFontOfSize:12];
        [cell.contentView addSubview:nameLabel];
        
        CGRect colorLabelRect = CGRectMake(0, 26, 70, 15);
        UILabel *colorLabel = [[UILabel alloc] initWithFrame:colorLabelRect];
        colorLabel.textAlignment = UITextAlignmentRight;
        colorLabel.text = @"Color:";
        colorLabel.font = [UIFont boldSystemFontOfSize:12];
        [cell.contentView addSubview:colorLabel];
        
        CGRect nameValueRect = CGRectMake(80, 5, 200, 15);
        UILabel *nameValue = [[UILabel alloc] initWithFrame:nameValueRect];
        nameValue.tag = kNameValueTag;
        [cell.contentView addSubview:nameValue];
        
        CGRect colorValueRect = CGRectMake(80, 25, 200, 15);
        UILabel *colorValue = [[UILabel alloc] initWithFrame:colorValueRect];
        colorValue.tag = kColorValueTag;
        [cell.contentView addSubview:colorValue];
        
    }
     
    NSUInteger row = [indexPath row];
    NSDictionary *rowData = [_computers objectAtIndex:row];
    UILabel *name =(UILabel *)[cell.contentView viewWithTag:kNameValueTag];
    name.text = [rowData objectForKey:@"Name"];
    
    UILabel *color = (UILabel *)[cell.contentView viewWithTag:kColorValueTag];
    color.text = [rowData objectForKey:@"Color"];
    
    return cell;
}



本段代码实现的是在表视图单元内添加了4个UILabel,两个静态,两个动态;动态的用于显示储存在字典数组中的数据;


对这行代码[cell.contentView addSubview:nameLabel];有些疑问,然后查了一下contentView的定义,在UITableViewCell中这样定义,

[img]

[/img]

书上这样解释:表视图单元已经有了一个名为contentView的UIView子视图,用于对他的所有子视图惊喜分组,,所以我们再添加标签的时候,不用把标签作为子视图直接添加到表视图单元中,而是添加到contentView上;

在.h文件中我们看见了两个宏定义,然后在这段的代码中将宏定义的值赋给了两个label的tag,label的tag属性相当于标记的符号




5.运行结果截图
[img]

[/img]


[img]

[/img]

5.运行结果截一张图就够了,为什么我截图截了两张,此处我想说说一下,单元格的重用问题;

蓝色部分表示的是被我选中的部分,但是蓝色下面的的单元格不能被选中,为什么,因为它并没有被创建,意思就是它的上面并

  • 大小: 182.7 KB
  • 大小: 13.5 KB
  • 大小: 102.5 KB
  • 大小: 102.4 KB
分享到:
评论

相关推荐

    代码实现UITableViewCell表视图单元定制

    总的来说,自定义UITableViewCell是iOS开发中的常见操作,它允许开发者根据需求构建高度定制的列表视图。通过理解并熟练运用上述知识点,你可以轻松创建出功能丰富、界面美观的UITableView。在实践中不断探索和优化...

    ios源码之UITableViewCell 视图扩展Demo.rar

    总之,"ios源码之UITableViewCell 视图扩展Demo"是一个学习如何在iOS应用中有效利用和扩展UITableViewCell的实践案例。通过这个Demo,开发者可以深入理解UITableView的工作原理,掌握自定义cell的技巧,提升iOS应用...

    IOS源码应用Demo-UITableViewCell 视图扩展.zip

    在iOS开发中,UITableViewCell是UITableView的基本单元,用于展示表格中的每一行数据。这个" IOS源码应用Demo-UITableViewCell 视图扩展.zip "很可能是为了帮助开发者深入理解如何自定义UITableViewCell,以便实现更...

    IOS应用源码——UITableViewCell 视图扩展.zip

    在iOS开发中,`UITableViewCell`是用于显示表视图(UITableView)中的每一行数据的标准组件。源码可能是为了实现自定义的UITableViewCell,以增强其功能或视觉效果,比如添加额外的UI元素或者交互。 描述中的内容...

    UITableViewCell 视图扩展.zipIOS应用例子源码下载

    UITableViewCell 视图扩展.zipIOS应用例子源码下载UITableViewCell 视图扩展.zipIOS应用例子源码下载 1.适合学生学习研究参考 2.适合个人学习研究参考 3.适合公司开发项目技术参考

    IOS开发UITableViewCell自定义那点事.pdf

    除了代码实现之外,还可以通过XIB文件来实现UITableViewCell的自定义。这种方式更加直观,适合那些复杂的布局设计。要在XIB文件中创建UITableViewCell,可以先创建一个新的XIB文件,然后在Storyboard中拖拽一个...

    ios-UItableViewCell自定义多选的cell.zip

    在这个"ios-UItableViewCell自定义多选的cell.zip"压缩包中,包含的"TableViewDidSelectDemo"很可能是演示如何实现这个功能的一个示例代码。 首先,我们来看一下UITableView的基本使用。UITableView由两个主要部分...

    代码实现 UITableView与UITableViewCell

    9. **分组表视图**: 如果需要,可以将数据分组显示,通过实现`numberOfSections(in:)`和`titleForHeaderInSection:`来创建分组。 10. **自定义分割线**: 可以通过设置`separatorStyle`改变分割线样式,或者完全...

    继承UITableViewCell定制表格行.zip

    本项目“继承UITableViewCell定制表格行.zip”关注的是如何通过继承UITableViewCell来创建自定义的表格行,从而实现更加丰富的显示效果和交互功能。下面将详细解释这个知识点。 首先,我们需要理解UITableViewCell...

    ios-iOS UITableViewCell 单选 Button设置image.zip

    首先,我们需要创建一个自定义的UITableViewCell子类,以便对Cell进行更精细的定制。在子类中,我们可以添加一个UIButton作为单选按钮。为了实现单选功能,我们通常会用到一个协议(如RadioDelegate)和一个变量来...

    IOS应用源码——UITableViewCell 视图扩展.rar

    这份名为"UITableViewCell 视图扩展"的源码压缩包显然包含了对这个原生组件的自定义扩展,以满足更复杂的设计需求或功能实现。在iOS应用开发中,扩展UITableViewCell可以极大地提高用户体验和界面美观度。 首先,...

    ios项目源代码 各种布局控件使用及扩展视图自定义UITableViewCell等源码合集.rar

    ios项目源代码 各种布局控件使用及扩展视图自定义UITableViewCell等源码合集: DTCoreText-1.6.10在UITextView上实现十分丰富的文字效果 ios三级展开列表TQMultistageTableView_10802 ios个性化每个...

    移动软件开发-3期(KC015) 表视图 教学设计.doc

    【移动软件开发-3期(KC015) 表视图 教学设计】文档主要涉及iOS应用开发中的表视图(UITableView)及其相关知识,这是iOS开发中不可或缺的一部分。表视图是一种用于展示数据列表的视图,通常包含多个层次的数据,如...

    ios-UItableViewCell 自适应 (SDAutoLayout).zip

    使用SDAutoLayout 自适应UITableViewCell 自适应, Cell上需要展示三个属性右侧图片,titleLabel, textLabel, timeLabel. 四个属性, 需要自适应的label为 textLabel1, 白 糗事百科的数据接口封装在model中 然后添加在...

    UITableViewCell的四种不同的定制单元格方式

    如果不希望使用Interface Builder,可以完全用代码来创建和定制UITableViewCell。首先,创建一个新的Swift或Objective-C类,继承自UITableViewCell,并在其中初始化和布局UI元素。在`awakeFromNib`方法中设置默认...

    IOS源码——自定义UITableViewCell。实现各种样式的表格输入界面.7z

    7. 数据模型绑定:为了将数据绑定到视图,需要有一个数据模型来存储表视图的数据。在 `- tableView:cellForRowAtIndexPath:` 方法中,将数据模型的属性设置到相应的视图元素上。 8. 用户交互处理:当用户在自定义...

    二级表视图和表视图的修改

    对于文件名“QQTableViewTest”,这可能是开发者创建的一个示例项目,用于测试和学习如何实现和修改二级表视图。在这个项目中,可能包含了UITableView或RecyclerView的相关代码、数据模型、布局文件等,开发者可以...

    ios-UITableViewCell折叠效果.zip

    通过分析和运行这些代码,开发者可以直观地学习到如何实现这样的动态效果,并可以将其应用于自己的项目中。 总之,实现UITableViewCell的折叠拉伸效果是提升用户交互体验的一个有效手段。通过动态调整cell高度和...

    IOS应用源码——在UIPickerView 选择时,UITableViewCell自动填充值.rar

    这个压缩包文件“IOS应用源码——在UIPickerView 选择时,UITableViewCell自动填充值.rar”显然包含了一个示例项目,演示了如何在用户在UIPickerView中进行选择时,自动更新UITableView中的单元格(UITableViewCell...

Global site tag (gtag.js) - Google Analytics