Alle Open-Source-Pakete
UISwift

SwiftUI-Design-System-Pro

Design-Tokens, eine Theme-Engine und getestete SwiftUI-Komponenten für Apple-Plattformen

26SterneNeueste Version: v2.0.0Aktualisiert: 15. Oktober 2026
Plattformen:iOS 17macOS 14tvOS 17watchOS 10visionOS 1

Lizenz: MIT

DesignSystemPro ist ein Swift-Package für SwiftUI-Apps, die ein konsistentes Erscheinungsbild wollen, ohne es von Grund auf selbst zu bauen. Es enthält Design-Tokens (Farben, Typografie, Abstände, Rahmen, Schatten, Motion), eine Theme-Engine mit Light-, Dark-, Preset- und Brand-Themes sowie rund 40 auf den Tokens aufgebaute Komponenten-Views. Jedes Farb-Token trägt Light-, Dark- und High-Contrast-Werte, die Typografie folgt Dynamic Type, und ein Render-Test vergleicht jede Komponentengruppe im Light- und Dark-Mode mit gespeicherten Referenz-Fingerprints.

Funktionen

  • Zweischichtige Farb-Tokens: eine primitive Palette und semantische Rollen, jeweils mit Light-, Dark- und High-Contrast-Werten
  • Typografie-Tokens, die über dsTypography(_:) mit Dynamic Type skalieren
  • ThemeManager folgt dem System oder wendet ein Preset oder ein aus Markenfarben erzeugtes Theme an; Ihre Views lesen es mit @Environment(\.dsTheme)
  • Buttons, Textfelder (einschließlich Suche und OTP), Toggles, Checkboxes, Radios, Cards, Badges, Avatare, Toasts und Skeleton-Loader
  • ColorContrastUtility berechnet WCAG-Kontrastverhältnisse; Tests prüfen Fließtext und Labels gefüllter Buttons in beiden Farbschemas gegen WCAG AA
  • ThemeManager und DSToastManager sind @MainActor @Observable-Klassen mit public Initializern und lassen sich daher injizieren und testen
  • Ein Package für iOS, macOS, tvOS, watchOS und visionOS ohne Laufzeitabhängigkeiten, gebaut im Swift-6-Language-Mode

Schnellstart

swift
1import DesignSystemPro
2import SwiftUI
3 
4struct ContentView: View {
5    @State private var notificationsOn = true
6 
7    var body: some View {
8        VStack(spacing: SpacingTokens.Content.comfortable) {
9            Text("Hello, DesignSystemPro")
10                .dsTypography(TypographyTokens.Heading.h2)
11 
12            DSStatusBadge("Ready", variant: .success)
13 
14            DSToggle(isOn: $notificationsOn, label: "Notifications")
15 
16            DSButton("Continue", isFullWidth: true) {
17                notificationsOn.toggle()
18            }
19        }
20        .padding(SpacingTokens.Layout.screenEdge)
21    }
22}

Installation

Swift Package Manager

swift
1dependencies: [
2    .package(url: "https://github.com/muhittincamdali/SwiftUI-Design-System-Pro.git", from: "2.0.0")
3],
4targets: [
5    .target(name: "YourApp", dependencies: [
6        .product(name: "DesignSystemPro", package: "SwiftUI-Design-System-Pro")
7    ])
8]

Xcode

text
1https://github.com/muhittincamdali/SwiftUI-Design-System-Pro.git

Screenshots

Komponenten-Screen der Beispiel-App im Light Mode
Komponenten-Screen der Beispiel-App im Dark Mode
DSButton-Varianten und -Größen, gerendert im Light Mode
DSButton-Varianten und -Größen, gerendert im Dark Mode
Badges und Avatare im Light Mode
Badges und Avatare im Dark Mode
Card-Komponenten im Light Mode
Toggles, Checkboxes und Radio-Buttons im Light Mode
Toasts und Skeleton-Loader im Dark Mode

Zeitleiste

  1. Repository eröffnet mit den ersten Views DSButton und DSCard

  2. 1.0.0 getaggt; der Token-, Theme-Engine- und Komponentencode, auf dem 2.0 basiert, wurde geschrieben

  3. Ein Aufräumen ersetzte den Großteil des Quellcodes durch Platzhalterdateien

  4. Als 2.0.0 neu aufgebaut: Tokens, Theme-Engine und Komponenten wiederhergestellt, korrigiert und mit Swift-Testing-Suites abgedeckt

Links

GitHub-RepositoryDokumentationSPM: https://github.com/muhittincamdali/SwiftUI-Design-System-Pro.git

Verwandter Artikel

Artikel lesen