S1U
S1U

Reputation: 825

iOS 7 status bar transparent

In storyboard, in a view controller I tried add a navigation bar under the status bar, running it, it is transparent and shows a label that's supposed to be blurred, like by navigation bar.

enter image description here

But when placing the same view controller embedded in a navigation view controller, the underneath background image could be blurred, which is my intention.

enter image description here

What are these two way different results? What need to do for the firs method to make status bar blur?

Thanks!

Upvotes: 14

Views: 16313

Answers (6)

swapnali patil
swapnali patil

Reputation: 304

when you embed view controller with navigation view controller that time you will see navigation bar to all the view controller you are pushing to from same view controller. In your first case you are adding the navigation bar object, insted of that you can select view controller from storyboard , go to attributes inspector tab & from their select Top bar as translucent navigation bar. enter image description here

Upvotes: 0

AuA
AuA

Reputation: 491

I know this is old, just for reference, I solved this by setting self.navigationController.navigationBar.clipToBounds = NO

Upvotes: 3

Marek R
Marek R

Reputation: 38209

I have similar UI design and based on Matt Hall answer and some article I've googled, I come up with something like this:

- (void)viewDidLoad {
  [super viewDidLoad];

  if (NSFoundationVersionNumber>NSFoundationVersionNumber_iOS_6_1) {
    CGRect statusBarFrame = [self.view convertRect: [UIApplication sharedApplication].statusBarFrame fromView: nil];
    UIToolbar *statusBarBackground = [[UIToolbar alloc] initWithFrame: statusBarFrame];
    statusBarBackground.barStyle = self.navBar.barStyle;
    statusBarBackground.translucent = self.navBar.translucent;
    statusBarBackground.autoresizingMask = UIViewAutoresizingFlexibleBottomMargin | UIViewAutoresizingFlexibleWidth;
    [self.view addSubview: statusBarBackground];
  }
}

Where self.navBar points to navigation bar added in storyboard. This is needed only in case when it runs on iOS7 that is why I've added this condition (my app has to support iOS5).

This works like a charm.


alternative approach (enforce status bar size) is also good:

- (void)viewDidLoad {
  [super viewDidLoad];

  if (NSFoundationVersionNumber>NSFoundationVersionNumber_iOS_6_1) {
    CGRect statusBarFrame = [self.view convertRect: [UIApplication sharedApplication].statusBarFrame fromView: nil];
    self.navBar.frame = CGRectUnion(statusBarFrame, self.navBar.frame);
  }
}


I've found another solution I think this is best since it involve only storyboard and no code is required.

  1. Switch storyboard view to 6.1 mode (view as: iOS 6.1 and Earlier) change view mode
  2. Select problematic UINavigationBar
  3. in size section add 20 delta height in "iOS6/7 Deltas" correct size of navigation bar
  4. Switch back view to 7.0 mode (view as: iOS 7.0 and Later), and be happy with result.

Upvotes: 1

jaredsinclair
jaredsinclair

Reputation: 12707

UINavigationController will alter the height of its UINavigationBar to either 44 points or 64 points, depending on a rather strange and undocumented set of constraints. If the UINavigationController detects that the top of its view’s frame is visually contiguous with its UIWindow’s top, then it draws its navigation bar with a height of 64 points. If its view’s top is not contiguous with the UIWindow’s top (even if off by only one point), then it draws its navigation bar in the “traditional” way with a height of 44 points. This logic is performed by UINavigationController even if it is several children down inside the view controller hierarchy of your application. There is no way to prevent this behavior.

It looks like you are positioning your view hierarchy in the first example starting at the point (0,20). Also, is that a UIToolbar or a UINavigationBar? If it's the latter, why are you using it by itself and not using it inside of UINavigationController?

If you do not use UINavigationController and are instead using custom view controller containers, you'll need to position your views accordingly.

See this answer for a thorough explanation.

Upvotes: 1

w3bshark
w3bshark

Reputation: 2729

I haven't tested this completely, but go to your plist file and check the following settings:

"View controller-based status bar appearance": If this is set to "Yes", then it should display a status bar that is unique to each View Controller, which might be what you need.

"Status bar style": You may set this to three different styles: Opaque black, Gray, and Transparent black.

Let me know if this worked for you.

Upvotes: 2

Matt Hall
Matt Hall

Reputation: 2689

In iOS 7 the status bar is transparent by default. The blurring you're seeing when there's also a navigation bar is actually created by the navigation bar. So to create the effect you're looking for without a navigation bar, you need to position a view that produces a blurring effect beneath the status bar.

For reference, add your view with a frame provided by:

CGRect statusBarFrame = [[UIApplication sharedApplication] statusBarFrame];

Upvotes: 4

Related Questions