Jak narysować przezroczysty pasek narzędzi UIToolbar lub UINavigationBar w systemie iOS7

88

Chciałbym całkowicie przejrzysty UIToolbari / lub UINavigationBar. Wypróbowałem różne zaklęcia sugerowane dla wersji przed i po iOS 5, ale żadna z nich już nie działa.

Jak można to osiągnąć w iOS 7?

Ben Packard
źródło
Dla potomności - omyłkowo użyłem self.edgesForExtendedLayout = UIRectEdgeNone, co zapobiega rozszerzaniu widoku pod paskiem narzędzi.
Ben Packard,

Odpowiedzi:

303

Swift 3 (iOS 10)

Przezroczysty UIToolbar

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

Przezroczysty UINavigationBar

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

Szybki <3

Przezroczysty UIToolbar

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

Przezroczysty UINavigationBar

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

Cel C

Przezroczysty UIToolbar

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

Przezroczysty UINavigationBar

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

Dyskusja

Ustawianie translucentsię YESna pasku nawigacyjnym załatwia sprawę, ze względu na zachowanie omówione w UINavigationBardokumentacji. Podam tutaj odpowiedni fragment:

Jeśli ustawisz tę właściwość YESna pasku nawigacji z nieprzezroczystym niestandardowym obrazem tła, pasek nawigacji zastosuje krycie systemu mniejsze niż 1,0 do obrazu.


Ostateczny wynik

ostateczny wynik

Gabriele Petronella
źródło
1
Czy potwierdziłeś, że wersja paska narzędzi działa na iOS7? Pojawia się ciemny pasek narzędzi i dziwne migotanie podczas prezentacji.
Ben Packard
2
Zrzut ekranu pochodzi z iOS 7symulatora
Gabriele Petronella
Po prostu uruchomiłem aplikację testową na moim iPhonie 5 z iOS 7 i działa zgodnie z oczekiwaniami.
Gabriele Petronella
1
Dobra robota, tak wiele złych / złych sposobów na zrobienie tego w SO
pfrank
2
Jeśli używasz edgeForExtendedLayout = UIRectEdgeNone, prawdopodobnie będziesz chciał zaimplementować niestandardowe przejścia. Ponieważ w przeciwnym razie podczas przesuwania widoków domyślne przejście spowoduje ciemne migotanie pod przezroczystym paskiem podczas animacji. Do Twojej wiadomości, oto szybkie źródło podstawowego przejścia przesuwnego: gist.github.com/ArtFeel/7690431
anna
8

Jeśli chcesz to zrobić w całej aplikacji, użyj proxy UIAppearance (iOS5 +):

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

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

Artykuł: http://nshipster.com/uiappearance/

Adam Waite
źródło
Tylko uwaga dla osób, które się tym zajmują - umieść ten kod w swoim AppDelegate didFinishLaunchingWithOptions, aby uzyskać szybki i nieprzyjemny sposób, aby to zastosować.
Shaun F
Możesz również ustawić ten serwer proxy wyglądu, aby działał tylko z określonymi UINavigationControllerpodklasami, tj. Takimi, do których chcesz zastosować to zachowanie.
Evan R
2

Próbować:

[navBar setBackgroundImage:[UIImage alloc] forBarMetrics:UIBarMetricsDefault];
Leo Natan
źródło
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
wrzasnął
źródło
0

Coś, na co się natknąłem, to fakt, że gdybym utworzył podklasę, UINavigationBara następnie utworzył pustą -(void)drawRect:metodę, uzyskałbym przezroczysty pasek nawigacji. Testowałem to tylko w iOS 7. *, ale wydawało się, że działa!

jakenberg
źródło