2

I'm trying to change the color of the top border on a UIToolbar.

I tried:

layer.borderWidth = 1
layer.borderColor = UIColor(r: 250, g: 250, b: 250).CGColor

That didn't work.

Suggestions? Thank you

Walker
  • 1,127
  • 15
  • 39

6 Answers6

5

I've done it using this code:

class ViewController: UIViewController {
  
  @IBOutlet weak var toolBar: UIToolbar!
  
  override func viewDidLoad() {
    super.viewDidLoad()
    
    // the layer with the width of the device
    // and height of 0.5 px
    let topBorder = CALayer()
    topBorder.frame = CGRectMake(0, 0, view.frame.size.width, 0.5)
    topBorder.backgroundColor = UIColor.redColor().CGColor
    
    // adding the layer to the top
    // of the toolBar
    toolBar.layer.addSublayer(topBorder)
  }
}

Result:

enter image description here

Source: https://blog.adamcooke.io/set-the-top-border-colour-of-a-uinavbar-d9035c6b4fdb#.f37molpsj

Community
  • 1
  • 1
Wilson
  • 9,006
  • 3
  • 42
  • 46
1

If you don't like its color, and as it isn't possible to change it, fastest hack is to get rid of that hairline - It is not actually a border, it's a shadow.

toolbar.clipsToBounds = true

OR:

toolbar.layer.shadowOpacity = 0

Or maybe you are able to change its shadow image:

UITabbar.appearance().shadowImage = UIImage.colorForNavBar(.red)
pedrouan
  • 12,762
  • 3
  • 58
  • 74
  • Is this a joke? Of course I added it to the view my problem isn't not seeing the toolbar it's simply getting the top border to be a specific color. This code doesn't compile. @pedrouan – Walker Sep 09 '16 at 19:31
  • Could you be more clear @Walker? And the code is just an example, as I may not properly understand your question. Anyway, it's written in Swift 3. – pedrouan Sep 09 '16 at 19:37
  • The toolbar control has a border on the top of it. It's a gray line that's kind of thick. I would like to modify this border on top of the toolbar to be a color that I want. Thanks man – Walker Sep 09 '16 at 19:38
  • is there any way not to add a view to the top that is 1 pixel wide with the color I want? – Walker Sep 09 '16 at 20:05
  • It is possible to loop UITabbar's/UIToolbar's subviews - but if using this way, you could also change that color when passing that view in the loop. – pedrouan Sep 09 '16 at 20:14
  • i think i can set the shadow image for the toolbar. Would I be able to make a 1px uiimage of the color i want and set it? How can i make that image – Walker Sep 09 '16 at 20:18
  • I found a solution with an extension for this http://stackoverflow.com/a/33675160/661022 – pedrouan Sep 09 '16 at 20:23
  • I updated my answer few times. Hope I helped at least a little bit. – pedrouan Sep 09 '16 at 20:25
  • clipToBounds = true was the only thing that worked for me. Thanks! – Omid Ariyan Aug 01 '18 at 22:57
0

UIColor works between 0 and 1 so for example:

If you want 250 as your red value you need to do 250/255. I had this same problem and found that just by adding the /255 after the value the color works as expected.

The /255 creates the value in the proper range. You could also do the division and put in the decimal approximation.

If you need any more help or clarification please let me know.

user3734410
  • 13
  • 5
  • I have an extension that does that for me. Sorry, I should have clarified. Thank you for your time! – Walker Sep 09 '16 at 18:52
0

You need to set RGB colours divided by 255.0 to get a 0 to 1 colour.

For example:

layer.borderWidth = 1
layer.borderColor = UIColor(r: 250/255, g: 250/255, b: 250/255).CGColor
Tal Zion
  • 6,308
  • 3
  • 50
  • 73
  • The person under you suggested that and I mentioned that I have an extension of UIColor and that's why I'm not dividing because the extension does it for me. Thank you – Walker Sep 09 '16 at 20:03
0

You can use:

- (void)setToolbarLineWith:(UIColor *)color
{
    for(UIView *v in self.navigationController.toolbar.subviews){
        if([NSStringFromClass([v class]) isEqualToString:@"_UIBarBackground"])
        {
            for(UIView *w in v.subviews){
                if([NSStringFromClass([w class]) isEqualToString:@"UIImageView"])
                {
                    [w setBackgroundColor:color];
                }
            }
        }
    }
}

and run with:

[self setToolbarLineWith:[UIColor redColor]];
Stefan
  • 190
  • 1
  • 11
0

That's actually a shadow image, so just create some 1 pixel image with necessary color and use 

[toolbar setShadowImage:<your image> forToolbarPosition:UIBarPositionAny];
Krizai
  • 610
  • 10
  • 18