第十二篇、OC_仿淘宝商品详情页的翻页

//
//  GFBProductViewController.m
//  elmsc
//
//  Created by MAC on 2016/11/26.
//  Copyright © 2016年 GFB Network Technology Co.,Ltd. All rights reserved.
//

#import "GFBProductViewController.h"

#define kScreentW [UIScreen mainScreen].bounds.size.width
#define kScreentH [UIScreen mainScreen].bounds.size.height
#define _maxContentOffSet_Y 30
#define offsetY_maxContentOffSet_Y -30

@interface GFBProductViewController ()<UITableViewDelegate,UITableViewDataSource,UIWebViewDelegate>

@property (nonatomic, strong) UITableView *tableView;
@property (nonatomic, strong) UIWebView *webView;
@property (nonatomic, strong) UIView *contentView;
@property (nonatomic, strong) UILabel *mesLabel;
@property (nonatomic, assign) CGFloat startOffsetY;

@end

@implementation GFBProductViewController

- (void)loadContentView
{
    // first view
    [self.contentView addSubview:self.tableView];
    
    // second view
    [self.contentView addSubview:self.webView];
    
    UILabel *hv = self.headLab;
    // headLab
    [self.webView addSubview:hv];
    [self.headLab bringSubviewToFront:self.contentView];
    
    // 开始监听_webView.scrollView的偏移量
    [_webView.scrollView addObserver:self forKeyPath:@"contentOffset" options:NSKeyValueObservingOptionNew|NSKeyValueObservingOptionOld context:nil];
}

- (void)observeValueForKeyPath:(NSString *)keyPath ofObject:(id)object change:(NSDictionary *)change context:(void *)context
{
    if(object == _webView.scrollView && [keyPath isEqualToString:@"contentOffset"])
    {
        NSLog(@"----old:%@----new:%@",change[@"old"],change[@"new"]);
        [self headLabAnimation:[change[@"new"] CGPointValue].y];
    }else
    {
        [super observeValueForKeyPath:keyPath ofObject:object change:change context:context];
    }
    
}

// 头部提示文本动画
- (void)headLabAnimation:(CGFloat)offsetY
{
    _mesLabel.alpha = -offsetY/60;
    _mesLabel.center = CGPointMake(kScreentW/2, -offsetY/2.f);
    // 图标翻转,表示已超过临界值,松手就会返回上页
    if(-offsetY>_maxContentOffSet_Y){
        _mesLabel.textColor = [UIColor redColor];
        _mesLabel.text = @"释放,返回详情";
    }else{
        _mesLabel.textColor = [UIColor redColor];
        _mesLabel.text = @"上拉,返回详情";
    }
}


- (UIView *)contentView
{
    if (! _contentView) {
        
        _contentView = [[UIView alloc]initWithFrame:CGRectMake(0, 0, kScreentW, kScreentH)];
        [self.view addSubview:_contentView];
    }
    return _contentView;
}
- (UILabel *)headLab
{
    if(!_mesLabel){
        _mesLabel = [[UILabel alloc] init];
        _mesLabel.text = @"上拉,返回详情";
        _mesLabel.textAlignment = NSTextAlignmentCenter;
        _mesLabel.font = [UIFont systemFontOfSize:13];
        
    }
    
    _mesLabel.frame = CGRectMake(0, 0, kScreentW, 40.f);
    _mesLabel.alpha = 0.f;
    _mesLabel.textColor = [UIColor redColor];
    
    
    return _mesLabel;
}


- (UITableView *)tableView
{
    if(!_tableView){
        _tableView = [[UITableView alloc] initWithFrame:CGRectMake(0, 0, kScreentW, self.contentView.bounds.size.height) style:UITableViewStylePlain];
        //    _tableView.contentSize = CGSizeMake(PDWidth_mainScreen, 800);
        _tableView.dataSource = self;
        _tableView.delegate = self;
        _tableView.rowHeight = 40.f;
        UILabel *tabFootLab = [[UILabel alloc] initWithFrame:CGRectMake(0, 0, kScreentW, 60)];
        tabFootLab.text = @"继续拖动,查看图文详情";
        tabFootLab.font = [UIFont systemFontOfSize:13];
        tabFootLab.textAlignment = NSTextAlignmentCenter;
        //        tabFootLab.backgroundColor = PDColor_Orange;
        _tableView.tableFooterView = tabFootLab;
    }
    
    return _tableView;
}


