iOS关于导航栏的隐藏与渐变

项目中需要做滑动导航渐变的效果, 闲来无事,写个demo 分享一下.
具体实现有兴趣的童鞋可以下载源码看看, 注释写的很清楚;

下载源码 点这里

一、滑动渐变

渐变

大概思路是, 隐藏导航栏, 自定义一个视图 View, 覆盖在原导航栏的位置, 然后在-(void)scrollViewDidScroll:(UIScrollView *)scrollView;这个方法中,根据scrollView.contentOffset.y滑动的幅度,来改变导航的背景的透明度和控件的颜色;

#pragma mark -  重点的地方在这里 滚动时候进行计算
-(void)scrollViewDidScroll:(UIScrollView *)scrollView {
    
    CGFloat offsetY = scrollView.contentOffset.y;
    
    if (offsetY <= 170) {
        self.navView.headBackImgView.alpha = offsetY/170;
        self.navView.left_bt_Img = @"tab_home";
        self.navView.right_bt_Img = @"tab_mine";
        self.navView.color = kColor(0, 0, 0, offsetY/170);
        
        [[UIApplication sharedApplication] setStatusBarStyle:UIStatusBarStyleLightContent animated:YES];
    }else{
        self.navView.headBackImgView.alpha = 1;
        
        self.navView.left_bt_Img = @"tab_home_active";
        self.navView.right_bt_Img = @"tab_mine_active";
        self.navView.color = kColor(255, 81, 81, 1);
        [[UIApplication sharedApplication] setStatusBarStyle:UIStatusBarStyleDefault animated:YES];
    }
    if (offsetY < 0) {
        CGRect rect = _backgroundImgV.frame;
        rect.size.height = _backImgHeight-offsetY;
        rect.size.width = _backImgWidth* (_backImgHeight-offsetY)/_backImgHeight;
        rect.origin.x =  -(rect.size.width-_backImgWidth)/2;
        rect.origin.y = 0;
        _backgroundImgV.frame = rect;
    }else{
        CGRect rect = _backgroundImgV.frame;
        rect.size.height = _backImgHeight;
        rect.size.width = _backImgWidth;
        rect.origin.x = 0;
        rect.origin.y = -offsetY;
        _backgroundImgV.frame = rect;
        
    }
    
    //    if (scrollView.contentOffset.y <= 0) {
    //        self.NavView.headBackView.alpha = ((240+scrollView.contentOffset.y)/140);
    //        _NavView.left_bt_Image = kMenuBTimg;
    //        _NavView.right_bt_Image = kSearchBTimg;
    //        _NavView.lab_alpha = _NavView.headBackView.alpha;
    //
    //        if (self.NavView.headBackView.alpha >= 1) {
    //
    //            _NavView.lab_alpha = 1;
    //            _NavView.headBackView.alpha = 1;
    //            _NavView.left_bt_Image = kMenuBTimg;
    //            _NavView.right_bt_Image = kSearchBTimg;
    //        }
    //    }
    
}

二、滑动隐藏导航栏 navigationBar 和 标签栏 tabBar
同样,在-(void)scrollViewDidScroll:(UIScrollView *)scrollView;方法中实现

#pragma mark UIScrollViewDelegate
- (void)scrollViewWillBeginDragging:(UIScrollView *)scrollView {
    [UIView animateWithDuration:1 animations:^{
        
        self.tabBarController.tabBar.transform = CGAffineTransformMakeTranslation(0, 49);
        
        [UIView animateWithDuration:5 animations:^{
            
            self.navigationController.navigationBar.alpha = 0;
        }];
    }];
}
- (void)scrollViewDidEndDragging:(UIScrollView *)scrollView willDecelerate:(BOOL)decelerate {
    [UIView animateWithDuration:1 animations:^{
        
        self.tabBarController.tabBar.transform = CGAffineTransformIdentity;
        self.navigationController.navigationBar.alpha = 1;
    }];
}