UINavigationBarを透明にする


回答:


635

iOS 7以降でこれを達成する方法を誰かが疑問に思っている場合は、ここに解決策があります(iOS 6にも対応)

Objective-Cの場合

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

Swift 3(iOS 10)

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

迅速に2

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

討論

ドキュメントで説明されている動作により、ナビゲーションバーtranslucentYESに設定するとうまくいきUINavigationBarます。ここで関連するフラグメントを報告します。

YES不透明なカスタム背景画像のあるナビゲーションバーでこのプロパティをに設定すると、ナビゲーションバーは1.0未満のシステム不透明度を画像に適用します。


29
ここで自分のコメントに答えます。影響の試行を元に戻すには:[self.navigationController.navigationBar setBackgroundImage:nil forBarMetrics:UIBarMetricsDefault]; self.navigationController.navigationBar.shadowImage = nil; self.navigationController.navigationBar.translucent = NO;
Johann Burgess '05年

透過的なナビゲーションバーを使用するには、VCが1つだけ必要です。そのVCを終了した後、元のスタイルに戻すにはどうすればよいですか?
ギルヘルム2015

2
:のViewController内からスウィフトでこれを達成するために、このようにそれを行う self.navigationController?.navigationBar.setBackgroundImage(UIImage(), forBarMetrics: UIBarMetrics.Default) self.navigationController?.navigationBar.shadowImage = UIImage() self.navigationController?.navigationBar.translucent = true
datayeah

appeareanceを使用して作品だけでなく(iOS7 / 8)、以下を参照してください。gist.github.com/mpycio/ddbdea1adb6b86cf02f6を
マハーカーラ

1
エフェクトを元に戻すと、部分的にしか機能しません。これを実行した後、テーブルビューにはすべてヘッダーが大きすぎるためです。奇妙なのはアプリ全体です。(私がスタックにプッシュした1つのコントローラーに対してのみこのエフェクトが必要です。)
Henning

29

iOS5では、これを実行してナビゲーションバーを透明にすることができます。

nav.navigationBar.translucent = YES; // Setting this slides the view up, underneath the nav bar (otherwise it'll appear black)
const float colorMask[6] = {222, 255, 222, 255, 222, 255};
UIImage *img = [[UIImage alloc] init];
UIImage *maskedImage = [UIImage imageWithCGImage: CGImageCreateWithMaskingColors(img.CGImage, colorMask)];

[nav.navigationBar setBackgroundImage:maskedImage forBarMetrics:UIBarMetricsDefault]; 
[img release];

6
iOS 6では、ナビゲーションバーの影も削除する必要があります。そうしないと、奇妙に見えます。[[UINavigationBar appearance] setShadowImage: [[UIImage alloc] init]];
ロバート

23

IOS7から:

self.navigationController.navigationBar.translucent = YES;
self.navigationController.navigationBar.shadowImage = [UIImage new];
self.navigationController.view.backgroundColor = [UIColor clearColor];
[self.navigationController.navigationBar setBackgroundImage:[UIImage new] forBarMetrics:UIBarMetricsDefault];
self.navigationController.navigationBar.backgroundColor = [UIColor clearColor];

14

Swift 2.xでこれを実行したい人のために:

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

またはSwift 3.x:

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

2
navigationControllerはオプションのプロパティであるため、アンラップする必要があります。単にself.navigationController?.navigationBarを追加すれば、準備完了です
Daniel Galasko

10

これはうまくいくようです:

@implementation UINavigationBar (custom)
- (void)drawRect:(CGRect)rect {}
@end

navigationController.navigationBar.backgroundColor = [UIColor clearColor];

6
iOS 5 -drawRect:では、カテゴリではなくサブクラス本体でオーバーライドし、このサブクラスをナビゲーションバーとして使用する必要があるようです。
Yang Meyer

9

上で他の誰もが言ったことをした後、すなわち:

navigationController?.navigationBar.setBackgroundImage(UIImage(), forBarMetrics: .default)
navigationController?.navigationBar.shadowImage = UIImage()
navigationController!.navigationBar.isTranslucent = true

... ナビゲーションバーはまだ白でした。だから私はこの行を追加しました:

navigationController?.navigationBar.backgroundColor = .clear

... et voila!それはトリックをするようでした。


7

最新のベータ版iOS 13.4とXCode 11.4でビルドすると、受け入れられた回答は機能しなくなります。私は別の方法を見つけました、多分それはベータ版ソフトウェアの単なるバグかもしれませんが、念のために書き留めておきます

(スイフト5)

import UIKit

class TransparentNavBar :UINavigationBar {
    override func awakeFromNib() {
        super.awakeFromNib()
        self.setBackgroundImage(UIImage(), for: .default)
        self.shadowImage = UIImage()
        self.isTranslucent = true
        self.backgroundColor = .clear
        if #available(iOS 13.0, *) {
            self.standardAppearance.backgroundColor = .clear
            self.standardAppearance.backgroundEffect = .none
            self.standardAppearance.shadowColor = .clear
        }
    }
}

