美文网首页
iOS关于导航栏的隐藏与渐变

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

作者: 树根曰 | 来源:发表于2017-01-04 21:19 被阅读0次

    项目中需要做滑动导航渐变的效果, 闲来无事,写个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;
        }];
    }
    

    相关文章

      网友评论

          本文标题: iOS关于导航栏的隐藏与渐变

          本文链接:https://www.haomeiwen.com/subject/pjravttx.html