Question

根据我的理解，更改顶部边框的颜色的唯一方法是设置背景图像（320x49，顶部有像素线）。在我看来，这是唯一的方法（如果我错了，请纠正我。）

有没有办法没有使用图像文件？例如，有人通过从代码创建UIImage来帮助我更改NavigationBar底部边框：

UINavigationBar.appearance().shadowImage = UIImage.colorForNavBar(UIColor.redColor())

extension UIImage {   
    class func colorForNavBar(color: UIColor) -> UIImage {
        let rect = CGRectMake(0.0, 0.0, 1.0, 1.0)
        UIGraphicsBeginImageContext(rect.size)
        let context = UIGraphicsGetCurrentContext()

        CGContextSetFillColorWithColor(context, color.CGColor)
        CGContextFillRect(context, rect)

        let image = UIGraphicsGetImageFromCurrentImageContext()
        UIGraphicsEndImageContext()

        return image
    }
}

这个解决方案实际上效果很好;它改变了我的底部边框的颜色。

我试图将它应用到TabBar，但没有任何改变。

UITabBar.appearance().shadowImage = UIImage.colorForNavBar(.redColor())

Answer 1

你几乎回答了自己的问题。您可以使用UITabBar对UINavigationBar执行相同的操作。如果要更改阴影图像（即＆＃34;顶部边框＆＃34;），则必须更改背景图像。直接从Apple：

标签栏的自定义阴影图像。如果选项卡栏还没有自定义背景图像，则忽略此属性。要以编程方式设置此属性，请使用shadowImage属性。

在你自己的问题中，你似乎意识到了这一点：

更改顶部边框颜色的唯一方法是设置背景图像（320x49，顶部有像素线）

除了背景图片不是顶部有一条线。您只需将背景图像设置为任何内容，然后就可以将阴影图像设置为您的首选项。

如果你打开简单的标签应用程序＆＃34; Xcode中的模板，您会发现添加这两行代码（以及您的UIImage扩展代码）确实有效：

// White background with red border on top
UITabBar.appearance().backgroundImage = UIImage.colorForNavBar(.whiteColor())
UITabBar.appearance().shadowImage = UIImage.colorForNavBar(.redColor())

Answer 2

这是Swift 3解决方案：

extension UIImage {
    class func colorForNavBar(color: UIColor) -> UIImage {
        let rect = CGRect(x: 0.0, y: 0.0, width: 1.0, height: 1.0)
        //    Or if you need a thinner border :
        //    let rect = CGRect(x: 0.0, y: 0.0, width: 1.0, height: 0.5)
        UIGraphicsBeginImageContext(rect.size)
        let context = UIGraphicsGetCurrentContext()

        context!.setFillColor(color.cgColor)
        context!.fill(rect)

        let image = UIGraphicsGetImageFromCurrentImageContext()
        UIGraphicsEndImageContext()

        return image!
    }
}

与UITabBarController的viewDidLoad中的代码一起使用

UITabBar.appearance().backgroundImage = UIImage.colorForNavBar(color: .white)
UITabBar.appearance().shadowImage = UIImage.colorForNavBar(color: .red)

Answer 3

您需要为UINavigationBar.appearance().backgroundImage提供不同的图片。

例如：

UINavigationBar.appearance().backgroundImage = UIImage.colorForNavBar(.blackColor())
UINavigationBar.appearance().shadowImage = UIImage.colorForNavBar(.redColor())

Answer 4

通常情况下，其他答案都是正确的 - 您必须同时设置背景图像和阴影图像。但是，这样做会导致酒吧降低其半透明度（模糊）;即使您设置了透明图像，该条也将是透明的，而不是半透明的。

我们也有类似的需求，但我们想保留酒吧的半透明度。我们不是设置阴影图像，而是将条形图子类化，然后使用我们想要的颜色放置发际线子视图。当条形图显示其子视图时，我们将细线的框架设置为条形图的宽度，并精确设置像素。

请参阅my GitHub demo project。

以下是结果的屏幕截图：

在项目中包含我的子视图后，只需使用以下行设置颜色：

if let tabBar = tabBarController?.tabBar as? ColoredHairlineTabBar {
    tabBar.hairlineColor = ... //Your color
}

Answer 5

如何简单地继承UITabBar并在layoutSubviews中向视图添加新的子图层。

Swift示例：

override func layoutSubviews() {
    super.layoutSubviews()

    let topBorder = CALayer()

    let borderHeight: CGFloat = 2

    topBorder.borderWidth = borderHeight
    topBorder.borderColor = UIColor.redColor().CGColor
    topBorder.frame = CGRect(x: 0, y: -1, width: self.frame.width, height: borderHeight)

    self.layer.addSublayer(topBorder)
}

Answer 6

您无需扩展即可创建一定大小的图像，UIImage为此提供了一个非常好的构造器。

为防止丢失半透明的模糊，可以设置条形颜色而不是背景图像。您还可以使用屏幕比例尺来确保边框是一个像素，就像原始边框是一样：

    let hairlineHeight = CGFloat(1) / UIScreen.main.scale
    tabBar.barTintColor = .white
    tabBar.shadowImage = UIImage(color: .black, size: CGSize(width: 1, height: hairlineHeight))

如何通过编程方式创建UIImage来更改UITabBar顶部边框的颜色？

6 个答案: