Remove UITabBar line not working

Question

I would like to remove the separator of UITabBar. I have set custom background image for UITabBar. With the following code the separator is above UITabBar image.

class myTabBarController: UITabBarController {

    override func viewDidLoad() {
                UITabBar.appearance().backgroundImage = UIImage(named: "secretTab.png")

}

I have added following code but it removed not only line but also custom image.(shadow)

    class myTabBarController: UITabBarController {

        override func viewDidLoad() {
            self.tabBar.clipsToBounds = true
            self.tabBarController?.tabBar.autoresizesSubviews = false
            UITabBar.appearance().backgroundImage = UIImage(named: "secretTab.png")
}

Possible duplicate of [Remove UITabbar upper border line](https://stackoverflow.com/questions/32645674/remove-uitabbar-upper-border-line) — nathan, Aug 24 '17 at 15:10
@ nathan I have already saw that post. It did not help me :/ — risa8, Aug 24 '17 at 15:13
How come ? Was the line removed ? There are quite a lot of answers for this issue in SO: https://google.com/search?hl=en&q=UITabBar%20remove%20hairline+site%3Astackoverflow.com — nathan, Aug 24 '17 at 15:15
I tried "barStyle" "borderWidth" and other things too, it just didnt work. — risa8, Aug 24 '17 at 15:20
https://stackoverflow.com/questions/37338288/ios-getting-desired-shadow-above-uitabbar — Neel Sarwal, Aug 24 '17 at 15:25
I wrote the code and shadow is shown but the line is not removed. and if i try to remove line using "self.tabBar.clipsToBounds = true", it removed shadow too... — risa8, Aug 24 '17 at 15:41

score 2 · Accepted Answer · answered Aug 24 '17 at 18:58

This certainly looks like a bug. Prior to iOS 10, it worked fine: set a .backgroundImage and then set UITabBar.appearance().shadowImage = nil (or empty image or transparent image).

With iOS 10, however...

IF your background image is taller than the tab bar, the "shadow image" gets placed at the top of the background image; is 0.5-pts tall, and it will be visible.

IF your background image is NOT taller than the tab bar, the "shadow image" is no longer visible.

And... if you compare the structures between iOS 9 and 10 via Debug Hierarchy, you can see the "shadow image" is a subview of a different view.

So... you can get rid of it, but with caveats...

A. use a background image shorter than the tab bar.

B. clip to bounds (but then you lose the top of your background image).

C. use a fully-transparent background... set both .backgroundImage and .shadowImage to nil or UIImage(). Of course, then you need to find some other way to display the image you want as the background of the tab bar.

or... but not recommended...

D. on viewDidAppear, step through the tabBar subviews, find the "shadow image", and hide it. This will work - but it could fail if / when Apple changes the structure of the tab bar (and, I suppose, is technically "non-documented", so...):

override func viewDidAppear(_ animated: Bool) {
    super.viewDidAppear(animated)

    var b = false
    for v in tabBar.subviews {
        for sv in v.subviews {
            if sv.frame.size.height == 0.5 && sv is UIImageView {
                // found it
                b = true
                sv.isHidden = true
                break
            }
        }
        if b { break }
    }

}

I solved it by changing the height of tabbar and removing the line. Thanks for your help! — risa8, Aug 25 '17 at 02:59

score 1 · Answer 2 · answered Aug 21 '18 at 06:35

This worked for me

override func viewDidAppear(_ animated: Bool) {
        super.viewDidAppear(animated)
        self.tabBar.shadowImage = nil
        var isFound = false
        for allViews in tabBar.subviews {
            for backgroundViews in allViews.subviews {
                if(backgroundViews is UIImageView)
                {
                    let imageView = backgroundViews as! UIImageView
                    if imageView.image == nil {
                        // found it
                        isFound = true
                        imageView.isHidden = true
                        break
                    }
                }

            }
            if isFound { break }
        }

    }

score 0 · Answer 3 · answered Aug 24 '17 at 16:59

0

Add this

  UITabBar.appearance().shadowImage = UIImage()

answered Aug 24 '17 at 16:59

HMHero

2,333
19
11

Krunal · Answer 4 · 2017-08-24T17:37:26.573

Try this,

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

// or 

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

Here is apple guideline for 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).

score -1 · Answer 5 · answered Dec 05 '18 at 08:49

-1

I solved a similar problem by adjusting the background image height to 49pt.

answered Dec 05 '18 at 08:49

victor

1
2

Remove UITabBar line not working

5 Answers5