So zeichnen Sie eine transparente UIToolbar oder UINavigationBar in iOS7

88

Ich möchte eine völlig transparente UIToolbarund / oder UINavigationBar. Ich habe die verschiedenen Beschwörungsformeln ausprobiert, die für Pre- und Post-iOS 5 vorgeschlagen wurden, aber keine scheint mehr zu funktionieren.

Wie könnte dies in iOS 7 erreicht werden?

ios uinavigationcontroller uinavigationbar ios7 uitoolbar Ben Packard
quelle
Für die Nachwelt - Ich habe fälschlicherweise self.edgesForExtendedLayout = UIRectEdgeNone verwendet, wodurch verhindert wird, dass sich die Ansicht unter der Symbolleiste erstreckt.
Ben Packard

Antworten:

303

Swift 3 (iOS 10)

Transparent UIToolbar

self.toolbar.setBackgroundImage(UIImage(),
                                forToolbarPosition: .any,
                                barMetrics: .default)
self.toolbar.setShadowImage(UIImage(), forToolbarPosition: .any)

Transparent UINavigationBar

self.navigationBar.setBackgroundImage(UIImage(), for: .default)
self.navigationBar.shadowImage = UIImage()
self.navigationBar.isTranslucent = true

Schnell <3

Transparent UIToolbar

self.toolbar.setBackgroundImage(UIImage(),
                                forToolbarPosition: UIBarPosition.Any,
                                barMetrics: UIBarMetrics.Default)
self.toolbar.setShadowImage(UIImage(),
                            forToolbarPosition: UIBarPosition.Any)

Transparent UINavigationBar

self.navigationBar.setBackgroundImage(UIImage(), forBarMetrics: UIBarMetrics.Default)
self.navigationBar.shadowImage = UIImage()
self.navigationBar.translucent = true

Ziel c

Transparent UIToolbar

[self.toolbar setBackgroundImage:[UIImage new]
              forToolbarPosition:UIBarPositionAny
                      barMetrics:UIBarMetricsDefault];
[self.toolbar setShadowImage:[UIImage new]
          forToolbarPosition:UIBarPositionAny];

Transparent UINavigationBar

[self.navigationBar setBackgroundImage:[UIImage new]
                         forBarMetrics:UIBarMetricsDefault];
self.navigationBar.shadowImage = [UIImage new];
self.navigationBar.translucent = YES;

Diskussion

Die Einstellung translucentin YESder Navigationsleiste reicht aufgrund eines in der UINavigationBarDokumentation beschriebenen Verhaltens aus . Ich werde hier das relevante Fragment melden:

Wenn Sie diese Eigenschaft in YESeiner Navigationsleiste mit einem undurchsichtigen benutzerdefinierten Hintergrundbild festlegen , wendet die Navigationsleiste eine Systemopazität von weniger als 1,0 auf das Bild an.

Endergebnis

Endergebnis

Gabriele Petronella
quelle
1
Haben Sie bestätigt, dass die Symbolleistenversion unter iOS7 funktioniert? Ich bekomme eine dunkle Symbolleiste und ein seltsames Flackern bei der Präsentation.
Ben Packard
2
Der Screenshot ist aus dem iOS 7Simulator
Gabriele Petronella
Außerdem starte ich gerade eine Test-App auf meinem iPhone 5 mit iOS 7 und sie funktioniert wie erwartet.
Gabriele Petronella
1
Schön gemacht, so viele falsche / schlechte Wege, dies auf SO zu tun
pfrank
2
Wenn Sie edgeForExtendedLayout = UIRectEdgeNone verwenden, möchten Sie wahrscheinlich benutzerdefinierte Übergänge implementieren. Andernfalls wird beim Verschieben von Ansichten beim Standardübergang während der Animation ein dunkles Flimmern unter der transparenten Leiste erzeugt. Zu Ihrer Information
Anna
8

Wenn Sie dies über die gesamte App tun möchten, sollten Sie den UIAppearance-Proxy (iOS5 +) verwenden:

UINavigationBar *navigationBarAppearance = [UINavigationBar appearance]; navigationBarAppearance.backgroundColor = [UIColor clearColor]; [navigationBarAppearance setBackgroundImage:[[UIImage alloc] init] forBarMetrics:UIBarMetricsDefault]; navigationBarAppearance.shadowImage = [[UIImage alloc] init];

Dokumente: https://developer.apple.com/library/ios/documentation/UIKit/Reference/UIAppearance_Protocol/Reference/Reference.html

Artikel: http://nshipster.com/uiappearance/

Adam Waite
quelle
Nur eine Anmerkung für Leute, die sich das ansehen - fügen Sie diesen Code in Ihre AppDelegate didFinishLaunchingWithOptions ein, um eine schnelle und schmutzige Möglichkeit zu finden, dies anzuwenden.
Shaun F
Sie können diesen Darstellungs-Proxy auch so einstellen, dass er nur mit bestimmten UINavigationControllerUnterklassen funktioniert, dh mit denen, auf die dieses Verhalten angewendet werden soll.
Evan R vor
2

Versuchen:

[navBar setBackgroundImage:[UIImage alloc] forBarMetrics:UIBarMetricsDefault];
Leo Natan
quelle
0 
@implementation MyCustomNavigationBar

- (id)initWithFrame:(CGRect)frame
{
    self = [super initWithFrame:frame];
    if (self) {
        [self setup];
    }
    return self;
}

- (id)initWithCoder:(NSCoder *)aDecoder {
    self = [super initWithCoder:aDecoder];
    if (self) {
        [self setup];
    }
    return self;
}

- (void)setup {
    [self setupBackground];
}

- (void)setupBackground {
    self.backgroundColor = [UIColor clearColor];
    self.tintColor = [UIColor clearColor];

    // make navigation bar overlap the content
    self.translucent = YES; 
    self.opaque = NO;

    // remove the default background image by replacing it with a clear image
    [self setBackgroundImage:[self.class maskedImage] forBarMetrics:UIBarMetricsDefault];

    // remove defualt bottom shadow
    [self setShadowImage: [UIImage new]]; 
}

+ (UIImage *)maskedImage {
    const float colorMask[6] = {222, 255, 222, 255, 222, 255};
    UIImage *img = [UIImage imageNamed:@"nav-white-pixel-bg.jpg"];
    return [UIImage imageWithCGImage: CGImageCreateWithMaskingColors(img.CGImage, colorMask)];
}

@end
schrie
quelle
0

Ich bin darauf gestoßen, dass ich eine transparente Navigationsleiste erhalten würde , wenn ich eine Unterklasse UINavigationBarund dann eine leere -(void)drawRect:Methode erstellen würde. Ich habe dies nur in iOS 7 getestet. *, Aber es schien zu funktionieren!

jakenberg
quelle