zoukankan      html  css  js  c++  java
  • 第十二篇、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
  • 相关阅读:
    学习进度
    作业8:单元测试练习
    用户体验设计案例分析
    团队协作一
    需求分析
    结对编程——词频统计 2
    结对编程——词频统计
    个人项目-词频统计
    数组求和
    个人介绍和Github使用流程
  • 原文地址:https://www.cnblogs.com/HJQ2016/p/6102155.html
Copyright © 2011-2022 走看看