IOS开发学习笔记041-UITableView总结1

一、UITableView的常用属性

1、分割线

    // 分割线

    self.tableView.separatorColor = [UIColorredColor];

    屏幕快照 2015 06 04 10 57 43

    // 隐藏分割线

    self.tableView.separatorStyle = UITableViewCellSeparatorStyleNone;

         屏幕快照 2015 06 04 10 58 05

2、选中样式

    // cell选中样式,貌似几个枚举效果都一样

    cell.selectionStyle = UITableViewCellSelectionStyleBlue;

   屏幕快照 2015 06 04 11 01 58

    // cell选中背景色

    UIView *selectedBackground = [[UIView alloc] init];

    selectedBackground.backgroundColor = [UIColor greenColor];

    cell.selectedBackgroundView = selectedBackground;

    屏幕快照 2015 06 04 11 04 50  

3、背景色

    // cell默认背景色

    cell.backgroundColor = [UIColor redColor];

    屏幕快照 2015 06 04 11 10 38

    // backgroundView 的优先级大于backgroundColor

    UIView *background = [[UIView alloc] init];

    background.backgroundColor = [UIColor orangeColor];

    cell.backgroundView = background;

    屏幕快照 2015 06 04 11 10 58

 设置背景色有两种方式,注意一点就是 :

 backgroundView 的优先级大于backgroundColor

4、指示器

指示器默认显示的是第一个 UITableViewCellAccessoryNone

typedef NS_ENUM(NSInteger, UITableViewCellAccessoryType) {

    UITableViewCellAccessoryNone,                   // don't show any accessory view

    UITableViewCellAccessoryDisclosureIndicator,    // regular chevron. doesn't track

    UITableViewCellAccessoryDetailDisclosureButton, // info button w/ chevron. tracks

    UITableViewCellAccessoryCheckmark,              // checkmark. doesn't track

    UITableViewCellAccessoryDetailButton NS_ENUM_AVAILABLE_IOS(7_0) // info button. tracks

};

样式依次为:

屏幕快照 2015 06 04 11 18 42

屏幕快照 2015 06 04 11 15 17

屏幕快照 2015 06 04 11 17 19

屏幕快照 2015 06 04 11 14 33

屏幕快照 2015 06 04 11 14 56

    // cell指示器

    cell.accessoryType = UITableViewCellAccessoryCheckmark;

也可以自定义View显示。

    // 显示预定义按钮

    cell.accessoryView = [UIButtonbuttonWithType:UIButtonTypeContactAdd];

    屏幕快照 2015 06 04 11 41 00

    // 自定义view

    UILabel *name  = [[UILabel alloc] init];

    name.frame = CGRectMake(200, 0, 80, 40);

    name.text = [NSString stringWithFormat: @"英雄%zd",indexPath.row + 1];

    name.textAlignment = NSTextAlignmentRight;

    name.textColor = [UIColor lightGrayColor];

    cell.accessoryView = name;

    屏幕快照 2015 06 04 11 43 17

二、cell的循环利用方式

  1、方式1

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

{  

    /**

     *  什么时候调用:每当有一个cell进入视野范围内就会调用

     */

    // 0.重用标识

    // static修饰的局部变量:只会初始化一次,在整个程序运行过程中,只有一份内存

    static NSString *ID = @"cell";

    

    // 1.先根据cell的标识去缓存池中查找可循环利用的cell

    UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:ID];

    

    // 2.如果cellnil(缓存池找不到对应的cell

    if (cell == nil) {

        cell = [[UITableViewCellalloc] initWithStyle:UITableViewCellStyleDefaultreuseIdentifier:ID];

    }

    

    // 3.覆盖数据

    cell.textLabel.text = [NSString stringWithFormat:@"testdata - %zd", indexPath.row];

    

 

    return  cell;

}

  2、方式2

  • 定义一个全局变量

     // 定义重用标识

   NSString *ID = @"cell";

   

  • 注册某个标识对应的cell类型

    - (void)viewDidLoad {

        [super viewDidLoad];

        

        // 注册某个标识对应的cell类型

        [self.tableView registerClass:[UITableViewCell class] forCellReuseIdentifier:ID];

    }

  • 在数据源方法中返回cell,
