zoukankan      html  css  js  c++  java
  • 简单的代码实现的炫酷navigationbar

    动图

    技术原理:

    当你下拉scrollview的时候,会监听scrollview的contentOffset来调整头部背景图片的位置,通过CGAffineTransformMakeTranslation和CGAffineTransformScale实现头像的缩小。

    具体代码实现:

    -(void)willMoveToSuperview:(UIView *)newSuperview
    {
        [self.scrollView addObserver:self forKeyPath:@"contentOffset" options:(NSKeyValueObservingOptionNew) context:Nil];
        self.scrollView.contentInset = UIEdgeInsetsMake(self.frame.size.height, 0 ,0, 0);
        self.scrollView.scrollIndicatorInsets = self.scrollView.contentInset;
    }
    
    
    
    -(void)observeValueForKeyPath:(NSString *)keyPath ofObject:(id)object change:(NSDictionary *)change context:(void *)context
    {
        CGPoint newOffset = [change[@"new"] CGPointValue];
        [self updateSubViewsWithScrollOffset:newOffset];
    }
    
    -(void)updateSubViewsWithScrollOffset:(CGPoint)newOffset
    {
    
        float destinaOffset = -64;
        float startChangeOffset = -self.scrollView.contentInset.top;
        newOffset = CGPointMake(newOffset.x, newOffset.y<startChangeOffset?startChangeOffset:(newOffset.y>destinaOffset?destinaOffset:newOffset.y));
    
        float subviewOffset = self.frame.size.height-40;
        float newY = -newOffset.y-self.scrollView.contentInset.top;
        float d = destinaOffset-startChangeOffset;
        float alpha = 1-(newOffset.y-startChangeOffset)/d;
        float imageReduce = 1-(newOffset.y-startChangeOffset)/(d*2);
        self.subTitleLabel.alpha = alpha;
        self.titleLabel.alpha = alpha;
        self.frame = CGRectMake(0, newY, self.frame.size.width, self.frame.size.height);
        self.backImageView.frame = CGRectMake(0, -0.5*self.frame.size.height+(1.5*self.frame.size.height-64)*(1-alpha), self.backImageView.frame.size.width, self.backImageView.frame.size.height);
    
        CGAffineTransform t = CGAffineTransformMakeTranslation(0,(subviewOffset-0.35*self.frame.size.height)*(1-alpha));
        _headerImageView.transform = CGAffineTransformScale(t,
                                                            imageReduce, imageReduce);
    
        self.titleLabel.frame = CGRectMake(0, 0.6*self.frame.size.height+(subviewOffset-0.45*self.frame.size.height)*(1-alpha), self.frame.size.width, self.frame.size.height*0.2);
        self.subTitleLabel.frame = CGRectMake(0, 0.75*self.frame.size.height+(subviewOffset-0.45*self.frame.size.height)*(1-alpha), self.frame.size.width, self.frame.size.height*0.1);
    }

    Demo分享:

    GitHub:https://github.com/ianisme/CoolNavi
  • 相关阅读:
    bzoj3033
    noip2016 Day1T3
    编译php的问题
    JavaScript <script>标签的位置、延迟脚本(defer属性)与 异步脚本(async属性)
    连接远程数据库时出现 SSH: expected key exchange group packet from server / 2003
    laravel中使用的PDF扩展包——laravel-dompdf和laravel-snappy
    laravel 生成 key
    windows下apache配置虚拟主机
    composer设置忽略版本匹配
    laravel 服务容器实例——深入理解IoC模式
  • 原文地址:https://www.cnblogs.com/fengmin/p/5599719.html
Copyright © 2011-2022 走看看