In my iPhone app I have the following code to set the background image for both the landscape and portrait titlebar in the app.
if ([UINavigationBar respondsToSelector:#selector(appearance)]) {
[[UINavigationBar appearance] setBackgroundImage: [UIImage imageNamed:#"titlebar_landscape.png"] forBarMetrics:UIBarMetricsLandscapePhone];
[[UINavigationBar appearance] setBackgroundImage: [UIImage imageNamed:#"titlebar.png"] forBarMetrics:UIBarMetricsDefault];
[[UINavigationBar appearance] setBackgroundColor: [UIColor redColor]];
}
The image is the apps logo centered on a gradient background, which is re-sized for landscape accordingly. I have done the same for my iPad version of the app, however the landscape image doesn't work, because there is no specific option for Landscape on the iPad like there is on the iPhone UIBarMetricsLandscapePhone.
So my question is how to I achieve a similar effect on my iPad of my apps logo centered on a gradient background in landscape mode in iOS5?
iPad uses the same bar metrics regardless of orientation, so you should only have to set the UIBarMetricsDefault image. The iPhone landscape metric is because the system uses a slightly shorter navigation bar on iPhone when in landscape mode. All other navigation bars are the larger size, including any navigation bar shown on an iPad.
Here is a good tutorial on it, might help point you in the right direction. http://iosdevelopertips.com/user-interface/ios-5-customize-uinavigationbar-and-uibarbuttonitem-with-appearance-api.html
Related
In the use of the iphone 5, the navigationBar and statusBar normal height, but under the iphone6 or iphone6plus navigationBar and the statusBar height is bigger, not 64, the likelihood is scaling.
The problem is that I want iphone6 or iphone6plus to also become a normal 64, but they don't know how to find this code in the project.
/Users/henry/Desktop/question1.jpg
You need to specify Launch Images for the iPhone 6 / + resolutions, either as individual image files or define a XIB / storyboard file (for iOS 8+). Otherwise your app will run in that zoomed sort of compatibility mode that you're seeing-- apple created that when they introduced the iPhone 6 & 6+ which were of different aspect ratios than any iPhones before them so apps that weren't updated for the new phones didn't look entirely awful when the new phones came out.
see:
https://developer.apple.com/library/ios/documentation/UserExperience/Conceptual/MobileHIG/LaunchImages.html
Try this code. make sure that image "navbg.png" height 64.
[[UIApplication sharedApplication] setStatusBarStyle:UIStatusBarStyleLightContent];
[[UINavigationBar appearance] setShadowImage:[UIImage new]];
[[UINavigationBar appearance] setBackgroundImage:[UIImage imageNamed:#"navbg.png"] forBarMetrics:UIBarMetricsDefault];
[[UINavigationBar appearance] setTranslucent:NO];
[[UINavigationBar appearance] setTintColor:[UIColor whiteColor]];
I have the following code that works fine for setting a background image:
[self.navigationController.navigationBar setBackgroundImage:[UIImage imageNamed: #"navbar_bg.png"] forBarMetrics:UIBarMetricsDefault];
My question is, for Xcode6, iOS8/9, iPhone 5, 6, 6+, iPad, etc, how do I make sure I cover all devices, widths and resolutions, to make sure that my background image always fills the navigation bar correctly?
I have seen other questions on SO and various other sites, but all have been 2-4 years old, and so don't mention or cover the latest device widths and resolutions.
I want to use a background image in the navigation bar, but I need to make sure it looks good on all possible devices.
All you have to do is have three versions of your image in your asset catalogue. The first in the size you need the second twice the size and the third three times the size. Xcode will put the right image on the right device.
Alternatively you can just put a vectorial image and at complie time Xcode will generate the three images for you on the fly.
For the navigation bar you need separate images for portrait and landscape. You can write something like this:
UIImage *portraitImage = [UIImage imageNamed:#"test_bar_portrait.png"];
UIImage *landscapeImage = [UIImage imageNamed:#"test_bar_landscape.png"];
[[UINavigationBar appearance] setBackgroundImage:portraitImage forBarMetrics:UIBarMetricsDefault];
[[UINavigationBar appearance] setBackgroundImage:landscapeImage forBarMetrics:UIBarMetricsLandscapePhone];
self.navigationController.navigationBar.autoresizingMask = UIViewAutoresizingFlexibleTopMargin;
I am working in InDesign DPS to create an iPad book and have options for both portrait and landscape views. Everything is working correctly except when I change the orientation of the iPad between portrait and landscape there is a white background that "flashes" briefly in the non-content area at the bottom of the screen until the destination orientation fills the screen.
How do I eliminate that irritant?
Thanks.
Isn't it your window ?
Change it's background color to black in your didFinishLaunch... : self.window.backgroundColor = [UIColor blackColor];
In iOS 7 Apple increased the standard size of tab bar icons. If the tab bar icons are set in a storyboard, how can you support both iOS 6 and iOS 7 interfaces simultaneously? Do you have to make a separate storyboard for iOS 7?
Programmatically adjust the icon if you're in iOS 7?
I'm mostly confused because the documentation doesn't seem to mention anything about differently sized icons for tab bars (https://developer.apple.com/library/ios/documentation/userexperience/conceptual/TransitionGuide/TransitionGuide.pdf page 26)
In fact the icons look almost identical.
But when I run my app in iOS 7 all the icons appear shrunk down.
You can use following method to check the version of current iOS and then customize the button size and appearance of the navigation bar buttons.
if (floor(NSFoundationVersionNumber)<=NSFoundationVersionNumber_iOS_6_1) {
UIImage *navBarImage=[[UIImage imageNamed:#"top-bar-bg-44px.png"] resizableImageWithCapInsets:UIEdgeInsetsMake(0, 0, 0, 0)];
[[UINavigationBar appearance] setBackgroundImage:navBarImage forBarMetrics:UIBarMetricsDefault];
UIImage *barButtonImg=[[UIImage imageNamed:#"back-ios6.png"]
resizableImageWithCapInsets:UIEdgeInsetsMake(0, 13, 0, 5)];
[[UIBarButtonItem appearance] setBackButtonBackgroundImage:barButtonImg forState:UIControlStateNormal barMetrics:UIBarMetricsDefault];
}
else{
}
After some digging, I found the answer over here - Tab bar icons on retina display
"You need to create two separate icons icon.png (30x30) and icon#2x.png (60x60).
iOS will automatically load the right file based on the screen scale."
My back button in my app works perfectly on Retina-based devices but has serious issues on non-Retina devices. Does anyone have any idea why this would be happening? As you can see the UINavigationBar background gets overlayed on top of the text area of the button.
However, when viewed on a Retina device, it renders correctly. Both images have #2x versions for retina display but for some reason the standard version won't render. I use this code to set the background button's image:
UIImage *backButtonImage = [UIImage imageNamed:#"backbutt4on.png"];
[[UIBarButtonItem appearance] setBackButtonBackgroundImage:backButtonImage forState:UIControlStateNormal barMetrics:UIBarMetricsDefault];
Non-Retina:
Retina: