首页 > 代码库 > [iOS基础控件 - 6.6] 展示团购数据 自定义TableViewCell
[iOS基础控件 - 6.6] 展示团购数据 自定义TableViewCell
A.需求
1.头部广告
2.自定义cell：含有图片、名称、购买数量、价格
3.使用xib设计自定义cell，自定义cell继承自UITableViewCell
4.尾部“加载更多按钮”，以及其被点击之后的数据加载刷新、动画效果
B.实现
1.使用MVC
M：团购Model
V：总View、cell的View（包含类和界面）
C：ViewController
2.分类管理代码文件
3.尾部footerView “加载更多"功能
1 // 设置尾部控件2 self.tableView.tableFooterView = footerView;
footerView设置的按钮自动宽度为tableView宽度，只能设置高度；x和y也不能设置。
要自定义按钮的的，使用xib进行自定义footerView嵌套
（1）使用button, 设计一个“加载更多”按钮
（2）加上等待图标
—>如何利用xib封装一个View：
- 新建xib描述view的结构
- 新建一个继承UIView的类（取决于xib根对象的class）
- 新建类名，和xib保持一致
@interface FooterRefreshView : UIView - 设置xib控件的class，连线
- 在自定义class中定义xib的加载类方法（屏蔽xib加载过程）
1 /** 初始化方法 */ 2 + (instancetype) footerRrefreshViewWithDelegate:(id<FooterRefreshViewDelegate>) delegate { 3 FooterRefreshView *footerRefreshView = [[[NSBundle mainBundle] loadNibNamed:@"FooterRefreshView" owner:nil options:nil] lastObject]; 4 5 if (nil != delegate) { 6 footerRefreshView.delegate = delegate; 7 } 8 9 return footerRefreshView;10 }
- class持有controller引用，发送消息给controller刷新数据
下面使用代理模式
—>改进：使用代理设计模式
- 自定义view的class持有controller的引用，耦合性强 —>使用代理
- 协议命名规范：控件类名+Delegate
- 代理方法普遍都是@optional
- 代理对象遵守代理协议，实现代理协议里面的方法
- 在需要的地方调用代理方法，给代理发送消息
1 FooterRefreshView.h 2 #import <UIKit/UIKit.h> 3 4 @class FooterRefreshView; 5 6 // 定义delegate协议 7 @protocol FooterRefreshViewDelegate <NSObject> 8 9 @optional10 - (void) footerRefreshViewClickedFooterRefreshButton:(FooterRefreshView *) footerRefreshView;11 12 @end13 14 @interface FooterRefreshView : UIView15 16 + (instancetype) footerRrefreshViewWithDelegate:(id<FooterRefreshViewDelegate>) delegate;17 18 @end
4.xib中创建的view初始化完毕之后不会调用class中的init方法，而是调用awakeFromNib方法
FooterRefreshView.h
1 // xib控件的初始化调用方法2 - (void)awakeFromNib {3 self.loadingImage.hidden = YES;4 }
5.分割线
其实就是高度为1的UIView
6.自定义cell
（1）.自定义cell的子控件都要放到contentView里面
默认就是会放到contentView中
（2）创建继承自UITableViewCell的类
@interface GroupPurchaseCell : UITableViewCell
（3）创建xib文件描述cell的界面
（4）指定view的class，对控件进行连线
（5）在cell类中，定义一个model成员，用来存储这个cell的数据
1 /** 自定初始化的类方法，传入model数据 */2 + (instancetype) groupPurchaseCellWithGroupPurchase:(GroupPurchase *) groupPurchase;
（6）创建初始化方法，使用model数据作为传入参数
1 /** 自定初始化的类方法，传入model数据 */ 2 + (instancetype) groupPurchaseCellWithGroupPurchase:(GroupPurchase *) groupPurchase { 3 GroupPurchaseCell *cell = [[[NSBundle mainBundle] loadNibNamed:@"GroupPurchaseCell" owner:nil options:nil] lastObject]; 4 5 // 加载model中的数据，初始化界面 6 cell.groupPurchase = groupPurchase; 7 8 return cell; 9 }10 11 /** 没有model数据的空cell */12 + (instancetype)groupPurchaseCell {13 return [self groupPurchaseCellWithGroupPurchase:nil];14 }
（7）传入model数据的同时，加载数据到view上面
1 /** 加载Model数据，初始化界面 */ 2 - (void) setGroupPurchase:(GroupPurchase *) groupPurchase { 3 if (nil != groupPurchase) { 4 self.titleLabel.text = groupPurchase.title; 5 self.iconImageView.image = [UIImage imageNamed:groupPurchase.icon]; 6 self.priceLabel.text = [NSString stringWithFormat:@"￥%@", groupPurchase.price]; 7 self.buyCountLabel.text = [NSString stringWithFormat:@"%@人已经购买", groupPurchase.buyCount]; 8 } 9 10 _groupPurchase = groupPurchase;11 }
7.头部广告
其实就是之前的滚动广告放到 self.tableView.tableHeaderView
（1）设计界面
（2）创建class加载图片数据
（3）传入图片名的数组作为成员
1 // 广告组2 @property(nonatomic, strong) NSArray *ads;
（4）加载图片
1 /** 设置ads */ 2 - (void) setAds:(NSArray *)ads { 3 if (nil != ads) { 4 CGFloat adImageWidth = AD_VIEW_WIDTH; 5 CGFloat adImageHeight = AD_VIEW_HEIGHT; 6 CGFloat adImageY = 0; 7 8 for (int i=0; i<ads.count; i++) { 9 // 计算当前图片的水平坐标10 CGFloat adImageX = i * adImageWidth;11 12 UIImageView *adImageView = [[UIImageView alloc] initWithFrame:CGRectMake(adImageX, adImageY, adImageWidth, adImageHeight)];13 adImageView.image = [UIImage imageNamed:[NSString stringWithFormat:@"%@", ads[i]]];14 15 [self.scrollView addSubview:adImageView];16 }17 18 // 设置滚动19 self.scrollView.contentSize = CGSizeMake(ads.count * AD_VIEW_WIDTH, 0);20 self.scrollView.scrollEnabled = YES;21 }22 23 _ads = ads;24 }
（5）在主controller，设置好图片数据，创建头部控件加到头部位置
1 //设置头部广告2 HeaderAdView *adView = [self genAdView]; // 手动拼装广告图片数据3 self.tableView.tableHeaderView = adView;
（6）添加页码和自动轮播器
[iOS基础控件 - 6.6] 展示团购数据 自定义TableViewCell
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。