So entfernen Sie die untere Linie der UINavigationBar: 3 funktionierende Methoden

Einleitung: Warum diese verdammte Linie Entwicklern den Schlaf raubt?

Wenn Sie jemals versucht haben, das Design einer App „wie in Apple Music“ oder „wie in Telegram“ zu gestalten – sind Sie bestimmt darauf gestoßen. Sie erstellen eine perfekte UINavigationBar mit einem schönen Farbverlauf, Transparenz oder einer benutzerdefinierten Farbe, starten den Simulator – und sehen diese dünne graue oder schwarze Linie (1 Pixel) unten. Sie sieht aus wie ein Artefakt, wie Schmutz auf Glas. Und ja, sie nervt.

Diese 1px-Linie ist kein Fehler, sondern ein Feature. Es ist shadowImage + backgroundImage, die Apple aus irgendeinem Grund standardmäßig belassen hat. Selbst in iOS 17 erscheint sie noch, wenn Sie dem System nicht sagen: „Hey, entferne das“. Die Frage auf Stack Overflow zu diesem Thema hat tausende Aufrufe und Dutzende Antworten. Das zeigt, dass das Thema wirklich schmerzhaft ist.

In diesem Artikel zeige ich 3 funktionierende Ansätze in Swift, um die untere Linie der UINavigationBar auszublenden. Wir werden sowohl alte Methoden (iOS 13-) als auch moderne über UINavigationBarAppearance behandeln. Los geht's!

Methode 1: Klassiker – über backgroundImage und shadowImage

Die älteste und bewährteste Methode. Sie funktioniert seit iOS 5 (ja, aus der Zeit, als Skeuomorphismus noch in Mode war). Die Idee ist einfach: Wir setzen ein leeres Bild als Hintergrund und Schatten.

Schritt 1: Ein leeres Bild erstellen

extension UIImage {\n    static func pixelImage(withColor color: UIColor = .clear) -> UIImage {\n        let rect = CGRect(x: 0, y: 0, width: 1, height: 1)\n        UIGraphicsBeginImageContext(rect.size)\n        color.setFill()\n        UIRectFill(rect)\n        let image = UIGraphicsGetImageFromCurrentImageContext()\n        UIGraphicsEndImageContext()\n        return image ?? UIImage()\n    }\n}

Schritt 2: Auf die navigationBar anwenden

func hideBottomLine() {\n    let emptyImage = UIImage.pixelImage()\n    navigationController?.navigationBar.setBackgroundImage(emptyImage, for: .default)\n    navigationController?.navigationBar.shadowImage = emptyImage\n}

Vorteile: Funktioniert überall, sogar auf alten iOS-Versionen.
\nNachteile: Funktioniert nicht immer korrekt mit scrollEdgeAppearance und großen Titeln. Wenn Sie eine UISearchBar haben – die Linie kann zurückkommen.

Methode 2: Modern – über UINavigationBarAppearance (iOS 13+)

Ab iOS 13 hat Apple UINavigationBarAppearance eingeführt. Dies ist ein einheitliches Objekt, das alle Zustände verwaltet: Standard, Scrollen und Kompakt. Ideal für diejenigen, die „einmal einstellen und vergessen“ wollen.

Vollständiges Beispiel für UIViewController

func setupTransparentNavigationBar() {\n    let appearance = UINavigationBarAppearance()\n    appearance.configureWithTransparentBackground()\n    appearance.backgroundColor = .clear\n    appearance.shadowColor = .clear  // entfernt die Linie\n    \n    navigationController?.navigationBar.standardAppearance = appearance\n    navigationController?.navigationBar.scrollEdgeAppearance = appearance\n    navigationController?.navigationBar.compactAppearance = appearance\n}

Beachten Sie: shadowColor = .clear – das ist die entscheidende Zeile. Wenn Sie sie nicht schreiben, bleibt die Linie. configureWithTransparentBackground() macht den Hintergrund transparent, berührt aber den Schatten nicht.

Wenn Sie einen farbigen Hintergrund, aber keine Linie möchten:

let appearance = UINavigationBarAppearance()\nappearance.configureWithOpaqueBackground()\nappearance.backgroundColor = .systemBlue\nappearance.shadowColor = .clear\n\nnavigationController?.navigationBar.standardAppearance = appearance\nnavigationController?.navigationBar.scrollEdgeAppearance = appearance

Vorteile: Sauberer Code, leicht kombinierbar mit großen Titeln und Suche.
\nNachteile: Nur iOS 13+. Wenn das Projekt iOS 12 unterstützt – müssen Sie