ios 如何更改 UITabBar 的顶部边框？

How can I change the top border of my UITabBar?

提问by TIMEX

I'd like the UITabBar to have a top border of width 5.0. The border should be yellow color. I don't want any left/bottom/right borders.

我希望 UITabBar 的顶部边框宽度为 5.0。边框应为黄色。我不想要任何左/下/右边框。

The Tab Bar border should be flat (no shadows or anything like that).

标签栏边框应该是平坦的（没有阴影或类似的东西）。

How can I remove shadow (image) line?

如何去除阴影（图像）线？

回答by Dharmesh Kheni

You can hide the top border this way in your FirstViewController.swift:

您可以在 FirstViewController.swift 中以这种方式隐藏顶部边框：

self.tabBarController!.tabBar.layer.borderWidth = 0.50
self.tabBarController!.tabBar.layer.borderColor = UIColor.clear.cgColor
self.tabBarController?.tabBar.clipsToBounds = true

And result will be:

结果将是：

Before:

前：

After:

后：

Hope it helps.

希望能帮助到你。

EDIT:

编辑：

You can set background image this way:

您可以通过以下方式设置背景图像：

UITabBar.appearance().backgroundImage = UIImage(named: "yourImageWithTopYellowBorder.png")

回答by iurii

This is the complete solution, compiled of different SO answers, that worked for me (Swift 3):

这是完整的解决方案，由不同的 SO 答案编译，对我有用（Swift 3）：

// The tabBar top border is done using the `shadowImage` and `backgroundImage` properties.
// We need to override those properties to set the custom top border.
// Setting the `backgroundImage` to an empty image to remove the default border.
tabBar.backgroundImage = UIImage()
// The `shadowImage` property is the one that we will use to set the custom top border.
// We will create the `UIImage` of 1x5 points size filled with the red color and assign it to the `shadowImage` property.
// This image then will get repeated and create the red top border of 5 points width.

// A helper function that creates an image of the given size filled with the given color.
// http://stackoverflow.com/a/39604716/1300959
func getImageWithColor(color: UIColor, size: CGSize) -> UIImage
{
    let rect = CGRect(origin: CGPoint(x: 0, y: 0), size: CGSize(width: size.width, height: size.height))
    UIGraphicsBeginImageContextWithOptions(size, false, 0)
    color.setFill()
    UIRectFill(rect)
    let image: UIImage = UIGraphicsGetImageFromCurrentImageContext()!
    UIGraphicsEndImageContext()
    return image
}

// Setting the `shadowImage` property to the `UIImage` 1x5 red.
tabBar.shadowImage = getImageWithColor(color: UIColor.red, size: CGSize(width: 1.0, height: 5.0))

回答by James

If you want to completely remove tab bar, put this in your AppDelegate:

如果你想完全删除标签栏，把它放在你的 AppDelegate 中：

UITabBar.appearance().shadowImage = UIImage()
UITabBar.appearance().backgroundImage = UIImage()

回答by Udaya Sri

This is how I get it done. I added a subview on top of the UITabBar.

这就是我完成它的方式。我在 UITabBar 顶部添加了一个子视图。

var lineView = UIView(frame: CGRect(x: 0, y: 0, width:tabBarController.tabBar.frame.size.width, height: 1))
lineView.backgroundColor = UIColor.yellow
tabBarController.tabBar.addSubview(lineView)

回答by ABHILASH P

    UIView *borderLine = [[UIView alloc] initWithFrame:CGRectMake(0, 0, screenWidth, 5.0)];
    borderLine.backgroundColor = [UIColor yellowColor];  
    [self.tabBarController.tabBar addSubview:borderLine];

This is the way to add border to a UITabBarwhich I follow. It works cool.

这是向UITabBar我遵循的a 添加边框的方法。它很酷。

回答by A.J. Hernandez

SWIFT 3

斯威夫特 3

