mark
#import "ViewController.h"
@interface ViewController ()<UITableViewDelegate , UITableViewDataSource , UIScrollViewDelegate >
@property (nonatomic , strong)UITableView *tableView;
@property (nonatomic, strong) UITableView *downTableView;
@property (nonatomic , strong)UILabel *headLab;
@end
@implementation ViewController
- (void)viewDidLoad {
[super viewDidLoad];
self.title = @"么么哒";
self.view.backgroundColor = [UIColor whiteColor];
[self createView];
}
- (void)createView{
_tableView = [[UITableView alloc]initWithFrame:CGRectMake(0, 64, self.view.bounds.size.width, self.view.bounds.size.height - 64 + 60) style:UITableViewStylePlain];
_tableView.delegate = self;
_tableView.dataSource = self;
/*
直接用属性来设置行高，这种写法简便
*/
_tableView.rowHeight = self.view.bounds.size.height;
/*
*/
[self.view addSubview:_tableView];
/*
以注册cell的方式也是为了写法简便
*/
[_tableView registerClass:[UITableViewCell class] forCellReuseIdentifier:@"cell"];
UILabel *footLabel = [[UILabel alloc]initWithFrame:CGRectMake(0, 0, self.view.frame.size.width, 60)];
footLabel.text = @"继续拖动，查看图文详情";
footLabel.font = [UIFont systemFontOfSize:13];
footLabel.textAlignment = NSTextAlignmentCenter;
_tableView.tableFooterView = footLabel;
//注意:懒加载时,只有用 self 才能调其 getter 方法
[self.view addSubview:self.downTableView];
_headLab = [[UILabel alloc] init];
_headLab.text = @"上拉，返回详情";
_headLab.textAlignment = NSTextAlignmentCenter;
_headLab.font = [UIFont systemFontOfSize:13];
_headLab.frame = CGRectMake(0, 0, self.view.frame.size.width, 40.f);
/*
一开始就设置透明了
*/
_headLab.alpha = 0.f;
_headLab.textColor = [UIColor orangeColor];
[_downTableView addSubview:_headLab];
[ _downTableView addObserver:self forKeyPath:@"contentOffset" options:NSKeyValueObservingOptionNew|NSKeyValueObservingOptionOld context:nil];
}
//懒加载 webView 增加流畅度,没有add的这一步
- (UITableView *)downTableView{
/*注意,这里不用 self 防止循环引用
另外注意的是tableView的contentSize喔，
*/
if (! _downTableView){
//说实在直接拿self.view的尺寸，比写拿屏幕的写法简单
_downTableView = [[UITableView alloc]initWithFrame:CGRectMake(0, _tableView.contentSize.height, self.view.frame.size.width, self.view.frame.size.height) style:UITableViewStylePlain];
_downTableView.delegate = self;
_downTableView.dataSource = self;
_downTableView.rowHeight = 60.f;
[_downTableView registerClass:[UITableViewCell class] forCellReuseIdentifier:@"downTableViewCell"];
}
return _downTableView;
}
- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section{
if(tableView == _tableView){
return 1;
}else{
return 20;
}
}
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath{
if (tableView == _tableView){
static NSString *indetifier = @"cell";
UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:indetifier];
cell.textLabel.text = @"Amydom";
return cell;
}else{
static NSString *indetifier = @"downTableViewCell";
UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:indetifier];
cell.textLabel.text = @"memeda";
return cell;
}
}
- (void)scrollViewDidScroll:(UIScrollView *)scrollView{
CGFloat offsetY = scrollView.contentOffset.y;
NSLog(@"____any_alloffsetY____%f",offsetY);
if([scrollView isKindOfClass:[UITableView class]]) // tableView界面上的滚动
{
NSLog(@"____any_tableviewoffsetY____%f",offsetY);
}else{
NSLog(@"____any_webviewoffsetY____%f",offsetY);
}
}
//监测 scroll 的偏移量
-(void)scrollViewDidEndDragging:(UIScrollView *)scrollView willDecelerate:(BOOL)decelerate
{
CGFloat offsetY = scrollView.contentOffset.y;
NSLog(@"____drag_alloffsetY____%f",offsetY);
//因为这里所有的scrollView的相关类都能监测，所以要区分特定的view
if(scrollView == _tableView ) // tableView界面上的滚动
{
NSLog(@"____drag_tableviewoffsetY____%f",offsetY);
// 能触发翻页的理想值:tableView内容的高度减去屏幕本省的高度
CGFloat valueNum = _tableView.contentSize.height - self.view.frame.size.height;
if ((offsetY - valueNum) > 40)
{
[self goToDetailAnimation]; // 进入图文详情的动画
}
}
else // webView页面上的滚动
{
NSLog(@"____drag_webviewoffsetY____%f",offsetY);
if(offsetY < 0 && -offsetY > 40)
{
[self backToFirstPageAnimation]; // 返回基本详情界面的动画
}
}
}
/*
实现的原理都是动画加调y值
*/
// 进入详情的动画
- (void)goToDetailAnimation
{
[UIView animateWithDuration:0.3 delay:0.0 options:UIViewAnimationOptionLayoutSubviews animations:^{
_downTableView.frame = CGRectMake(0, 64, self.view.frame.size.width, self.view.frame.size.height);
_tableView.frame = CGRectMake(0, -self.view.frame.size.height , self.view.frame.size.width, self.view.frame.size.height);
} completion:^(BOOL finished) {
}];
}
// 返回第一个界面的动画
- (void)backToFirstPageAnimation
{
[UIView animateWithDuration:0.3 delay:0.0 options:UIViewAnimationOptionLayoutSubviews animations:^{
_tableView.frame = CGRectMake(0, 0, self.view.frame.size.width, self.view.bounds.size.height);
_downTableView.frame = CGRectMake(0, _tableView.contentSize.height, self.view.frame.size.width, self.view.frame.size.height);
} completion:^(BOOL finished) {
}];
}
// KVO观察
- (void)observeValueForKeyPath:(NSString *)keyPath ofObject:(id)object change:(NSDictionary<NSKeyValueChangeKey,id> *)change context:(void *)context{
if(object == _downTableView && [keyPath isEqualToString:@"contentOffset"])
{
[self headLabAnimation:[change[@"new"] CGPointValue].y];
}else
{
[super observeValueForKeyPath:keyPath ofObject:object change:change context:context];
}
}
// 头部提示文本动画
- (void)headLabAnimation:(CGFloat)offsetY
{
/*
动态变透明度
*/
_headLab.alpha = -offsetY/60;
/*
如果不想动态变其位置，可以把这一句给注释掉了
*/
_headLab.center = CGPointMake(self.view.frame.size.width/2, -offsetY/2.f);
_headLab.backgroundColor = [UIColor greenColor];
// 图标翻转，表示已超过临界值，松手就会返回上页
if(-offsetY > 40){
_headLab.textColor = [UIColor redColor];
_headLab.text = @"释放，返回详情";
}else{
_headLab.textColor = [UIColor blackColor];
_headLab.text = @"上拉，返回详情";
}
}
