公司的app做交互的同学竟然做了一个和支付宝首页类似的页面，真是心累，本着追求技术的客观态度，我便模仿下支付宝做一个页面。
个人博客 :https://www.linit.space

好多人求源码，公司的源码当然不会给啦。但是你们把你们的demo发我邮箱，我可以帮忙修改下。邮箱 001@linit.space 觉得我修改的辛苦记得给打赏啊T T

一. 支付宝页面设计

zhifubaotujie2.jpeg

zhifubaotujie1.jpeg

==可以在图中发现有以下的难点==

1. 手势需要传递，滑动上半部分结果是滑动下半部分。
2. UI需要变动，向上滑动的时候，顶部部分收缩。

==解决思路==

WechatIMG8.jpeg

1. 接受手势信息由一个屏幕大小的UIScrollView(A)接受。响应者为下半部分为一个UIScrollView（B）。这样即可实现点击屏幕任何位置，滑动的部分均为UIScrollView（B）。
2. 问题来了，既然只有下面的UIScrollView移动，如何做到上面的也一起动呢。这里用一个傻一点的办法，就是监听下面UIScrollView（B）contentOffset的变化，然后控制上部分内容的显示。
3. 这里有个坑，往上移动UIScrollView（B）上半部分内容逐渐变小，可是UIScrollView（B）的frame不变，也就是说UIScrollView（B）还是在这个位置，但是看起来明明像是UIScrollView（B）也移动上去一样。于是，可以将UIScrollView（B）的clipsToBounds设置为NO。这样，超出frame 的部分仍然可以显示。
4. 现在看起来的效果是满足了，但是大家肯定都会发现挪出frame的部分不能响应事件啊！这时候可以重写系统自带的
   - (UIView *)hitTest:(CGPoint)point withEvent:(UIEvent *)event方法来解决这个问题。

==关键代码==

1. 解决手势传递问题

 //移除scrollViewA原有手势操作
NSMutableArray *list = [NSMutableArray arrayWithArray:scrollViewA.gestureRecognizers];
    for (UIGestureRecognizer *gestureRecognizer in list) {
        [scrollViewA removeGestureRecognizer:gestureRecognizer];
}

//将scrollViewB的手势操作加到scrollViewA中
for (UIGestureRecognizer *gestureRecognizer in scrollViewB.gestureRecognizers) {
        [scrollViewA addGestureRecognizer:gestureRecognizer];
}

2.解决头部view和下面的scrollViewB一起滚动的问题，直接使用kvo 监听contentOffset变化就完事。
3.超出scrollViewB部分可以点击

- (UIView *)hitTest:(CGPoint)point withEvent:(UIEvent *)event
{
    for (UIView *subview in [self.subviews reverseObjectEnumerator]) {
        
        CGPoint convertedPoint = [subview convertPoint:point fromView:self];
        UIView *hitTestView = [subview hitTest:convertedPoint withEvent:event];
        if (hitTestView) {
            return hitTestView;
        }
    }
    return [super hitTest:point withEvent:event];
}

二. 咱公司的app 掌医2.0的 挂号主页

演示

2016-09-21 17_42_35.gif

==内容更加复杂 因为下部分不只一个 scrollViewB 不过大同小异，关键部分还是以上代码，代码就不贴了也不外传，同事自行看svn==