- (UIWebView *)webView
{
    if(!_webView){
        _webView = [[UIWebView alloc] initWithFrame:CGRectMake(0, _tableView.contentSize.height, kScreentW, kScreentH)];
        _webView.delegate = self;
        _webView.scrollView.delegate = self;
        [_webView loadRequest:[NSURLRequest requestWithURL:[NSURL URLWithString:@"https://www.baidu.com"]]];
    }
    
    return _webView;
}

- (void)viewDidLoad {
    [super viewDidLoad];
    [self setUpUI];
   
}

#pragma mark---Private Methods 私有方法
- (void) setUpUI
{
     [self loadContentView];
}

#pragma mark-UITableViewDatasource Methods
- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section
{
    return 30;
}

-(UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath{
    static NSString *ID = @"ID";
    UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:ID];
    if (! cell) {
        cell = [[UITableViewCell alloc]initWithStyle:UITableViewCellStyleDefault reuseIdentifier:ID];
    }
    cell.textLabel.text = @"商品测试";
    return cell;
}

#pragma mark--UITableViewDelegate Methods
- (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath
{
    // 测试跳转
    UIViewController *vc = [UIViewController new];
    vc.view.backgroundColor = [UIColor whiteColor];
    [self.navigationController pushViewController:vc animated:YES];
}


// 进入详情的动画
- (void)goToDetailAnimation
{
    [UIView animateWithDuration:0.3 delay:0.0 options:UIViewAnimationOptionLayoutSubviews animations:^{
        _webView.frame = CGRectMake(0, 0, kScreentW, kScreentH);
        _tableView.frame = CGRectMake(0, -self.contentView.bounds.size.height, kScreentW, self.contentView.bounds.size.height);
    } completion:^(BOOL finished) {
        
    }];
}


// 返回第一个界面的动画
- (void)backToFirstPageAnimation
{
    [UIView animateWithDuration:0.3 delay:0.0 options:UIViewAnimationOptionLayoutSubviews animations:^{
        _tableView.frame = CGRectMake(0, 0, kScreentW, self.contentView.bounds.size.height);
        _webView.frame = CGRectMake(0, _tableView.contentSize.height, kScreentW, kScreentH);
        
    } completion:^(BOOL finished) {
        // 滑动回顶部
        [_webView.scrollView setContentOffset:CGPointZero];
        
    }];
}

#pragma mark ---- scrollView delegate

-(void)scrollViewWillBeginDragging:(UIScrollView *)scrollView
{
    self.startOffsetY = scrollView.contentOffset.y;
}

-(void)scrollViewDidEndDragging:(UIScrollView *)scrollView willDecelerate:(BOOL)decelerate
{
    CGFloat offsetY = scrollView.contentOffset.y;
    
    if([scrollView isKindOfClass:[UITableView class]]) // tableView界面上的滚动
    {
        // 能触发翻页的理想值:tableView整体的高度减去屏幕本省的高度
        CGFloat valueNum = _tableView.contentSize.height -kScreentH;
        if ((offsetY - valueNum) > _maxContentOffSet_Y)
        {
            [self goToDetailAnimation]; // 进入图文详情的动画
        }
    }
    
    else // webView页面上的滚动
    {
        NSLog(@"-----webView-------");
        if (_startOffsetY < offsetY) { // 如果webView向上滑动则返回
            return;
        }
        if(offsetY_maxContentOffSet_Y)
        {
            [self backToFirstPageAnimation]; // 返回基本详情界面的动画
        }
    }
}

- (void)dealloc
{
    [self.webView.scrollView removeObserver:self forKeyPath:@"contentOffset" context:nil ];
}
@end

 

posted on 2016-11-25 16:35  久冬不雨  阅读(336)  评论(0编辑  收藏  举报