I needed border colors (and line colors and weights) to match other elements in my app, so this worked for me in my custom UITabBarController's viewDidLoad:

我需要边框颜色（以及线条颜色和粗细）来匹配我的应用程序中的其他元素，所以这在我的自定义 UITabBarController 的 viewDidLoad 中对我有用：

tabBar.layer.borderWidth = 0.3
tabBar.layer.borderColor = UIColor(red:0.0/255.0, green:0.0/255.0, blue:0.0/255.0, alpha:0.2).cgColor
tabBar.clipsToBounds = true

回答by Knight Fighter

Swift 4.2

斯威夫特 4.2

self.tabBarController!.tabBar.layer.borderWidth = 0.50
self.tabBarController!.tabBar.layer.borderColor = UIColor.clear.cgColor
self.tabBarController?.tabBar.clipsToBounds = true

Just change border color as you want.

只需根据需要更改边框颜色。

回答by Ben Dodson

There is a property named shadowImagethat was introduced in iOS 6. You can change this to change the top border. For example, you can use a 1x1px image with a single colour to change the top border to that colour:

shadowImageiOS 6 中引入了一个名为的属性。您可以更改它以更改顶部边框。例如，您可以使用具有单一颜色的 1x1px 图像将顶部边框更改为该颜色：

UITabBar.appearance().shadowImage = UIImage(named: "TabBarShadow")

You can also set it as just UIImage()to completely remove the top border.

您也可以将其设置为仅UIImage()完全删除顶部边框。

UITabBar.appearance().shadowImage = UIImage()

To answer your question of a 5px border, this can be done by using a 1x5px image. There does not appear to be a limit on the size of the image and it will just repeat (so you could have a dotted line for example by having a 4x5px image where the first 2x5px are black and the next 2x5px are transparent). Note that if you use this, it is outside the bounds of the UITabBar so content will go behind the image unless you change the view bounds.

要回答您关于 5px 边框的问题，可以使用 1x5px 图像来完成。图像的大小似乎没有限制，它只会重复（所以你可以有一条虚线，例如有一个 4x5px 的图像，其中第一个 2x5px 是黑色的，接下来的 2x5px 是透明的）。请注意，如果您使用它，它将在 UITabBar 的边界之外，因此除非您更改视图边界，否则内容将位于图像后面。

回答by Krunal

It's a shadow image (property) of tabbar. Try following solutions and see.

它是标签栏的阴影图像（属性）。尝试以下解决方案并查看。

** Swift **

** 斯威夫特 **

//Remove shadow image by assigning nil value.
UITabBar.appearance().shadowImage = nil

// or 

// Assing UIImage instance without image reference
UITabBar.appearance().shadowImage = UIImage()

** Objective-C **

** 目标 C **

//Remove shadow image by assigning nil value.
[[UITabBar appearance] setShadowImage: nil];

// or 

// Assing UIImage instance without image reference
[[UITabBar appearance] setShadowImage: [[UIImage alloc] init]];

Here is apple guideline for shadowImage.

这是shadowImage 的苹果指南。

@available(iOS 6.0, *)
open var shadowImage: UIImage?

Default is nil. When non-nil, a custom shadow image to show instead of the default shadow image. For a custom shadow to be shown, a custom background image must also be set with -setBackgroundImage: (if the default background image is used, the default shadow image will be used).

默认为零。当非零时，显示自定义阴影图像而不是默认阴影图像。要显示自定义阴影，还必须使用 -setBackgroundImage: 设置自定义背景图像（如果使用默认背景图像，则将使用默认阴影图像）。

回答by evya

Just set the UITabBar backgroundImage and shadowImage to be clear color:

只需将 UITabBar backgroundImage 和 shadowImage 设置为清晰的颜色：

tabBar.shadowImage = UIImage.init(color: UIColor.clear)
tabBar.backgroundImage = UIImage.init(color: UIColor.clear)