自定义单元格

当苹果公司提供给的单元格样式不能我们的业务需求的时候,我们需要自定义单元格。在iOS 5之前,自定义单元格可以有两种实现方式:代码实现和用xib技术实现。用xib技术实现相对比较简单,创建一个xib文件,然后定义一个继承 UITableViewCell类单元格类即可。在iOS 5之后我们又有了新的选择,故事板实现方式,这种方式比xib方式更简单一些。

我们把简单表视图案例的原型图修改一下,这种情况下四种内置的单元格样式就不合适了。

采用“Single View Application”工程模版创建一个名为“CustomCell”的工程,Table View属性的“Prototype Cells”项目设为1(除此之外其它的操作过程与上同)。

设计画面中上部会有一个单元格设计画面,我们可以在这个位置进行单元格布局的设计。从对象库拖拽一个Label和Image View到单元格设计画面,调整好它们的位置。

创建自定义单元格类CustomCell, 选择UITableViewCell为父类

再 回到IB设计画面,在IB中左边选择“Table View Controller Scene” → “Table View Controller” → “Table View” → “Table View Cell”,打开单元格的标识检查器,在Class的选项中选择CustomCell类。

为Lable和ImageView控件连接输出口

本案例的代码如下:

////CustomCell.h//CustomCell#import<UIKit/UIKit.h>@interfaceCustomCell:UITableViewCell@property(weak,nonatomic)IBOutletUILabel*name;@property(weak,nonatomic)IBOutletUIImageView*p_w_picpath;@end////CustomCell.m//CustomCell#import“CustomCell.h”@implementationCustomCell@end

CustomCell类的代码比较简单,在有些业务中还需要定义动作。

修改视图控制器ViewController.m中的tableView: cellForRowAtIndexPath:方法,代码如下:

-(UITableViewCell*)tableView:(UITableView*)tableViewcellForRowAtIndexPath:(NSIndexPath*)indexPath{staticNSString*CellIdentifier=@”Cell”;CustomCell*cell=[tableViewdequeueReusableCellWithIdentifier:CellIdentifier];if(cell==nil){cell=[[UITableViewCellalloc]initWithStyle:UITableViewCellStyleDefaultreuseIdentifier:CellIdentifier];}NSUIntegerrow=[indexPathrow];NSDictionary*rowDict=[self.listTeamsobjectAtIndex:row];cell.name.text=[rowDictobjectForKey:@"name"];cell.p_w_picpath.p_w_picpath=[UIImagep_w_picpathNamed:[rowDictobjectForKey:@"p_w_picpath"]];NSUIntegerrow=[indexPathrow];NSDictionary*rowDict=[self.listFilterTeamsobjectAtIndex:row];cell.textLabel.text=[rowDictobjectForKey:@"name"];NSString*p_w_picpathPath=[rowDictobjectForKey:@"p_w_picpath"];p_w_picpathPath=[p_w_picpathPathstringByAppendingString:@".png"];cell.p_w_picpath.p_w_picpath=[UIImagep_w_picpathNamed:p_w_picpathPath];cell.accessoryType=UITableViewCellAccessoryDisclosureIndicator;returncell;}

我们看到if (cell == nil){}代码被移除,这是因为我们在IB中已经将重用标识设定为Cell了。 方法中的其它代码与简单表一致,此处不再赘述。运行一下。