现在的位置: 首页 > 综合 > 正文

【转】 用nib文件实现 UITableViewCell (多复杂的配置都会变得简单) leo ming

2018年02月14日 ⁄ 综合 ⁄ 共 2141字 ⁄ 字号 评论关闭
转载自 492437598
最终编辑 zhufeng7777777
    原文地址  http://www.aisidechina.com/forum/thread-1318-1-1.html  作者 Leo ming 请保护作者版权。转帖请著名文章出处 谢谢您的合作。艾思德iPhone开发论坛 

大家在上App store 的时候,会不会发现每个程序对应的Cell 设置的都挺好看的,在很多的视频网站也都会看到UITableViewCell 是自定义的。用代码实现一个简单的布局还是可以的,但是要让你的软件突出,有光彩,那么简单的界面是远远不够的。今天我就教大家怎样用nib文件配置复杂 的界面,让问题简单化。nib文件大家都知道了,就是简化我们程序员工作量的一个很好很方便的工具。好了,下面就一步步的跟我来。
首先新建一个工程,我给工程起名叫 UITableViewCellDemo,在UITableViewCellDemoViewController 的nib文件里,我拖入一个UITableView,并设置它的delegate 和 datasource。很简单的一步,并在UITableViewCellDemoViewController.h 以及 .m 里 实现  UITableViewDelegate 和 UItableViewDataSource。

接下来,新建文件 并在 subclass 里 选择  UITableViewCell 这里我命名为 “MyCell” 

建好文件后,在新建一个空的nib文件,也命名为 MyCell .并在MyCell.xib 文件里 拖入一个UITableViewCell 并设置它的Class 为 MyCell.
好了写到这里,工程就完成一大半了,接下来就要看你的创造力与想象力了。在这里我只是简单的介绍给大家怎样创建,并不会写一个很复杂的布局在里面。

我们就简单的做个布局,首先打开MyCell.xib文件里的 MyCell , 并在里面拖入一个View,占满整个cell即可。然后设置MyCell 的Attributes 的 accesoryType 
为 Disclosure indicator 如图。
图片 4.png 
然后。拖入一个UIImageView 拖入一个UILabel 设置其Text 为:Name  在拖入一个 UILabel 设置其Text 为 Leo ming
写到这里就差不多了吧 一个很简单的布局,大概的目的就是显示一个帐户,有名字,头像等。
接下来就要看看怎么链接IBOutlet了 。

在MyCell.h .m 里 分别写 2个IBOutlet 对象

  1. IBOutLet UIImageView *imageView;
  2.       IBOutlet UILabel *nameLabel;

复制代码

然后保存文件。
下面开始链接outlet:
打开 MyCell.xib 打开 MyCell 然后 
图片 6.png 
按照如图所示进行链接outlet. 链接完成后保存文件。进入下一步。

进入 UITableViewCellDemoViewController.m  完成其他的delegate 和 datasource 方法。其他方法想必大家都会了,可能最关心的是怎样在代码里面加载MyCell.xib文件,其实这也是关键所在。
最核心的地方就在

  1. - (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath

复制代码

这个方法里面 看一下代码就会明白怎么回事了。

  1. - (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
  2. {
  3.         static NSString *CellIdentifier = @"CustomCellIdentifier";
  4.    
  5.     MyCell *cell = (MyCell *)[tableView dequeueReusableCellWithIdentifier:CellIdentifier];
  6.     if (cell == nil) {
  7.                 NSArray *array = [[NSBundle mainBundle] loadNibNamed:@"MyCell" owner:self options:nil];
  8.                 cell = [array objectAtIndex:0];
  9.                 [cell setSelectionStyle:UITableViewCellSelectionStyleGray];
  10.     }
  11.         [[cell imageView] setImage:[UIImage imageNamed:[imageNameArray objectAtIndex:indexPath.row]]];
  12.         [[cell nameLabel] setText:[nameArray objectAtIndex:indexPath.row]];
  13.         return cell;
  14. }

复制代码

程 序运行如下
图片 7.png 
好了,程序中用到的图片在附件里面,大家也可以用自己的图片。方法就是这样。希望大家能够创造出绚丽的界面来。谢谢大家 leo ming

          

抱歉!评论已关闭.