A.需求
1.头部广告
2.自定义cell:含有图片、名称、购买数量、价格
3.使用xib设计自定义cell,自定义cell继承自UITableViewCell
4.尾部“加载更多按钮”,以及其被点击之后的数据加载刷新、动画效果
code source: https://github.com/hellovoidworld/GroupPurchase
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:
—>改进:使用代理设计模式
- 自定义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 @optional
10 - (void) footerRefreshViewClickedFooterRefreshButton:(FooterRefreshView *) footerRefreshView;
11
12 @end
13
14 @interface FooterRefreshView : UIView
15
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)添加页码和自动轮播器