ScarriffleandClaude Opus 5
fccec1217b
Die System-Seitenleiste sitzt auf dem iPad als schwebende Fläche und auf dem Mac angeklebt am Fensterrand. `preferredLayout = .overlap` ist die dafür vorgesehene Bitte, und macOS verwirft sie stillschweigend — gemessen, nicht vermutet. Statt deshalb die ganze Navigation neu zu bauen, bleibt der `TabView` stehen und verliert nur sein Kleid: `TabChromeSuppressor` blendet Seiten- und Tableiste aus, gezeichnet wird darüber. Auswahl, ein eigener Navigationsstapel je Eintrag, erhaltener Scrollstand beim Wechseln — all das macht weiter das System. Dass das Ausblenden geht, war kein Ratschluss: derselbe Griff hatte die Leiste vorher schon versuchsweise verschwinden lassen. Neu sind `FlixySidebar` (schwebende Fläche mit eigenem Rand, Mediatheken einklappbar, Konto unten) und `FlixyTopBar` (dieselben Einträge als Leiste oben, Mediatheken als Menü, weil oben der Platz waagerecht begrenzt ist). Das iPhone bleibt beim System: dort gibt es keine Seitenleiste, sondern die Leiste unten, und die ist überall dieselbe. Der Platz für die Leiste ist ein **Sicherheitsrand**, kein Abstand, und er hängt je Bildschirm — weder `TabView` noch `NavigationStack` reichen ihn an ihren Inhalt weiter. Damit bleibt eine Reihe fensterbreit und schiebt ihre Kacheln beim Wischen hinter die Leiste, stellt aber im Ruhezustand keine dorthin. Der Aufmacher darf über seinen Bereich hinaus; das `.clipped()` im Karussell musste dafür weichen, es schnitt genau das ab. Noch nicht dabei: „Bearbeiten" mit Ziehen und Ein-/Ausblenden. Die Einträge stehen in fester Reihenfolge. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
88 lines
3.9 KiB
Swift
88 lines
3.9 KiB
Swift
import SwiftUI
|
|
|
|
/// Die Schriftskala der App.
|
|
///
|
|
/// Auf iOS die Systemstile, damit Dynamic Type wirkt. Die Rolle steht im
|
|
/// Namen, nicht die Größe — sonst führt jede Anpassung zu einer Suche quer
|
|
/// durch alle Views.
|
|
///
|
|
/// **Auf dem Mac stehen feste Größen.** Dieselben Stile sind dort deutlich
|
|
/// kleiner: `largeTitle` misst 26 Punkt statt 34, `body` 13 statt 17. Eine
|
|
/// Oberfläche, die auf dem iPad stimmt, wirkt damit auf dem Mac zusammen-
|
|
/// geschrumpft — und genau das war sie. Die Zahlen hier sind die von iOS.
|
|
///
|
|
/// Das kostet auf dem Mac Dynamic Type. Das ist vertretbar: macOS hat keine
|
|
/// systemweite Textgrößen-Einstellung, auf die Apps reagieren müssten, und ein
|
|
/// Fenster lässt sich stattdessen größer ziehen.
|
|
extension Font {
|
|
#if os(macOS)
|
|
/// Der Titel im Aufmacher-Bild.
|
|
public static let flixyHero = Font.system(size: 34, weight: .bold)
|
|
/// Titel auf Detailseiten.
|
|
public static let flixyTitle = Font.system(size: 22, weight: .semibold)
|
|
/// Überschrift einer Reihe auf der Startseite.
|
|
public static let flixyRowHeader = Font.system(size: 17, weight: .semibold)
|
|
/// Titel unter einem Poster.
|
|
public static let flixyCardTitle = Font.system(size: 15, weight: .medium)
|
|
/// Fließtext, Beschreibungen.
|
|
public static let flixyBody = Font.system(size: 17)
|
|
/// Jahreszahl, Laufzeit, Auflösung — alles, was neben dem Titel steht.
|
|
public static let flixyCaption = Font.system(size: 12)
|
|
#else
|
|
/// Der Titel im Aufmacher-Bild.
|
|
public static let flixyHero = Font.system(.largeTitle, design: .default, weight: .bold)
|
|
/// Titel auf Detailseiten.
|
|
public static let flixyTitle = Font.system(.title2, design: .default, weight: .semibold)
|
|
/// Überschrift einer Reihe auf der Startseite.
|
|
public static let flixyRowHeader = Font.system(.headline, design: .default, weight: .semibold)
|
|
/// Titel unter einem Poster.
|
|
public static let flixyCardTitle = Font.system(.subheadline, design: .default, weight: .medium)
|
|
/// Fließtext, Beschreibungen.
|
|
public static let flixyBody = Font.system(.body)
|
|
/// Jahreszahl, Laufzeit, Auflösung — alles, was neben dem Titel steht.
|
|
public static let flixyCaption = Font.system(.caption)
|
|
#endif
|
|
}
|
|
|
|
/// Abstände.
|
|
///
|
|
/// Eine Skala statt frei gewählter Zahlen: dadurch stimmen die Ränder zwischen
|
|
/// Bildschirmen überein, ohne dass man sie einzeln nachmisst.
|
|
public enum FlixySpacing {
|
|
public static let tight: CGFloat = 4
|
|
public static let snug: CGFloat = 8
|
|
public static let regular: CGFloat = 12
|
|
public static let loose: CGFloat = 16
|
|
public static let section: CGFloat = 24
|
|
/// Der seitliche Rand des Inhalts zum Bildschirmrand.
|
|
public static let screenMargin: CGFloat = 16
|
|
}
|
|
|
|
public enum FlixyRadius {
|
|
public static let card: CGFloat = 8
|
|
public static let sheet: CGFloat = 16
|
|
public static let control: CGFloat = 10
|
|
/// Eine schwebende Fläche — die Seitenleiste. So rund wie das System sie
|
|
/// auf dem iPad zeichnet; daran misst sich der Nachbau.
|
|
public static let panel: CGFloat = 22
|
|
}
|
|
|
|
/// Die Seitenverhältnisse, in denen Plex seine Bilder liefert.
|
|
///
|
|
/// An einer Stelle, weil ein falscher Wert nicht auffällt, sondern nur
|
|
/// beschneidet: ein 16:9-Hintergrundbild in einem 3:4-Rahmen verliert links
|
|
/// und rechts je ein Viertel, und man sieht dem Ergebnis nicht an, dass etwas
|
|
/// fehlt.
|
|
public enum FlixyAspectRatio {
|
|
/// Kinoplakate im Hochformat.
|
|
public static let poster: CGFloat = 2.0 / 3.0
|
|
/// Szenenbilder und Hintergrundbilder.
|
|
public static let landscape: CGFloat = 16.0 / 9.0
|
|
/// Der Aufmacher auf der Startseite — dasselbe wie `landscape`, weil Plex
|
|
/// dafür `art` liefert.
|
|
public static let hero: CGFloat = landscape
|
|
/// Sendersymbole. Breiter als hoch, weil Senderlogos Schriftzüge sind —
|
|
/// quadratisch beschnitten fehlt der halbe Name.
|
|
public static let channelLogo: CGFloat = 5.0 / 3.0
|
|
}
|