最近忙着做一个类似微博的项目,要实现头部下拉和尾部上拉以及点击,可以加载数据.这里我就直接用经典的微博Demo来模仿,加载数据方面实现的流程类似.
效果图:
本Demo主要包括以下几个方面:
1.数据模型与Frame模型的建立
@class YYWeiBoModel;
@interface YYWeiBoFrame : NSObject
@property (assign, nonatomic) CGRect textFrame;
@property (assign, nonatomic) CGRect iconFrame;
@property (assign, nonatomic) CGRect nameFrame;
@property (assign, nonatomic) CGRect vipFrame;
@property (assign, nonatomic) CGRect pictureFrame;
@property (strong, nonatomic) YYWeiBoModel *weiBo;
@property (assign, nonatomic) CGFloat cellHeight;
@end
2.自定义cell(特别注意cell的重用问题)
- (void)setWeiBoFrame:(YYWeiBoFrame *)weiBoFrame{
_weiBoFrame = weiBoFrame;
YYWeiBoModel *weiBoModel = weiBoFrame.weiBo;
self.iconView.frame = weiBoFrame.iconFrame;
self.iconView.image = [UIImage imageNamed:weiBoModel.icon];
if (weiBoModel.vip) {
self.nameLbl.textColor = [UIColor redColor];
self.vipView.hidden = NO;
} else {
self.nameLbl.textColor = [UIColor blackColor];
self.vipView.hidden = YES;
}
self.nameLbl.text = weiBoModel.name;
self.nameLbl.frame = weiBoFrame.nameFrame;
self.nameLbl.font = [UIFont systemFontOfSize:17];
self.nameLbl.numberOfLines = 0;
self.vipView.frame = weiBoFrame.vipFrame;
self.textLbl.text = weiBoModel.text;
self.textLbl.frame = weiBoFrame.textFrame;
self.textLbl.numberOfLines = 0;
self.textLbl.font = [UIFont systemFontOfSize:15];
if (weiBoModel.picture) {
self.picView.frame = weiBoFrame.pictureFrame;
self.picView.image = [UIImage imageNamed:weiBoModel.picture];
}else {
self.picView.image = nil;
}
}
3.自定义table的头视图和尾视图
@implementation YYHeaderView
+ (instancetype)headerView{
YYHeaderView *header = [[YYHeaderView alloc]initWithFrame:CGRectMake(0, 0, 320, 60)];
header.backgroundColor = [UIColor whiteColor];
UIActivityIndicatorView *act = [[UIActivityIndicatorView alloc]initWithActivityIndicatorStyle:UIActivityIndicatorViewStyleWhite];
act.frame = CGRectMake(0, 0, 37, 37);
act.color = [UIColor lightGrayColor];
[header addSubview:act];
header.act = act;
act.hidden = NO;
act.center = header.center;
header.hidden = YES;
return header;
}
@end
+ (instancetype)footerView{
YYFooterView *footerView = [[YYFooterView alloc]initWithFrame:CGRectMake(0, 0, 320, 50)];
footerView.backgroundColor = [UIColor orangeColor];
UIButton *btn = [[UIButton alloc]initWithFrame:CGRectMake(0, 10, 320, 30)];
footerView.btn = btn;
[btn setTitle:@"加载更多" forState:UIControlStateNormal];
[btn setTitleColor:[UIColor blackColor] forState:UIControlStateNormal];
btn.contentHorizontalAlignment = UIControlContentHorizontalAlignmentCenter;
[btn addTarget:footerView action:@selector(clickLoadMoreBtn:) forControlEvents:UIControlEventTouchUpInside];
[footerView addSubview:btn];
UIActivityIndicatorView *act = [[UIActivityIndicatorView alloc]initWithFrame:CGRectMake(90 , 10, 37, 37)];
act.hidden = YES;
[footerView addSubview:act];
footerView.act = act;
UILabel *titleLbl = [[UILabel alloc]initWithFrame:CGRectMake(130, 10, 100, 30)];
titleLbl.text = @"正在加载中..";
titleLbl.textAlignment = NSTextAlignmentLeft;
titleLbl.textColor = [UIColor blueColor];
titleLbl.hidden = YES;
[footerView addSubview:titleLbl];
footerView.titleLbl = titleLbl;
return footerView;
}
4.头部加载数据的实现
- (void)headerViewBeginLoadMoreData{
YYWeiBoModel *weibo = [YYWeiBoModel new];
weibo.text = @"奥利奥原味";
weibo.icon = @"7735164184.jpeg";
weibo.picture = @"926680527.jpeg";
weibo.name = @"内涵高手";
weibo.vip = 1;
YYWeiBoFrame *weiboFrame = [YYWeiBoFrame new];
weiboFrame.weiBo = weibo;
[self.weiBoArray insertObject:weiboFrame atIndex:0];
NSIndexPath *indexPath = [NSIndexPath indexPathForRow:0 inSection:0];
[self.tableView insertRowsAtIndexPaths:@[indexPath] withRowAnimation:UITableViewRowAnimationNone];
[self.tableView scrollToRowAtIndexPath:indexPath atScrollPosition:UITableViewScrollPositionBottom animated:YES];
}
5.尾部加载数据的实现
这里加载的数据 跟头部的一样,偷个懒....
- (void)loadDataWithWeiBo{
YYWeiBoModel *weibo = [YYWeiBoModel new];
weibo.text = @"奥利奥原味";
weibo.icon = @"7735164184.jpeg";
weibo.picture = @"926680527.jpeg";
weibo.name = @"内涵高手";
weibo.vip = 1;
YYWeiBoFrame *weiboFrame = [YYWeiBoFrame new];
weiboFrame.weiBo = weibo;
[self.weiBoArray addObject:weiboFrame];
NSIndexPath *indexPath = [NSIndexPath indexPathForRow:self.weiBoArray.count - 1 inSection:0];
[self.tableView insertRowsAtIndexPaths:@[indexPath] withRowAnimation:UITableViewRowAnimationNone];
[self.tableView scrollToRowAtIndexPath:indexPath atScrollPosition:UITableViewScrollPositionBottom animated:YES];
}
收藏
淘帖
踩
