如何更改UITabBar的顶部边框?

时间:2015-09-01 05:10:39

标签: ios swift uitabbarcontroller uitabbar

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

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

如何删除阴影(图像)线?

11 个答案:

答案 0 :(得分:30)

你可以在FirstViewController.swift中这样做:

self.tabBarController!.tabBar.layer.borderWidth = 0.50
self.tabBarController!.tabBar.layer.borderColor = UIColor.clearColor().CGColor
self.tabBarController?.tabBar.clipsToBounds = true

结果将是:

在:

enter image description here

后:

enter image description here

希望它有所帮助。

修改

您可以这样设置背景图片:

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

答案 1 :(得分:5)

这是完整的解决方案,汇集了不同的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))

答案 2 :(得分:4)

如果您想完全删除标签栏,请将其放入AppDelegate:

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

答案 3 :(得分:3)

SWIFT 3

我需要边框颜色(以及线条颜色和粗细)来匹配我的应用中的其他元素,所以这在我的自定义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

答案 4 :(得分:2)

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

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

答案 5 :(得分:2)

Swift 4.2

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

只需更改边框颜色即可。

答案 6 :(得分:1)

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

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

答案 7 :(得分:0)

在iOS 6中引入了一个名为shadowImage的属性。您可以更改此属性以更改顶部边框。例如,您可以使用单色的1x1px图像将顶部边框更改为该颜色:

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

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

UITabBar.appearance().shadowImage = UIImage()

要回答5px边框的问题,可以使用1x5px图像来完成。对图像的大小似乎没有限制,它只会重复(所以你可以有一条虚线,例如通过一个4x5px图像,其中前2x5px是黑色而下一个2x5px是透明的)。请注意,如果您使用它,它超出了UITabBar的范围,因此除非您更改视图边界,否则内容将位于图像后面。

答案 8 :(得分:0)

这是tabbar的阴影图像(属性)。请尝试以下解决方案并查看。

** 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 **

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

// or 

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


以下是shadowImage的Apple指南。

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

默认为零。当非零时,显示自定义阴影图像而不是   默认阴影图像。要显示自定义阴影,请自定义   必须使用-setBackgroundImage设置背景图像:(如果是   使用默认背景图像,默认阴影图像将是   使用)。

答案 9 :(得分:0)

这就是我的完成方式。我在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)

答案 10 :(得分:0)

首先创建如下的UIImage扩展

with span_days as (
  select car, 
         arrival,
         coalesce(
           departure,
           lead(departure) over (partition by car 
                                     order by coalesce(arrival, departure))
         ) as departure 
    from car_arrive_depart
)
select car, arrival, departure, 
       departure - arrival as time_diff
  from span_days
 where arrival is not null;

在您的视图控制器中,添加以下代码。

extension UIImage {
    func createSelectionIndicator(color: UIColor, size: CGSize, lineWidth: CGFloat) -> UIImage {
        UIGraphicsBeginImageContextWithOptions(size, false, 0)
        color.setFill()
        UIRectFill(CGRect(x: 0, y: 0, width: size.width, height: lineWidth))
        let image = UIGraphicsGetImageFromCurrentImageContext()!
        UIGraphicsEndImageContext()
        return image
    }
}