Question

如何使导航栏既半透明又具有色调，如下图所示：

我还希望它保持半透明导航栏的默认模糊效果（所以我不希望它看起来像图片，因为我也想要模糊效果。）我觉得这应该很容易，但是我花了一个小时寻找解决方案，没有任何方法可以按我想要的方式工作。此外，我更喜欢Interface Builder解决方案，但如果没有swift也不错。

Answer 1

换色部分来from here。我刚刚添加了模糊部分from here。我不知道它是否是模糊的最佳解决方案，但它确实有效。您将需要子类化导航栏，但没有什么痛苦。如果模糊视图略微下降alpha，你会发现它更好。你必须稍微玩这个。

extension UIColor {
    func toImage() -> UIImage? {
        return toImageWithSize(size: CGSize(width: 1, height: 1))
    }
    func toImageWithSize(size: CGSize) -> UIImage? {
        UIGraphicsBeginImageContext(size)

        if let ctx = UIGraphicsGetCurrentContext() {
            let rectangle = CGRect(x: 0, y: 0, width: size.width, height: size.height)
            ctx.setFillColor(self.cgColor)
            ctx.addRect(rectangle)
            ctx.drawPath(using: .fill)
            let colorImage = UIGraphicsGetImageFromCurrentImageContext()
            UIGraphicsEndImageContext()
            return colorImage
        } else {
            return nil
        }
    }
}

extension UIImage {
    func imageWithAlpha(alpha: CGFloat) -> UIImage? {
        UIGraphicsBeginImageContextWithOptions(size, false, scale)
        draw(at: CGPoint.zero, blendMode: .normal, alpha: alpha)
        let newImage = UIGraphicsGetImageFromCurrentImageContext()
        UIGraphicsEndImageContext()
        return newImage
    }
}

class CustomNavBar: UINavigationBar {

    required init?(coder aDecoder: NSCoder) {
        super.init(coder: aDecoder)

        setBackgroundImage(UIColor.blue.toImage()?.imageWithAlpha(alpha: 0.5), for: .default)
        addBlurEffect()
    }

    func addBlurEffect() {
        let visualEffectView = UIVisualEffectView(effect: UIBlurEffect(style: .light))
        var frame = bounds
        frame.origin.y -= 20
        frame.size.height += 20
        visualEffectView.frame = frame
        visualEffectView.autoresizingMask = [.flexibleWidth, .flexibleHeight]
        visualEffectView.alpha = 0.9
        insertSubview(visualEffectView, at: 0)
        sendSubview(toBack: visualEffectView)
    }
}

Answer 2

只需设置导航栏的颜色，然后设置透明度。

navigationController?.navigationBar.barTintColor = UIColor.green
navigationController?.navigationBar.alpha = 0.5

应该这样做。

Answer 3

只需选择＆＃34;导航栏＆＃34;接口构建器中的UINavigationController（不是其他ViewControllers的NavigationItem）并更改＆＃34; barTintColor＆＃34;

如何使导航栏变为彩色和半透明（iOS）？

3 个答案: