//
// 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/;
_mesLabel.center = CGPointMake(kScreentW/, -offsetY/.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(, , 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:]; } _mesLabel.frame = CGRectMake(, , kScreentW, .f);
_mesLabel.alpha = .f;
_mesLabel.textColor = [UIColor redColor]; return _mesLabel;
} - (UITableView *)tableView
{
if(!_tableView){
_tableView = [[UITableView alloc] initWithFrame:CGRectMake(, , kScreentW, self.contentView.bounds.size.height) style:UITableViewStylePlain];
// _tableView.contentSize = CGSizeMake(PDWidth_mainScreen, 800);
_tableView.dataSource = self;
_tableView.delegate = self;
_tableView.rowHeight = .f;
UILabel *tabFootLab = [[UILabel alloc] initWithFrame:CGRectMake(, , kScreentW, )];
tabFootLab.text = @"继续拖动,查看图文详情";
tabFootLab.font = [UIFont systemFontOfSize:];
tabFootLab.textAlignment = NSTextAlignmentCenter;
// tabFootLab.backgroundColor = PDColor_Orange;
_tableView.tableFooterView = tabFootLab;
} return _tableView;
} - (UIWebView *)webView
{
if(!_webView){
_webView = [[UIWebView alloc] initWithFrame:CGRectMake(, _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 ;
} -(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(, , kScreentW, kScreentH);
_tableView.frame = CGRectMake(, -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(, , kScreentW, self.contentView.bounds.size.height);
_webView.frame = CGRectMake(, _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

第十二篇、OC_仿淘宝商品详情页的翻页的更多相关文章

  1. Vue实现仿淘宝商品详情属性选择的功能

    Vue实现仿淘宝商品详情属性选择的功能 先看下效果图:(同个属性内部单选,属性与属性之间可以多选) 主要实现过程: 所使用到的数据类型是(一个大数组里面嵌套了另一个数组)具体格式如下:   attrA ...

  2. 仿淘宝商品详情页上拉弹出新ViewController

    新项目就要开始做了,里面有购物那块,就试着先把淘宝商品详情页的效果做了一下. 1.需求 1.第一次上拉时,A视图拉到一定距离将视图B从底部弹出,A视图也向上 2.显示B视图时下拉时,有刷新效果,之后将 ...

  3. iOS app url scheme跳转到淘宝商品详情页 唤醒app

    最近涉及的一个业务,在app内的一个广告,点击打开webView,加载的是一个淘宝商品详情页,效果是打开该webView自动跳转至淘宝对应的页面,同时在自己的app仍然加载页面,点击评论等也同样能跳转 ...

  4. Android自己定义控件实战——仿淘宝商品浏览界面

    转载请声明出处http://blog.csdn.net/zhongkejingwang/article/details/38656929 用手机淘宝浏览商品详情时,商品图片是放在后面的,在第一个Scr ...

  5. Android自定义控件实战——仿淘宝商品浏览界面

    转载请声明出处http://blog.csdn.net/zhongkejingwang/article/details/38656929 用手机淘宝浏览商品详情时,商品图片是放在后面的,在第一个Scr ...

  6. Android开发案例 - 淘宝商品详情

    所有电商APP的商品详情页面几乎都是和淘宝的一模一样(见下图): 采用上下分页的模式 商品基本参数 & 选购参数在上页展示 商品图文详情等其他信息放在下页展示 知识要点 垂直方向的ViewPa ...

  7. Android开发案例 - 淘宝商品详情【转】

    http://erehmi.cnblogs.com/ 所有电商APP的商品详情页面几乎都是和淘宝的一模一样(见下图): 采用上下分页的模式 商品基本参数 & 选购参数在上页展示 商品图文详情等 ...

  8. android仿京东、淘宝商品详情页上拉查看详情

    话不多说,直接上干货,基本就是一个scrollview中嵌套两个scrollview或者webview;关键点事处理好子scrollview和父scrollview的触摸.滑动事件已达到想要的效果.大 ...

  9. 仿京东淘宝商品详情页属性选择js效果

    在网上找了好久发现都不符合要求就自己摸索写了一个,用到了linq.js这个linq to js 扩展,不然用纯JS遍历json查询要死人啊 demo:http://123.207.28.46:8086 ...

随机推荐

  1. PAT甲级——1093 Count PAT's (逻辑类型的题目)

    本文同步发布在CSDN:https://blog.csdn.net/weixin_44385565/article/details/93389073 1093 Count PAT's (25 分)   ...

  2. xcode定期清理记录一下

    此文章仅适用于适用于使用Xcode的开发者. 长期不清理Xcode中的一些文件你会发现自己的mac硬盘越来越小,而且是这个其他占了绝大部分的硬盘,在网上搜索了很多办法都没找到如何清理这些其他 后来来来 ...

  3. Jmeter分布式(转)jmeter -n -t baidu.jmx -l result.jtl -R 172.16.20.146:1099

    1.准备2台在同一个局域网内的机器,一台作为master主控机,一台作为slave 执行机 master机器ip:172.16.20.134 slave机器ip:172.16.20.146 2.在2台 ...

  4. Flask虚拟环境连接mysql出现1366的解决方案

    报错信息 Warning: (1366, "Incorrect string value: '\xD6\xD0\xB9\xFA\xB1\xEA...' for column 'VARIABL ...

  5. CentOS6.5安装MySQL5.7(也适合其他版本安装)

     1.查看是否已经安装过mysql或其依赖,若已装过要先将其删除,否则第4步使用yum安装时会报错: 方法一:yum list installed | grep mysql 方法二:rpm -qa | ...

  6. Python+Selenium----使用HTMLTestRunner.py生成自动化测试报告1(使用IDLE)

    1.说明 自动化测试报告是一个很重要的测试数据,网上看了一下,使用HTMLTestRunner.py生成自动化测试报告使用的比较多,但是呢,小白刚刚入手,不太懂,看了很多博客,终于生成了一个测试报告, ...

  7. 红黑树(Red-Black Tree),B树,B-树,B+树,B*树

    (一)红黑树(Red-Black Tree) http://www.cnblogs.com/skywang12345/p/3245399.html#a1 它一种特殊的二叉查找树.红黑树的每个节点上都有 ...

  8. LCS(Longest Common Subsequence)

    http://blog.csdn.net/zztfj/article/details/6157429 LCS(Longest Common Subsequence) 就是求两个字符串最长公共子串的问题 ...

  9. Unity www动态加载网上图片

    一. 1.新建一个UGUI的Button,删掉它的Image组件,添加一个Raw Image组件.如图: 由于删除了Image组件,所以画圈的位置是空的,运行后会自动把Raw Image添加到那里. ...

  10. 【Unity3D】Unity3D中Material与ShareMaterial引用的区别

    我们在使用Unity引擎的时候,有时候需要去修改某个物体上的Material,在Unity的Renderer类里,提供了两个方法接口供我们使用. Renderer.material和Renderer. ...