ios - 如何像 AppStore 应用程序详细信息页面一样为导航栏设置动画？

Question

类似 AppStore 的导航栏

首先是透明导航栏，当应用向上滚动时，导航栏变得可见。

请检查此问题添加的 Gif 文件中的效果

标签： iosswiftapp-storenavigationbar

Answer 1

首先设置导航栏透明如下

// Makes the navigation bar transparent
navigationController?.navigationBar.setBackgroundImage(UIImage(), for: UIBarMetrics.default)
navigationController?.navigationBar.shadowImage = UIImage()
navigationController?.navigationBar.isTranslucent = true
navigationController?.view.backgroundColor = UIColor.clear

现在使用该UIScrollViewDelegate方法scrollViewDidScroll来检测滚动视图的百分比并基于该方法更改 alpha

  // MARK: UIScrollViewDelegate

    override func scrollViewDidScroll(_ scrollView: UIScrollView) {
        super.scrollViewDidScroll(scrollView)

        let maximumVerticalOffset = scrollView.contentSize.height - scrollView.frame.height
        let currentVerticalOffset = scrollView.contentOffset.y
        let percentageVerticalOffset = currentVerticalOffset / maximumVerticalOffset

        let color = UIColor.init(red: 255/255.0, green: 255/255.0, blue: 255/255.0, alpha: percentageVerticalOffset)
        navigationController?.navigationBar.backgroundColor = color
    }

希望对你有帮助