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
  • 相关阅读:
    团队项目——技术规格说明书
    Scrum Meeting 11.1
    Scrum Meeting 10.31
    Scrum Meeting 10.30
    Scrum Meeting 10.29
    Scrum Meeting 10.28
    Scrum Meeting 10.27
    Scrum Meeting 10.26
    团队作业Week5
    Boost C++: 数据结构---tuple
  • 原文地址:https://www.cnblogs.com/fengmin/p/5599719.html
Copyright © 2011-2022 走看看