驚くばかり!ただ修正を探していました!よく働く!ありがとう!
ジョージ

5

私はこのトピックが古いことを知っていますが、人々がdrawRectメソッドをオーバーロードせずにそれがどのように行われるのかを知りたい場合。

これはあなたが必要とするものです:

self.navigationController.navigationBar.translucent = YES;
self.navigationController.navigationBar.opaque = YES;
self.navigationController.navigationBar.tintColor = [UIColor clearColor];
self.navigationController.navigationBar.backgroundColor = [UIColor clearColor];

1
申し訳ありませんが、これは正しくありません。それでも、drawRectメソッドをオーバーライドする必要があります
Sander

なぜこれが間違っているのですか?IOS 6 simで動作しているようです。IOS 5で機能していませんか?navigationBar.backgroundColorは文書化されていないようです。
クリスティ

5

以下のコードは、このスレッドに選択された上部の回答を拡張して、下部の境界線を取り除き、テキストの色を設定します。

  1. このコードの最後の2つのコード化された行は透明性を設定します。このスレッドからそのコードを借りて、それは完全に機能しました!

  2. 「clipsToBounds」プロパティは、透明度を設定せずにORを使用して下の境界線を取り除くコードでした(そのため、代わりに白/黒などの実線の背景を使用する場合、境界線はありません)。

  3. 「tintColor」ライン(2番目のコード化されたライン)は、戻るボタンを薄い灰色に設定しました

  4. バックアップとしてbarTintColorを保持しました。透明度が機能しない理由はわかりませんが、機能しない場合は、以前使用していたbgホワイトを使用します

    let navigationBarAppearace = UINavigationBar.appearance()
    navigationBarAppearace.tintColor = UIColor.lightGray
    navigationBarAppearace.barTintColor = UIColor.white
    navigationBarAppearace.clipsToBounds = true
    navigationBarAppearace.isTranslucent = true
    navigationBarAppearace.setBackgroundImage(UIImage(), for: .default)
    navigationBarAppearace.shadowImage = UIImage()

3

Swift 3.0の場合:

override func viewDidLoad() {
    super.viewDidLoad()

    navigationController?.navigationBar.setBackgroundImage(UIImage(), for: .default)
    navigationController?.navigationBar.shadowImage = UIImage()
    navigationController?.navigationBar.isTranslucent = true
}

3

C#/ Xamarinソリューション

NavigationController.NavigationBar.SetBackgroundImage(new UIImage(), UIBarMetrics.Default);
NavigationController.NavigationBar.ShadowImage = new UIImage();
NavigationController.NavigationBar.Translucent = true;

2

次のコードを試してください。

self.navigationController.navigationBar.translucent = YES;

1

私にとってうまくいったもう1つの方法は、UINavigationBarをサブクラス化して、drawRectメソッドを空のままにすることです。

@IBDesignable class MONavigationBar: UINavigationBar {


// Only override drawRect: if you perform custom drawing.
// An empty implementation adversely affects performance during animation.
override func drawRect(rect: CGRect) {
    // Drawing code
}}

1

Swift 4.2の場合

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

(viewWillAppear内)、そしてviewWillDisappear内で、元に戻すには、

self.navigationController?.navigationBar.shadowImage = nil
self.navigationController?.navigationBar.isTranslucent = false

0

完全に透明ですか、それとも写真アプリで見られる半透明の黒のスタイルを使用しているのですか?後者は、そのbarStyleプロパティをに設定することで実現できますUIBarStyleBlackTranslucent。前者…わかりません。項目を表示したままにする場合は、バーのビュー階層を掘り下げて、背景を含むビューを削除する必要がある場合があります。


2
前者を意味します。カテゴリを作成し、UINavigationBarのdrawRectメソッドをオーバーライドして(CGContextClearRectを呼び出して)みましたが、完全に黒くなりました。アイテムはまだ見えていました。
-quano

0

これはSwift 2.0で機能します。

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

0

チェックRRViewControllerExtension UINavigationバーの外観の管理に専用されています、。

プロジェクトでRRViewControllerExtensionを使用する場合は、オーバーライドするだけです

-(BOOL)prefersNavigationBarTransparent;

あなたのviewcontrollerで。

透明なナビゲーションバー


-2
extension UINavigationBar {
var isTransperent: Bool {
        get {
            return false // Just to satisfy property
        }
        set {
            if newValue == true {
                self.shadowImage   = UIImage()
                self.isTranslucent = true
                self.setBackgroundImage(UIImage(), for: .default)
            }else{
                self.shadowImage   = UIImage()
                self.isTranslucent = false
                self.setBackgroundImage(nil, for: .default)
            }
        }
    }
}
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.