dequeueReusableCellWithIdentifier:方法会自动查找cell,如果没有找到,就按照注册类型的cell,重新创建一个并返回。
 

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

    {

        // 1.去缓存池中查找cell

        UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:ID];

        

        // 2.覆盖数据

        cell.textLabel.text = [NSString stringWithFormat:@"testdata - %zd", indexPath.row];

        

        return cell;

    }

  3、方式3

  • 在storyboard中设置UITableView的Dynamic Prototypes Cell

    Snip20150602 152

  • 设置cell的重用标识 

    Snip20150602 153

  • 在代码中利用重用标识获取cell

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

    {

     

        // 0.重用标识

        // static修饰的局部变量:只会初始化一次,在整个程序运行过程中,只有一份内存

        static NSString *ID = @"cell";

        

        // 1.先根据cell的标识去缓存池中查找可循环利用的cell

        UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:ID];

        

        // 2.覆盖数据

        cell.textLabel.text = [NSString stringWithFormat:@"cell - %zd", indexPath.row];

        

        return  cell;

    }  

三、自定义cell

使用系统自带的cell有时不能满足需求,可以自定义cell,实现自己想要的界面。

 cell的自定义分两种,等高的和不等高的,等高的比较容易实现。

实现界面如下:

 屏幕快照 2015 06 04 15 07 43

  1、等高cell

    storyboard实现自定义cell

  • 创建一个继承自UITableViewCell的子类,比如SLQFengCell

     

    #import <UIKit/UIKit.h>

     

    @interface SLQFengCell : UITableViewCell

     

    @end

     
  • 在storyboard中
  • 往cell里面增加需要用到的子控件
    屏幕快照 2015 06 04 15 16 42
  • 设置cell的重用标识
    屏幕快照 2015 06 04 15 17 29
  • 设置cell的class为SLQFengCell
    • 屏幕快照 2015 06 04 15 17 51
  • 在控制器中
  • 利用重用标识找到cell
  • 给cell传递模型数据

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

    {

        // 从缓存池中获取数据,如果没有就根据ID创建一个

    static NSString *ID =@"feng";

        SLQFengCell *cell = [tableView dequeueReusableCellWithIdentifier:ID];

        // 传递模型数据

        cell.fengNews = self.news[indexPath.row];

    return cell;

    }

  • SLQFengCell
  • 将storyboard中的子控件连线到类扩展中

    @interfaceSLQFengCell ()

    @property (weak, nonatomic) IBOutletUIImageView *image;

    @property (weak, nonatomic) IBOutletUILabel *titleLable;

    @property (weak, nonatomic) IBOutletUILabel *topicLable;

    @property (weak, nonatomic) IBOutletUILabel *commentLable;

    @end

  • 需要提供一个模型属性,重写模型的set方法,在这个方法中设置模型数据到子控件上

#import <UIKit/UIKit.h>

 

@classSLQFengNews;

 

@interface SLQFengCell : UITableViewCell

@property (strong, nonatomic) SLQFengNews *fengNews; // 模型属性

