UI连载十-----------表视图单元格定制

1.自定义设置单元格，在单元格上放置自己所需要的控件

- ( UITableViewCell *)tableView:( UITableView *)tableView cellForRowAtIndexPath:( NSIndexPath *)indexPath
{
    NSString *identifire = @"Cell" ;
    UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier :identifire];

    if ( cell == nil ) {  

        // 创建单元格，可以设置单元格的类型

        /*
         UITableViewCellStyleDefault, //label+image
         UITableViewCellStyleValue1, // label + image + detailLabel(right)
         UITableViewCellStyleValue2, // label + detailLabel(left)
         UITableViewCellStyleSubtitle   label + image + detailLabel(down)

         */

        cell =[[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:identifire];

        // 注意：控件的创建应该跟 cell 的初始化放在一起，确保 cell 当中只有自己创建的这一个控件，不会出现控件的叠加（共有）

        UIImageView *imageView= [[ UIImageView alloc ] initWithFrame : CGRectMake ( 20 , 20 , 74 , 120 )];
        imageView. tag = 100 ;
        [cell. contentView addSubview :imageView];
       
        // 名称
        UILabel *titlelabel = [[ UILabel alloc ] initWithFrame : CGRectMake ( 100 , 30 , 220 , 30 )];
        titlelabel. font = [ UIFont boldSystemFontOfSize : 20 ];
        titlelabel. textColor = [ UIColor orangeColor ];
        titlelabel. tag = 101 ;
        [cell. contentView addSubview :titlelabel];
       
        // 评分
        UILabel *ratinglabel = [[ UILabel alloc ] initWithFrame : CGRectMake ( 100 , 70 , 220 , 30 )];
        ratinglabel. font = [ UIFont boldSystemFontOfSize : 15 ];
        ratinglabel. textColor = [ UIColor greenColor ];
        ratinglabel. tag = 102 ;
        [cell. contentView addSubview :ratinglabel];
       
        // 出产时间
        UILabel *yearlabel = [[ UILabel alloc ] initWithFrame : CGRectMake ( 100 , 110 , 220 , 30 )];
        yearlabel. font = [ UIFont boldSystemFontOfSize : 15 ];
        yearlabel. textColor = [ UIColor greenColor ];
        yearlabel. tag = 103 ;

        [cell.contentView addSubview:yearlabel];

    }

    NSDictionary *dic = self . data [indexPath. row ];
   
    // 对控件对赋值应该放在外面（特有）

    UIImageView *imgView =( UIImageView *)[cell. contentView viewWithTag : 100 ];
    imgView. image = [ UIImage imageNamed :[dic objectForKey : @"image" ]];
   
   
    UILabel *titlelabel = ( UILabel *)[cell. contentView viewWithTag : 101 ];
    titlelabel. text = [dic objectForKey : @"title" ];
   
    UILabel *ratinglabel = ( UILabel *)[cell. contentView viewWithTag : 102 ];
    ratinglabel. text = [ NSString stringWithFormat : @" 评分 %@" , [dic objectForKey : @"rating" ]];
   
    UILabel *yearlabel = ( UILabel *)[cell. contentView viewWithTag : 103 ];
    yearlabel. text = [ NSString stringWithFormat : @" 出产时间： %@" , [dic objectForKey : @"year" ]];
   
    return cell;

}

- ( CGFloat )tableView:( UITableView *)tableView heightForRowAtIndexPath:( NSIndexPath *)indexPath
{
    return 150 ;

}

2.若用xib文件，就只有下面这段代码不同，其他都一样

    if ( cell == nil ) {

        cell =[[[ NSBundle mainBundle ] loadNibNamed : @"MyCell" owner : self options : nil ] lastObject ];

    }

3.使用storyBoard,在tableView上添加cell，在cell上添加了imageView,3个label

重要

ViewController.h文件：

#import <UIKit/UIKit.h>

@interface ViewController : UIViewController < UITableViewDelegate , UITableViewDataSource >

@property ( nonatomic , strong ) NSArray *data;

@end

ViewController.m文件：

#import "ViewController.h"

#import "MovieCell.h"

@interface ViewController ()

@end

@implementation ViewController

- ( void )viewDidLoad {
    [ super viewDidLoad ];

    NSString *filePath = [[NSBundle mainBundle] pathForResource:@"Films" ofType:@"plist"];

    self.data = [NSArray arrayWithContentsOfFile:filePath];   

}

