This question already has an answer here:
UITabBar fully transparent
(1 answer)
Closed 9 years ago.
I have spent the last few hours trying to get the TabBar in a UITabBarController fully transparent (clear background). I use a custom subclass of the UITabBarController and I managed to change the tintColor, the alpha, but the background color definitely remains the one defined in IB.
Thanks for your help, I'm getting crazy...
Here is one way to accomplish that.
CGRect frame = CGRectMake(0.0, 0.0, 320, 48);//Setting a Frame.
myTabView = [[UIView alloc] initWithFrame:frame];//Making Tab View
// not supported on iOS4
UITabBar *tabBarr = [self.tabBar tabBar];
if ([tabBarr respondsToSelector:#selector(setBackgroundImage:)])
{
// set it just for this instance
[tabBarr setBackgroundImage:[UIImage imageNamed:#"hot-1.png"]];
// set for all
// [[UITabBar appearance] setBackgroundImage: ...
}
else
{
// ios 4 code here
//[tabBarr setBackgroundColor:c];
}
//[myTabView setBackgroundColor:c];//Setting Color Of TaBar.
[myTabView setAlpha:0.8];//Setting Alpha of TabView.
[[self.tabBar tabBar] insertSubview:myTabView atIndex:0];//Inserting Tab As SubView.
And here is a link to a tutorial I found very useful in changing the tab bar's background. You can play around with the code and costomize it to your liking.
http://ios-blog.co.uk/tutorials/how-to-customize-the-tab-bar-using-ios-5-appearance-api/
Edit:
As far as setting the background color of tabbar to transparent or clear color, you have two ways. One is the image which I explained and you didn't like. The other one is to set the background of tabbar in its supper view. Something along the following line.
tabBar.superview.backgroundColor = [UIColor clearColor];
This way you reach behind the tabbar and change that black background to whatever you want.
Edit 1:
sorry for delay in adding the solution for ios 7. below is the method you need to change the background color of the tabbar in ios 7.
just add the following line of code inside your ViewDidLoad method and it will do the magic.
[self.tabBarController.tabBar setBackgroundColor:[UIColor greenColor]];
hope this helps.:)
Related
This is what I want. It loads on some of my view controllers.
Hi all,
I am going nuts trying to make the tint color of all of my viewControllers the same. Some appear to be much darker than others. All I want is the light color to be throughout...
Sometimes I get this ugly dark gray instead... I am not sure what I am doing incorrectly. I have checked the .m file and am not setting the tint color or anything... not sure why it wouldnt be consistent on every viewController...
Any help would be great. Thanks!
in iOS7 navigation bar is by default translucent=YES so just change to NO like bellow:-
self.navigationController.navigationBar.translucent=NO;
and set Navigaitonbar color or other property customize like Bellow put this code into Appdelegate class didFinishLaunchingWithOptions and use appearance for applying Globally:-
if (floor(NSFoundationVersionNumber) <= NSFoundationVersionNumber_iOS_6_1) {
// Load resources for iOS 6.1 or earlier
[[UINavigationBar appearance]setTintColor:NavigationColor];
} else {
[[UINavigationBar appearance]setTintColor:[UIColor whiteColor]]; // it set color of bar button item text
[[UINavigationBar appearance]setBarTintColor:[UIColor GreenColor]]; // it set color of navigation
[[UINavigationBar appearance] setBarStyle:UIBarStyleDefault]; // it set Style of UINavigationBar
[[UINavigationBar appearance]setTitleTextAttributes:#{UITextAttributeTextColor : [UIColor whiteColor]}]; //It set title color of Navigation Bar
// Load resources for iOS 7 or later
}
For tabBar also same this is by default translucent=YES change to NO
[self.tabBarController.tabBar setTranslucent:NO];
A common mistake is setting the view.backgroundColor of the View Controller to clearColor (both programmatically or via Storyboard). This makes the view actually black instead (since there's nothing beneath the clear view), so everything that is above that view, that has translucent property set to YES, will show dark grey color (black color + default iOS blur).
To fix this, either set the translucent property to NO (as Nitin Gohel said), or set the view.backgroundColor to white, which's its actual default color.
Hope this still helps someone!
Since iOS 7.1 there's a bug, which causes UITabBar to not listen to Global Tint.
See this post: https://stackoverflow.com/a/22323786/1255674
You need to set the tint programmatically. Thanks, Ive ...
I'm using a custom Navigation Bar appearance in my app with this code in the App Delegate's application:didFinishLaunchingWithOptions: method:
[[UINavigationBar appearance] setBackgroundImage:[UIImage imageNamed:#"navBar.png"] forBarMetrics:UIBarMetricsDefault];
[[UINavigationBar appearance] setBackgroundColor:[UIColor clearColor]];
However, this appearance breaks when I present an ABPeoplePickerNavigationController (to allow selection of a contact to populate the To: field for a new email), because the system uses an extra tall UINavigationBar when this view is showing due to the prompt property on UINavigationItem being set by the system ("Choose a contact to mail").
The fix is to add this code:
[[UINavigationBar appearanceWhenContainedIn:[ABPeoplePickerNavigationController class], nil] setBackgroundImage:nil forBarMetrics:UIBarMetricsDefault];
[[UINavigationBar appearanceWhenContainedIn:[ABPeoplePickerNavigationController class], nil] setBarStyle:UIBarStyleBlack];
Which looks like this:
However, this little hack doesn't work when you tap the Groups button from the initial view. It still looks broken due to the extra tall Navigation Bar:
Any ideas what the controller name is for that view (so I can apply the same exclusion as above), or another way to fix this?
I'm just hitting this now.. any luck resolving? I'm thinking to try interating through the ABPeoplepickerNavigationControllers view controllers and applying appearanceWhenContainedIn method...
I've been fighting with this as well, but think I've pieced together a solution.
The group selection view is some other (unknown to me, likely private) class, so we can't specify an exception style through an appearance-proxy-when-contained-in approach, as you've done for the ABPeoplePickerNavigationController. Instead, we should try and resolve the original issue, which is the custom background image not rendering properly when the prompt is shown and the navigation bar is tall.
The solution here (iOS5 UINavigationBar background image issues when prompt is shown) suggests using a resizable background image for the navigation bar.
That almost worked for me, but the background image I was using included the shadow for underneath the navigation bar and that wasn't resizing correctly when the prompt was shown. Instead, I had to use a resizable background image without a shadow and then specify the shadow image separately.
UINavigationBar* navigationBar = [UINavigationBar appearance];
[navigationBar setBackgroundImage:[[UIImage imageNamed:#"TopBarBackgroundNoShadow"] resizableImageWithCapInsets:UIEdgeInsetsMake(3, 0, 3, 0)]
forBarMetrics:UIBarMetricsDefault];
[navigationBar setShadowImage:[UIImage imageNamed:#"TopBarShadowResize"]];
Using this approach removed the need for any exception styling and looked good in both the ABPeoplePickerNavigationController and the group selection view, as well as at standard height.
I'm very new to iOS programming.
I'm trying to set the toolbar background to a custom image.
I'm also using storyboards.
How do I go about that?
Do I edit UIToolbar in the UI Kit framework? Do I need to change something in Storyboard?
Thanks,
You can use UIToolbar's built-in -setBackgroundImage:forToolbarPosition:barMetrics: method:
// portrait
[yourToolbar setBackgroundImage:[UIImage imageNamed:#"YourToolbarBkg-Portrait.png"] forToolbarPosition:UIToolbarPositionAny barMetrics:UIBarMetricsDefault];
// landscape
[yourToolbar setBackgroundImage:[UIImage imageNamed:#"YourToolbarBkg-Landscape.png"] forToolbarPosition:UIToolbarPositionAny barMetrics: UIBarMetricsLandscapePhone];
YourToolbarBkg-Portrait.png will be 320x44 bkg image for portrait mode
YourToolbarBkg-Landscape.png will be 480x32 bkg image for landscape mode.
UIToolbar inherits from UIView. This just worked for me:
[topBar insertSubview:[[[UIImageView alloc] initWithImage:[UIImage imageNamed:BAR_BKG_IMG]] autorelease] atIndex:0];
UPDATED
topBar ------ is the outlet of the UIToolBar u are using
use this code where u are creating ur UIToolBar the class which implements the UIToolbar..
plus tell me y r u using Toolbar whats ur main purpose for it
Instead of editing UIToolBar, why not create a UIView of the same size and skin that however you would like? That would be easier if you are new.
Or if you want to override UIToolbar:
#implementation UIToolbar (CustomImage)
- (void)drawRect:(CGRect)rect {
UIImage *image = [UIImage imageNamed: #"image.png"];
[image drawInRect:CGRectMake(0, 0, self.frame.size.width, self.frame.size.height)];
}
#end
Had a right faff with background images for ToolBars and NavBars. I know setting the background image of a NavBar and ToolBar is generally a doddle. But, when you're presenting modal VC's, for some insane reason, where a NavBar is being added and you DO change the background image, it appears to double in size. Altering the height has strange results.
My issue was where I was using a NavController all over my App, but needed a modal view for one or two aspects of it. Simple enough. However, I needed either a NavBar or ToolBar type header with a Done button to pop the VC off the stack. Again, not an issue. But I needed the NavBar or ToolBar to look the same as everywhere else in my App.
I settled on a ToolBar, seeing as the VC was being presented modally. So, there my ToolBar sat, in typical Apple-blue. Nice, but not how the rest of my App looked, where a blackened image was being used for each NavBar. Using the iOS 5 appearance proxy, I altered the background image of the ToolBar. And this worked. But, unless I had the UIImage in exactly the proportions and size expected by the Tool Bar, I was in a pickle. The image simply did not look right at all. So, I decided to create a UIIMageView, where I could control the content mode, then insert a subview onto the toolBar.
Take a look at my code below.
UIImageView *toolbarImageView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:NAV_BAR_BACKGROUND]];
[toolbarImageView setFrame:[self.IBOToolBar bounds]];
[toolbarImageView setContentMode:UIViewContentModeScaleAspectFill];
[self.IBOToolBar insertSubview:toolbarImageView atIndex:1];
It's a bit of a fluff but I do hope this helps someone alter the image on their ToolBar.
NAV_BAR_BACKGROUND can be defined as follows:
#define NAV_BAR_BACKGROUND #"navBarBlackMattDarkSquare.png"
How to add colour to the navigation bar ? I need to implement this for iOS 4 and above.
I want a colour similar to the one in the screenshot:
In the example you posted, It looks more like a backround image because of the slight lighting effect. (It's brighter in the middle, it you look closely. In IB, I have the nav bar set to Black Transparent with the following Background Image. (320 x 44px)
h file.
IBOutlet UINavigationBar *navBar;
m file "viewDidLoad" function:
navBar.backgroundColor = [UIColor colorWithPatternImage:[UIImage imageNamed:#"nav"]];
In iOS < 5 you can set tint color of individual navigation bar directly, e.g.:
// self is a UIViewController
[self.navigationController.navigationBar setTintColor:[UIColor purpleColor]];
Once you don't need compatibility with iOS 4.x you can use appearance proxy for UINavigationBar. This would work for all navigation bars in the application:
[[UINavigationBar appearance] setTintColor:[UIColor purpleColor]];
SO I am setting a UINavigationBar tintColor and here's what I get:
[navController.navigationBar setTintColor:[UIColor whiteColor]];
How is this even possible? Here's some more info if it helps:
I've got a UINavigationController that I customize as follows:
First, come up with a 44px-high image as the background for the nav bar. (In this case, if you wanted to use a 44px-high white image, that'd do the trick --- but it'll look much nicer if you use some type of vertical gradient)
Second, use the following code in your AppDelegate's didFinishLaunching method. (The image is called "background_44.png".
// Set the background image for *all* UINavigationBars
UIImage *gradientImage44 = [[UIImage imageNamed:#"background_44.png"]
resizableImageWithCapInsets:UIEdgeInsetsMake(0, 0, 0, 0)];
// Set the background image for *all* UINavigationBars
[[UINavigationBar appearance] setBackgroundImage:gradientImage44
forBarMetrics:UIBarMetricsDefault];
I dropped that code in my project, worked fine. Even changed bar styles and colors. No problem. This line of code is fine, there is an issue somewhere else or its some crazy glitch.