@end     

  • 重写set方法,对模型对象就行赋值。 

    // 重写set方法

    - (void)setFengNews:(SLQFengNews *)fengNews

    {

        _fengNews = fengNews;

        // 设置图片

        self.image.image = [UIImage imageNamed:fengNews.image];

        // 设置标题

        self.titleLable.text = fengNews.title;

        self.titleLable.font = [UIFontsystemFontOfSize:15];

        // 判断是否是专题

        if (fengNews.isTopic)

        {

            self.topicLable.hidden = NO;

            self.topicLable.text = @"专题";

            self.topicLable.font = [UIFontboldSystemFontOfSize:12];

        }

        else

        {

            self.topicLable.hidden = YES;

        }

        // 设置评论数

        self.commentLable.text = fengNews.comment;

        self.commentLable.font = [UIFontsystemFontOfSize:12];

    }

  • 在模型类中添加对应数量的属性,并写一个对象方法返回模型初始化后的对象 

     

    #import <Foundation/Foundation.h>

    @interface SLQFengNews : NSObject

    /*图片*/

    @property (strong, nonatomic) NSString *image;

    /*标题*/

    @property (strong, nonatomic) NSString *title;

    /*专题*/

    @property (assign, nonatomic,getter = isTopic) BOOL topic;

    /*评论数*/

    @property (strong, nonatomic) NSString *comment;

    + (instancetype)fengNewsWithDict:(NSDictionary *)dict;

    @end

     

    //实现文件

    #import "SLQFengNews.h"

    @implementation SLQFengNews

    // 根据字典返回对象

    + (instancetype)fengNewsWithDict:(NSDictionary *)dict

    {

        SLQFengNews *feng = [[SLQFengNewsalloc] init];

        [feng setValuesForKeysWithDictionary:dict];

        return  feng;

    }

    @end

  • 数据使用plist文件,保存各种信息

         屏幕快照 2015 06 04 15 29 53 

    xib自定义cell

       很多步骤和在storyboard里差不多

  • 1.创建一个继承自UITableViewCell的子类,比如 SLQFengCell (同上)
  • 2.创建一个xib文件(文件名建议跟cell的类名一样),比如SLQFengCell.xib
    • 拖拽一个UITableViewCell出来 
    • 修改cell的class为 SLQFengCell (同上)
    • 设置cell的重用标识  (同上)
    • 往cell中添加需要用到的子控件,实现如下界面
    • 屏幕快照 2015 06 04 16 30 12
  • 3.在控制器中 
    • 利用registerNib...方法注册xib文件
    • 利用重用标识找到cell(如果没有注册xib文件,就需要手动去加载xib文件)
    • 给cell传递模型数据,代码如下,这里对cell的创建方法进行封装
    • - (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
    • {
    •     SLQFengCell *cell = [SLQFengCell cellWithTableView:tableView]; // 这里对cell的创建进行封装
    •     // 传递模型数据
    •     cell.fengNews = self.news[indexPath.row];
    •      return cell;
    • }
  • 4.在SLQFengCell
    • 将xib中的子控件连线到类扩展中(同上)
    • 需要提供一个模型属性,重写模型的set方法,在这个方法中设置模型数据到子控件上(同上)
    • 也可以将创建获得cell的代码封装起来(比如cellWithTableView:方法)
    • 在 SLQFengCell类中定义方法cellWithTableView
      • // 返回cell对象,这里做加载xib的操作

        + (instancetype)cellWithTableView:(UITableView *)tableView

        {

        static NSString *ID = @"feng";

            SLQFengCell *cell = [tableView dequeueReusableCellWithIdentifier:ID];

        if(cell == nil)

            {

                cell = [[[NSBundlemainBundleloadNibNamed:NSStringFromClass([SLQFengCellclass]) owner:niloptions:nillastObject];

            }

        return cell;

        }

    •  代码自定义cell(使用frame)

  • 1.创建一个继承自UITableViewCell的子类,比如XMGDealCell

    • 在initWithStyle:reuseIdentifier:方法中
    • 添加子控件
    • 设置子控件的初始化属性(比如文字颜色、字体)
    • // 初始化控件,添加控件到contentView,并设置相关的属性

      - (instancetype)initWithStyle:(UITableViewCellStyle)style reuseIdentifier:(NSString *)reuseIdentifier

      {

          if (self = [super initWithStyle:style reuseIdentifier:reuseIdentifier])

          {

              UIImageView *image = [[UIImageView alloc] init];

              [self.contentView addSubview:image];

              self.image = image;

              

              UILabel *title  = [[UILabel alloc] init];

              title.numberOfLines = 0;

              [self.contentView addSubview:title];

              self.titleLable = title;

              

              UILabel *topic  = [[UILabel alloc] init];

              topic.textColor = [UIColor redColor];

              topic.font = [UIFont systemFontOfSize:12];

              [self.contentView addSubview:topic];

              self.topicLable = topic;

              

              UILabel *comment  = [[UILabel alloc] init];

              comment.font = [UIFont systemFontOfSize:12];

              comment.textColor = [UIColor blueColor];

              comment.textAlignment = NSTextAlignmentRight;

              [self.contentView addSubview:comment];

              self.commentLable = comment;

          }

          return  self;

      }

    • 在layoutSubviews方法中设置子控件的frame
    • // 设置控件的frame

      - (void)layoutSubviews

      {

          [superlayoutSubviews];

          

          CGFloat contentH = self.contentView.frame.size.height;

          CGFloat contentW = self.contentView.frame.size.width;

          CGFloat margin = 10;

          

          CGFloat imageX = margin;

          CGFloat imageY = margin;

          CGFloat imageW = 50;

          CGFloat imageH = contentH - 2 * imageY;

          self.image.frame = CGRectMake(imageX, imageY, imageW, imageH);

          

          // titleLabel

          CGFloat titleX = CGRectGetMaxX(self.image.frame) + margin;

          CGFloat titleY = imageY;

          CGFloat titleW = contentW - titleX - margin;

          CGFloat titleH = 20;

          self.titleLable.frame = CGRectMake(titleX, titleY, titleW, titleH);

          

          // topicLabel

          CGFloat topicX = titleX;

          CGFloat topicH = 20;

          CGFloat topicY = contentH - margin - topicH;

          CGFloat topicW = 70;

          self.topicLable.frame = CGRectMake(topicX, topicY, topicW, topicH);

          

          // commentLable

          CGFloat commentH = topicH;

          CGFloat commentY = topicY;

          CGFloat commentX = CGRectGetMaxX(self.topicLable.frame) + margin;

          CGFloat commentW = contentW - commentX - margin;

          self.commentLable.frame = CGRectMake(commentX, commentY, commentW, commentH);

      }

    • 需要提供一个模型属性,重写模型的set方法,在这个方法中设置模型数据到子控件 
  • 2.在控制器中
    • 利用registerClass...方法注册SLQFengCell
    • - (void)viewDidLoad {

          [superviewDidLoad];

          [self.tableViewregisterClass:[SLQFengCellclass] forCellReuseIdentifier:@"feng"];

      }

    • 利用重用标识找到cell(如果没有注册类,就需要手动创建cell)
    • 给cell传递模型数据 (同上)
    • 也可以将创建获得cell的代码封装起来(比如cellWithTableView:方法) (同上)

    代码参考

 http://pan.baidu.com/s/1pJ7Oayn

    •    代码自定义cell(使用autolayout)

  • 1.创建一个继承自UITableViewCell的子类,比如XMGDealCell

    • 在initWithStyle:reuseIdentifier:方法中
    • 添加子控件
    • 添加子控件的约束(masonry)(这里添加约束,layoutSubviews不用重写了)
    • // 初始化控件,添加控件到contentView,并设置相关的属性

      - (instancetype)initWithStyle:(UITableViewCellStyle)style reuseIdentifier:(NSString *)reuseIdentifier

      {

          if (self = [super initWithStyle:style reuseIdentifier:reuseIdentifier])

          {

              UIImageView *image = [[UIImageView alloc] init];

              [self.contentView addSubview:image];

              self.image = image;

              

              UILabel *title  = [[UILabel alloc] init];

              title.numberOfLines = 0;

              [self.contentView addSubview:title];

              self.titleLable = title;

              

              UILabel *topic  = [[UILabel alloc] init];

              topic.textColor = [UIColor redColor];

              topic.font = [UIFont systemFontOfSize:12];

              [self.contentView addSubview:topic];

              self.topicLable = topic;

              

              UILabel *comment  = [[UILabel alloc] init];

              comment.font = [UIFont systemFontOfSize:12];

              comment.textColor = [UIColor blueColor];

              comment.textAlignment = NSTextAlignmentRight;

              [self.contentView addSubview:comment];

              self.commentLable = comment;

              

              

              // 添加约束

              CGFloat margin = 10;

              [self.image makeConstraints:^(MASConstraintMaker *make) {

                  make.size.equalTo(50);

                  make.top.left.equalTo(self.contentView.top).offset(margin);

              }];

              

              [self.titleLable makeConstraints:^(MASConstraintMaker *make) {

                  make.left.equalTo(self.image.right).offset(margin);

                  make.top.equalTo(self.image.top);

                  make.right.equalTo(self.contentView.right).offset(-margin);

              }];

              

              [self.topicLable makeConstraints:^(MASConstraintMaker *make) {

                  make.left.equalTo(self.titleLable.left);

                  make.bottom.equalTo(self.image.bottom);

                  make.width.equalTo(100);

              }];

              

              [self.commentLable makeConstraints:^(MASConstraintMaker *make) {

                  make.left.equalTo(self.topicLable.right).offset(margin);

                  make.right.equalTo(self.titleLable.right);

                  make.bottom.equalTo(self.topicLable.bottom);

              }];

              

          }

          return  self;

      }

    • 设置子控件的初始化属性(比如文字颜色、字体)
    • 需要提供一个模型属性,重写模型的set方法,在这个方法中设置模型数据到子控件 
  • 2.在控制器中 (同上)
    • 利用registerClass...方法注册SLQFengCell
    • - (void)viewDidLoad {

          [superviewDidLoad];

          [self.tableViewregisterClass:[SLQFengCellclassforCellReuseIdentifier:@"feng"];

      }

    • 利用重用标识找到cell(如果没有注册类,就需要手动创建cell)
    • 给cell传递模型数据 (同上)
    • 也可以将创建获得cell的代码封装起来(比如cellWithTableView:方法) (同上)

 

 

明天继续非等高的Cell.... 

 2015-06-04

 

 

 

 

 

 

 

 

 

 

    

    

转载于:https://www.cnblogs.com/songliquan/p/4552712.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值