- ( void )didReceiveMemoryWarning {
    [ super didReceiveMemoryWarning ];
    // Dispose of any resources that can be recreated.

}

#pragma mark -UITableViewDelegate
- ( NSInteger )tableView:( UITableView *)tableView numberOfRowsInSection:( NSInteger )section
{

    return self.data.count;

}

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

    MovieCell *cell = [tableView dequeueReusableCellWithIdentifier:@"Cell" forIndexPath:indexPath];

    // 在控制器中，我们不应该太多去设置视图自己需要显示的内容，控制器充当 MVC 架构模式中的 C ，需要做的应该是     把 M －－－》 V
    //M(Model)

    NSDictionary *contentDic = self.data[indexPath.row];

    //contentDic----> Cell
    //cell.dataDic 调用 set 方法，跳转到 MovieCell.m 文件寻找 set 方法

    cell.dataDic = contentDic;

    return cell;

}

- ( CGFloat )tableView:( UITableView *)tableView heightForRowAtIndexPath:( NSIndexPath *)indexPath
{
    return 140 ;

}

@end

MovieCell.h文件：

#import <UIKit/UIKit.h>

@interface MovieCell : UITableViewCell

@property ( weak , nonatomic ) IBOutlet UIImageView *imgView;
@property ( weak , nonatomic ) IBOutlet UILabel *titleLabel;
@property ( weak , nonatomic ) IBOutlet UILabel *yearLabel;

@property ( weak , nonatomic ) IBOutlet UILabel *ratingLabel;

@property ( nonatomic , strong ) NSDictionary *dataDic;

@end

MovieCell.m文件：

#import "MovieCell.h"

@implementation MovieCell

// 当视图从 xib 或者 storyboard 中加载时，走这个方法 , 相当于初始化方法
- ( void )awakeFromNib {

    // Initialization code    

}

