Custom IOS UITabbarController with hidden top gray line - ios

I'd like to make a view with a unique color with uitabbar i.e I don't want to separate the view into the UITabbar and the rest, so I've created a custom UITabbar programmatically with custom color. The UITabbar and the "rest of the view" have the same color but there is a gray line on top of the UITabbar that separates the to parts. How can I hide that?
this is an example image, I want to delete that dark line:
https://picasaweb.google.com/felixdl/20Giugno2012#5756005463317234882
SOLUTION
Thank you! this works perfectly! the line I've added is:
[[UITabBar appearance] setBackgroundImage:[UIImage imageNamed:#"myImage.jpg"]];
I've never used the "appearance" tag before

If you're building for iOS 5, you can set the background as an image which would eliminate the grey line you're talking about.
[uiTabBarController setBackgroundImage:[UIImage imageNames:#"my_background.png"]];
This does require you to have an image which matches your programitically created color though.
In iOS4, you can override the drawRect function (which is significantly more complicated, but I'd be happy to answer if you're making a pre iOS 5 app)

Try this,
** 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]];
** Swift **
//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 document 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).

Related

iOS UISearchBar remove faint lines in Swift 3 [duplicate]

I am creating an iOS 7 app in which I'd like to have a SearchBar right bellow the NavigationBar, and I wanted them both to look like a single piece. Therefore I need to tint them with the same color (done already) and remove that hairline at the bottom of the NavigationBar and at the top of the SearchBar. How can I achieve that?
Officially, this is only possible by setting the shadowImage of the navigationBar to an empty image. However, a closer look at the documentation, it is said:
For a custom shadow image to be shown, a custom background image must also be set with the setBackgroundImage:forBarMetrics: method. If the default background image is used, then the default shadow image will be used regardless of the value of this property.
By using a custom background image, you would lose the blurred background translucency.
If you feel adventurous, the "hairline" is a UIImageView that is a subview of the navigation bar. You can find it and set it as hidden. This is what Apple does in their native calendar app, for example. Remember to show it when the current view disappears.
use following code in AppDelegate (didFinishLaunchingWithOptions)
Swift :
UINavigationBar.appearance().setBackgroundImage(UIImage(), for: .any, barMetrics: .default)
UINavigationBar.appearance().shadowImage = UIImage()
Objective c :
[[UINavigationBar appearance] setBackgroundImage:[[UIImage alloc] init]
forBarPosition:UIBarPositionAny
barMetrics:UIBarMetricsDefault];
[[UINavigationBar appearance] setShadowImage:[[UIImage alloc] init]];
Swift 3:
self.navigationController?.navigationBar.setValue(true, forKey: "hidesShadow")
One way to remove the hairline on the top and bottom of a UISearchBar is to replace the background image with a stretchable one, that does not have that thin border. Simply make a square shaped png with the color of your choice, then:
[searchBar setBackgroundImage:[[UIImage imageNamed:#"SearchBarImage"] resizableImageWithCapInsets:UIEdgeInsetsMake( 10, 10, 10, 10)]];
Since the background is solid you can use pretty much whatever values you want for the insets.
For those who interested how to implement "adventurous" approach of #Leo Natan, I added the sample code in my answer to the similar question.

Programmatically set UIBarButtonItem fill color?

I have a set of UIBarButtonItems from png files inside a UIToolbar.
When a user clicks on an icon, I want that icon to be filled with a color to indicate a state change.
Is it possible to do this with a single set of images (maybe by programmatically changing some attributes) or do I necessarily need two sets of images (on for each state) ?
make sure your UIImage's renderingMode is UIImageRenderingModeAlwaysTemplate first
if you initWithImage then change UIBarButtonItem's tintColor.
Although UIBarButtonItem is not a view, its tintColor property behaves
the same as that of UIView.
else if you initWithCustomView in which with a UIImageView then change the imageView's tintColor might work too
else you can setItems: animated:NO to UIToolBar every time after clicks which might not be a elegant one
It is very straight forward. You just need to do the following in code :
imgView.image = [imgView.image
imageWithRenderingMode:UIImageRenderingModeAlwaysTemplate];
imgView.tintColor = [UIColor someColor];

I can change tint colour on UIButton but not UIImage

I am playing around with tint colours on a UIImage and a UIButton.
On the UIButton (when the button type is set to System), I am able to set the tint colour of the UIButton in Xcode by going to Attributes Inspector -> View -> Tint
On UIImageView, I have set the same image, but when I go to the Attributes Inspector -> View -> Tint, the colour of the image does not change.
Why is the behaviour like this ? and how do I fix it ?
I am using iOS 7 and Xcode 5.1.1
Your image's rendering mode needs to be set to template and not original. To do this, you can call the -[UIImage imageWithRenderingMode:] method on your image and pass in UIImageRenderingModeAlwaysTemplate, then set your image view's image to the resulting image:
yourImageView.image = [yourImage imageWithRenderingMode:UIImageRenderingModeAlwaysTemplate];
Or, in Swift:
yourImageView.image = yourImage.imageWithRenderingMode(.AlwaysTemplate)

How to remove UINavigationBar and UISearchBar hairline

I am creating an iOS 7 app in which I'd like to have a SearchBar right bellow the NavigationBar, and I wanted them both to look like a single piece. Therefore I need to tint them with the same color (done already) and remove that hairline at the bottom of the NavigationBar and at the top of the SearchBar. How can I achieve that?
Officially, this is only possible by setting the shadowImage of the navigationBar to an empty image. However, a closer look at the documentation, it is said:
For a custom shadow image to be shown, a custom background image must also be set with the setBackgroundImage:forBarMetrics: method. If the default background image is used, then the default shadow image will be used regardless of the value of this property.
By using a custom background image, you would lose the blurred background translucency.
If you feel adventurous, the "hairline" is a UIImageView that is a subview of the navigation bar. You can find it and set it as hidden. This is what Apple does in their native calendar app, for example. Remember to show it when the current view disappears.
use following code in AppDelegate (didFinishLaunchingWithOptions)
Swift :
UINavigationBar.appearance().setBackgroundImage(UIImage(), for: .any, barMetrics: .default)
UINavigationBar.appearance().shadowImage = UIImage()
Objective c :
[[UINavigationBar appearance] setBackgroundImage:[[UIImage alloc] init]
forBarPosition:UIBarPositionAny
barMetrics:UIBarMetricsDefault];
[[UINavigationBar appearance] setShadowImage:[[UIImage alloc] init]];
Swift 3:
self.navigationController?.navigationBar.setValue(true, forKey: "hidesShadow")
One way to remove the hairline on the top and bottom of a UISearchBar is to replace the background image with a stretchable one, that does not have that thin border. Simply make a square shaped png with the color of your choice, then:
[searchBar setBackgroundImage:[[UIImage imageNamed:#"SearchBarImage"] resizableImageWithCapInsets:UIEdgeInsetsMake( 10, 10, 10, 10)]];
Since the background is solid you can use pretty much whatever values you want for the insets.
For those who interested how to implement "adventurous" approach of #Leo Natan, I added the sample code in my answer to the similar question.

How to ovverride UINavigationBar appearance if already customized

In the application delegate within my application I call the following method:
- (void)customizeAppearance
{
UIImage *gradientPortrait = [[UIImage imageNamed:#"gradient_portrait"]
resizableImageWithCapInsets:UIEdgeInsetsMake(0, 0, 0, 0)];
UIImage *gradientLandscape = [[UIImage imageNamed:#"gradient_landscape"]
resizableImageWithCapInsets:UIEdgeInsetsMake(0, 0, 0, 0)];
[[UINavigationBar appearance] setBackgroundImage:gradientPortrait
forBarMetrics:UIBarMetricsDefault];
[[UINavigationBar appearance] setBackgroundImage:gradientLandscape
forBarMetrics:UIBarMetricsLandscapePhone];
}
This code allow to customize all the navigation bars within the application. Each bar becomes green since the image I use is green.
Now my goal is to ovveride the above configuration for a specific navigation bar.
In particular, during application lifecycle, I open a modal controller using UIModalPresentationFormSheet presentation style. This controller is presented within a UINavigationController. Since I need also to display the navigation bar attached with that UINavigationController, I would like to know how it is possible to customize that bar, without changing the global configuration I set in the application delegate.
I've tried to set both the tintColor property of the navigation bar (presented modally) to [UIColor blackColor] and the barStyle to UIBarStyleBlack, but they don't work. Only barbutton items are affected.
Thank you in advance.
P.S. I'm using iOS 5
First of all if you don't mind your image stretched you don't need to use the resizableImageWithCapInsets:UIEdgeInsetsMake(0, 0, 0, 0) method.
UIImage *gradientPortrait = [UIImage imageNamed:#"gradient_portrait"];
UIImage *gradientLandscape = [UIImage imageNamed:#"gradient_landscape"];
UIImage *someOtherImage = [UIImage imageNamed:#"someOtherImageName"];
Then, to achieve what you want:
Make sure you subclass the ViewController on with the custom Navigationbar will appear
Use the following to add the default image to all of your Navigation Bars
[[UINavigationBar appearance] setBackgroundImage:gradientPortrait forBarMetrics:UIBarMetricsDefault];
Use the following to add the specific image to navigationbars wich will appear above the subclassed ViewControllers
[[UINavigationBar appearanceWhenContainedIn:[YOURSUBCLASS class], nil] setBackgroundImage:someOtherImage forBarMetrics:UIBarMetricsDefault];
(you can call these methods from somewhere in your app delegate)
btw, if you just want to change the tint color you could just use the tintColor Property instead of all the images.
for more info check out the appearance sections of: UINavigationBar Class Reference
Subclass UINavigationBar with your custom class and se different appearance on it. Then use your custom class on that particular place where you what to have different look.

Resources