CODEWITHSUNDEEP
iphoneobjective-ciosipad
adit
adit

Reputation: 33644

how can I remove the top border on UIToolBar

I have set my UIToolBar tint color to some value, and there is this border line that I see in which I want to remove:

enter image description here

How do I remove this black border>

Upvotes: 61

Views: 27599

Answers (11)

coolcool1994
coolcool1994

Reputation: 3804

[[UIToolbar appearance] setBackgroundImage:[[UIImage alloc] init] forToolbarPosition:UIBarPositionBottom barMetrics:UIBarMetricsDefault];

[[UIToolbar appearance] setShadowImage:[[UIImage alloc] init] forToolbarPosition:UIBarPositionBottom];

[UIToolbar appearance].barTintColor = [UIColor ...];```

Upvotes: 0

damo
damo

Reputation: 939

navigationController?.toolbar.barTintColor = .white

navigationController?.toolbar.setShadowImage(UIImage(), forToolbarPosition: .any)

enter image description here

Upvotes: 12

Keenan
Keenan

Reputation: 376

Correct answer is the one by totalitarian...FYI. https://stackoverflow.com/a/14448645/627299

My response is still below for reference.

Here's what I did with my WHITE background toolbar...

whiteToolBar.layer.borderWidth = 1;
whiteToolBar.layer.borderColor = [[UIColor whiteColor] CGColor];

Perhaps you could do the same thing with your color instead.

Upvotes: 21

alionthego
alionthego

Reputation: 9743

create a 1 pixel x 1 pixel clear image and call it clearPixel.png

toolbar.setShadowImage(UIImage(named: "clearPixel.png"), forToolbarPosition: UIBarPosition.any)

Upvotes: 3

Alex
Alex

Reputation: 567

The clipsToBounds technique clips the UIToolBar's shadow as well as the background view. On an iPhone X, that means the background no longer reaches outside the safe area.

Incorrect UIToolBar on iPhone X

The solution below uses a mask to clip only the top of the UITabBar. The mask is rendered in a UIToolBar subclass, and the mask frame is kept updated in an override of layoutSubviews.

class Toolbar: UIToolbar {

    fileprivate let maskLayer: CALayer = {
        let layer = CALayer()
        layer.backgroundColor = UIColor.black.cgColor
        return layer
    }()

    override init(frame: CGRect) {
        super.init(frame: frame)
        initialize()
    }

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

    fileprivate func initialize() {
        layer.mask = maskLayer
        // Customize toolbar here
    }

    override func layoutSubviews() {
        super.layoutSubviews()
        // height is an arbitrary number larger than the distance from the top of the UIToolbar to the bottom of the screen
        maskLayer.frame = CGRect(x: -10, y: 0, width: frame.width + 20, height: 500)
    }

}

Correct UIToolBar on iPhone X

Upvotes: 2

Cherpak Evgeny
Cherpak Evgeny

Reputation: 2770

setShadowImage to [UIImage new]

Upvotes: 17

GazB
GazB

Reputation: 3695

I got a bit confused with these answers but I was missing the point that you were using an Outlet so just to be clear here is the swift code I used to hide the border:

import UIKit

class ViewController: UIViewController {

    //MARK Outlets
    @IBOutlet weak var ToolBar: UIToolbar!

    //MARK View Functions
    override func viewDidLoad() {
        super.viewDidLoad()
        // Do any additional setup after loading the view, typically from a nib.

        // Hide the bottom toolbar's top border
        ToolBar.clipsToBounds = true
    }
}

I had dragged a toolbar to the bottom of a view for this and it's not the top nav bar some other questions refer to.

Upvotes: 1

Ravi Mudaliar - Seffcon
Ravi Mudaliar - Seffcon

Reputation: 507

toolbar1.clipsToBounds = YES;

Worked for me incase someone is still trying with Navigational bar

Upvotes: 49

natbro
natbro

Reputation: 1038

this doesn't work consistently on iOS versions, doesn't seem to work on iOS7. i answered this in another question: https://stackoverflow.com/a/19893602/452082 and you can modify that solution to just remove the background shadow (and leave your toolbar.backgroundColor whatever color you like)

Upvotes: 2

totalitarian
totalitarian

Reputation: 3666

You can do like this:

self.navigationController.toolbar.clipsToBounds = YES;

Upvotes: 146

DrMickeyLauer
DrMickeyLauer

Reputation: 4674

Setting the style to UIBarStyleBlackTranslucent did it for me (iOS 6)

Upvotes: 4

Related Questions