- ( void )setDataDic:( NSDictionary *)dataDic
{
    if ( _dataDic != dataDic) {
        _dataDic = dataDic;

    }

    // 此时能够确保值已经传过来了

    self.imgView.image = [UIImage imageNamed:[self.dataDic objectForKey:@"image"]];

    self . titleLabel . text = [ self . dataDic objectForKey : @"title" ];

    self . yearLabel . text = [ self . dataDic objectForKey : @"year ” ];

    self . ratingLabel . text = [ self . dataDic objectForKey : @"rating" ];

}

4.使用MVC框架，处理数据与UI之间的结构关系(与上一题是同一题，没用storyBoard)

重要

ViewController.h文件：

#import <UIKit/UIKit.h>

@interface ViewController : UIViewController

@property ( nonatomic , strong ) NSArray *data;

@end

ViewController.m文件：

#import "ViewController.h"
#import "MovieCell.h"

#import "MovieModel.h"

@interface ViewController ()< UITableViewDataSource , UITableViewDelegate >

@end

@implementation ViewController

- ( void )viewDidLoad {
    [ super viewDidLoad ];

    // Do any additional setup after loading the view, typically from a nib.

    UITableView *tableView = [[ UITableView alloc ] initWithFrame : self . view . bounds style : UITableViewStylePlain ];
    tableView. backgroundColor = [ UIColor greenColor ];
    tableView. delegate = self ;
    tableView. dataSource = self ;

    [self.view addSubview:tableView];

    tableView. rowHeight = 140 ;

    tableView.contentInset = UIEdgeInsetsMake(64, 0, 0, 0);

    // 由原来装 Dic 改为装 Model

//    self.data = [NSArray arrayWithContentsOfFile:[[NSBundle mainBundle] pathForResource:@"Films" ofType:@"plist"]];

   NSArray *dataArr  = [NSArray arrayWithContentsOfFile:[[NSBundle mainBundle] pathForResource:@"Films" ofType:@"plist"]];

    NSMutableArray *mArr = [NSMutableArray array];

    for ( NSDictionary *dic in dataArr) {
        NSString *title = [dic objectForKey : @"title" ];
        NSString *imgName = [dic objectForKey : @"image" ];
        NSString *rating = [dic objectForKey : @"rating" ];
        NSString *year = [dic objectForKey : @"year" ];
        // 将以上数据填充到 model 中
        MovieModel *model = [[ MovieModel alloc ] init ];

        model.title = [dic objectForKey : @"title" ] ;

        model. imgName = imgName;
        model. rating = rating;
        model. year = year;
        [mArr addObject :model];

    }

    self.data = mArr;  

}

#pragma mark -UITableViewDelegate

- ( NSInteger )tableView:( UITableView *)tableView numberOfRowsInSection:( NSInteger )section
{
    return self . data . count ;

}

- ( UITableViewCell *)tableView:( UITableView *)tableView cellForRowAtIndexPath:( NSIndexPath *)indexPath
{
    NSString *identi = @"Cell" ;
    MovieCell *cell = [tableView dequeueReusableCellWithIdentifier :identi];
    if (cell == nil ) {
        cell = [[ MovieCell alloc ] initWithStyle : UITableViewCellStyleDefault reuseIdentifier :identi];

    }

//    NSDictionary *contentDic = self.data[indexPath.row];

//    cell.dataDic = contentDic;

    cell.model = self.data[indexPath.row];

    return cell;

}

@end

MovieCell.h文件：

#import <UIKit/UIKit.h>

#import "MovieModel.h"

@interface MovieCell : UITableViewCell

//@property (nonatomic, strong) NSDictionary *dataDic;\

@property ( nonatomic , strong ) MovieModel *model;

@end

MovieCell.m文件：

#import "MovieCell.h"

@implementation MovieCell

- ( instancetype )initWithStyle:( UITableViewCellStyle )style reuseIdentifier:( NSString *)reuseIdentifier
{
    self = [ super initWithStyle :style reuseIdentifier :reuseIdentifier];
    if ( self ) {
        //...
        [ self _initViews ];
    }
   
    return self ;

}

- ( void )awakeFromNib {
    // Initialization code
    [ super awakeFromNib ];

    [self _initViews];   

}

// 初始化自身的子视图
- ( void )_initViews

{

    // 图片
    UIImageView *imgView = [[ UIImageView alloc ] initWithFrame : CGRectMake ( 10 , 10 , 100 , 120 )];
    imgView. tag = 100 ;
    imgView. backgroundColor = [ UIColor purpleColor ];

    [self.contentView addSubview:imgView];

    // 标题
    UILabel *titleLabel = [[ UILabel alloc ] initWithFrame : CGRectMake ( 130 , 20 , 220 , 40 )];
    titleLabel. tag = 101 ;
    titleLabel. text = @"hehe" ;
    titleLabel. font = [ UIFont boldSystemFontOfSize : 20 ];
    titleLabel. textColor = [ UIColor orangeColor ];

    [self.contentView addSubview:titleLabel];

    // 评分
    UILabel *ratingLabel = [[ UILabel alloc ] initWithFrame : CGRectMake ( 130 , 70 , 220 , 20 )];
    ratingLabel. text = @"haha" ;
    ratingLabel. tag = 102 ;
    ratingLabel. font = [ UIFont systemFontOfSize : 15 ];
    ratingLabel. textColor = [ UIColor greenColor ];
    [ self . contentView addSubview :ratingLabel];

}

//- (void)setDataDic:(NSDictionary *)dataDic
//{
//    if (_dataDic != dataDic) {
//        _dataDic = dataDic;
//       
//        // 手动调用 layoutSubviews
//        [self setNeedsLayout];
//       
//    }

//}

- ( void )setModel:( MovieModel *)model
{
    if ( _model != model) {

        _model = model;     

        [ self setNeedsLayout ];
    }

}

// 当子视图重新布局时需要调用的方法
- ( void )layoutSubviews

{

    // 一定要注意

    [super layoutSubviews];

    UIImageView *imgView = ( UIImageView *)[ self . contentView viewWithTag : 100 ];
//    imgView.image = [UIImage imageNamed:[self.dataDic objectForKey:@"image"]];

    imgView.image = [UIImage imageNamed:self.model.imgName];

    UILabel *titleLabel = ( UILabel *)[ self . contentView viewWithTag : 101 ];
//    titleLabel.text = [self.dataDic objectForKey:@"title"];

    titleLabel.text = self.model.title;

    UILabel *ratingLabel = ( UILabel *)[ self . contentView viewWithTag : 102 ];
//    ratingLabel.text = [self.dataDic objectForKey:@"rating"];

    ratingLabel.text = self.model.rating;   

}

@end

MovieModel.h文件：

#import <Foundation/Foundation.h>

@interface MovieModel : NSObject

@property ( nonatomic , copy ) NSString *imgName;
@property ( nonatomic , copy ) NSString *title;
@property ( nonatomic , copy ) NSString *rating;

@property ( nonatomic , copy ) NSString *year;

@end

MovieModel.m文件：nil