美文网首页iOS成长路线iOS开发iOS Developer
关于 navigationItem.titleView 滑动缩放

关于 navigationItem.titleView 滑动缩放

作者: 75003cc5006c | 来源:发表于2016-06-29 21:03 被阅读1109次

    最近在仿写 Instagram,它的 Timeline 控制器中, tableView滚动过程中navigationItem.titleView会相应缩放,效果如下:

    ScrollingScaleNavTitleView.gif

    错误做法:

    一开始我是在scrollViewDidScroll(_:)方法中用transform直接对navigationItem.titleView 进行缩放:

    override func scrollViewDidScroll(scrollView: UIScrollView) {
      let factor = offsetY / 20
              if factor < 1 && factor > 0 {
                  navigationItem.titleView?.transform =   CGAffineTransformMakeScale(1 - factor, 1 - factor)
                  rightItemIconView!.transform = CGAffineTransformMakeScale(1 - factor, 1 - factor)
                  navigationItem.titleView!.alpha = 1 - factor
                  navigationItem.rightBarButtonItem?.customView?.alpha = 1 - factor
              } else if factor <= 0 {
                navigationItem.titleView?.transform = CGAffineTransformIdentity
                navigationItem.titleView!.alpha = 1
                rightItemIconView!.transform = CGAffineTransformIdentity
                navigationItem.rightBarButtonItem?.customView?.alpha = 1
    
            } else {
                navigationItem.titleView?.transform = CGAffineTransformIdentity
                navigationItem.titleView!.alpha = 0
                rightItemIconView!.transform = CGAffineTransformIdentity
                navigationItem.rightBarButtonItem?.customView?.alpha = 0
            }
    
            // 下面用到的 tableViewOriginHeight 是 NavBar 的 frame 还没发生变化之前 tableView 的高度
            if offsetY >= 0 && offsetY <= UIConstant.UI_NAV_BAR_HEIGHT {
                navigationController?.navigationBar.frame.origin.y = UIConstant.UI_STATUSBAR_HEIGHT - offsetY
                tableView.frame.origin.y = UIConstant.UI_NAV_BAR_HEIGHT + UIConstant.UI_STATUSBAR_HEIGHT - offsetY
                tableView.frame.size.height = tableViewOriginHeight + offsetY
            } else if offsetY > UIConstant.UI_NAV_BAR_HEIGHT {
                navigationController?.navigationBar.frame.origin.y = UIConstant.UI_STATUSBAR_HEIGHT - UIConstant.UI_NAV_BAR_HEIGHT
                tableView.frame.origin.y = UIConstant.UI_STATUSBAR_HEIGHT
                tableView.frame.size.height = tableViewOriginHeight + UIConstant.UI_NAV_BAR_HEIGHT + UIConstant.UI_STATUSBAR_HEIGHT
            } else {
                navigationController?.navigationBar.frame.origin.y = UIConstant.UI_STATUSBAR_HEIGHT
                tableView.frame.origin.y = UIConstant.UI_NAV_BAR_HEIGHT + UIConstant.UI_STATUSBAR_HEIGHT
                tableView.frame.size.height = tableViewOriginHeight
            }
    
    }
    

    得到的结果是:

    titleView 在缩放之后,没有回复到原来的尺寸,楼主到现在还布吉岛什么原因,有看到这里的大神请指点下,万分感激

    NavTitleViewScaleWrong.gif

    解决办法

    • 把你要缩放的scaleView,用一个普通的UIView装着,作为一个 container,然后把这个 container 设置为 navigationItem.titleView
    func setupTitleView() {
            let titleView = UIView(frame: CGRectMake(0, 0, 100, 40))
            titleImageView = UIImageView(image: FLIconKit.imageOfNavTitleBgImg(size: titleView.frame.size))
            titleImageView!.clipsToBounds = true
            titleImageView!.frame = titleView.bounds
            titleView.addSubview(titleImageView!)
            titleView.backgroundColor = UIColor.blackColor()
            navigationItem.titleView = titleView
        }
    
    
    • scrollViewDidScroll(_:)方法中用transformscaleView 进行缩放:
    override func scrollViewDidScroll(scrollView: UIScrollView) {
            let offsetY = scrollView.contentOffset.y
            let factor = offsetY / 20
            if factor < 1 && factor > 0 {
                titleImageView!.transform = CGAffineTransformMakeScale(1 - factor, 1 - factor)
                rightItemIconView!.transform = CGAffineTransformMakeScale(1 - factor, 1 - factor)
                navigationItem.titleView!.alpha = 1 - factor
                navigationItem.rightBarButtonItem?.customView?.alpha = 1 - factor
            } else if factor <= 0 {
                titleImageView!.transform = CGAffineTransformIdentity
                navigationItem.titleView!.alpha = 1
                rightItemIconView!.transform = CGAffineTransformIdentity
                navigationItem.rightBarButtonItem?.customView?.alpha = 1
    
            } else {
                titleImageView!.transform = CGAffineTransformIdentity
                navigationItem.titleView!.alpha = 0
                rightItemIconView!.transform = CGAffineTransformIdentity
                navigationItem.rightBarButtonItem?.customView?.alpha = 0
            }
            // 下面用到的 tableViewOriginHeight 是 NavBar 的 frame 还没发生变化之前 tableView 的高度
            if offsetY >= 0 && offsetY <= UIConstant.UI_NAV_BAR_HEIGHT {
                navigationController?.navigationBar.frame.origin.y = UIConstant.UI_STATUSBAR_HEIGHT - offsetY
                tableView.frame.origin.y = UIConstant.UI_NAV_BAR_HEIGHT + UIConstant.UI_STATUSBAR_HEIGHT - offsetY
                tableView.frame.size.height = tableViewOriginHeight + offsetY
            } else if offsetY > UIConstant.UI_NAV_BAR_HEIGHT {
                navigationController?.navigationBar.frame.origin.y = UIConstant.UI_STATUSBAR_HEIGHT - UIConstant.UI_NAV_BAR_HEIGHT
                tableView.frame.origin.y = UIConstant.UI_STATUSBAR_HEIGHT
                tableView.frame.size.height = tableViewOriginHeight + UIConstant.UI_NAV_BAR_HEIGHT + UIConstant.UI_STATUSBAR_HEIGHT
            } else {
                navigationController?.navigationBar.frame.origin.y = UIConstant.UI_STATUSBAR_HEIGHT
                tableView.frame.origin.y = UIConstant.UI_NAV_BAR_HEIGHT + UIConstant.UI_STATUSBAR_HEIGHT
                tableView.frame.size.height = tableViewOriginHeight
            }
            
        }
    
    

    最后感谢您的阅读,笔者是 iOS 开发新人(苦逼自学中...),有错误的地方请大家指出,共同进步。

    相关文章

      网友评论

      本文标题:关于 navigationItem.titleView 滑动缩放

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