diff options
| author | Christian Cleberg <[email protected]> | 2026-03-14 09:56:39 -0500 |
|---|---|---|
| committer | Christian Cleberg <[email protected]> | 2026-03-14 09:56:39 -0500 |
| commit | c53a320698c17d98477c0384f1f644da9735f645 (patch) | |
| tree | 9c59fa0a2b2840d4531c562e79a89ed526096874 /WeatherCard.swift | |
| parent | 8e4dea12423d7de762d665d58ab31abb1fe1d4f0 (diff) | |
| download | daybyday-c53a320698c17d98477c0384f1f644da9735f645.tar.gz daybyday-c53a320698c17d98477c0384f1f644da9735f645.tar.bz2 daybyday-c53a320698c17d98477c0384f1f644da9735f645.zip | |
implement more learning categories
Diffstat (limited to 'WeatherCard.swift')
| -rw-r--r-- | WeatherCard.swift | 102 |
1 files changed, 102 insertions, 0 deletions
diff --git a/WeatherCard.swift b/WeatherCard.swift new file mode 100644 index 0000000..8b12786 --- /dev/null +++ b/WeatherCard.swift @@ -0,0 +1,102 @@ +// +// WeatherCard.swift +// DayByDay +// + +import SwiftUI + +/// A single large, colorful card representing one weather type. +/// Tapping the card plays a bounce animation and speaks the weather name aloud. +struct WeatherCard: View { + let weather: LearnWeather + @State private var isTapped = false + + var body: some View { + ZStack { + RoundedRectangle(cornerRadius: 32, style: .continuous) + .fill(weather.color.gradient) + .shadow(color: weather.color.opacity(0.4), radius: 8, y: 4) + + VStack(spacing: 16) { + Image(systemName: weather.symbol) + .font(.system(size: 64)) + .foregroundStyle(.white) + .symbolRenderingMode(.hierarchical) + + Text(weather.name) + .font(.system(size: 32, weight: .bold, design: .rounded)) + .foregroundStyle(.white) + } + } + .scaleEffect(isTapped ? 1.12 : 1.0) + .contentShape(RoundedRectangle(cornerRadius: 32, style: .continuous)) + .rotation3DEffect(.degrees(isTapped ? 6 : 0), axis: (x: 1, y: 0, z: 0)) + .animation(.spring(response: 0.35, dampingFraction: 0.5), value: isTapped) + .onTapGesture { + isTapped = true + SpeechSynthesizer.shared.speak(weather.name) + DispatchQueue.main.asyncAfter(deadline: .now() + 0.4) { + isTapped = false + } + } + .accessibilityLabel(weather.name) + .accessibilityAddTraits(.isButton) + } +} + +// MARK: - Weather model + +enum LearnWeather: Int, CaseIterable, Identifiable { + case sunny, cloudy, rainy, snowy, windy, stormy, foggy, rainbow + + var id: Int { rawValue } + + var name: String { + switch self { + case .sunny: "Sunny" + case .cloudy: "Cloudy" + case .rainy: "Rainy" + case .snowy: "Snowy" + case .windy: "Windy" + case .stormy: "Stormy" + case .foggy: "Foggy" + case .rainbow: "Rainbow" + } + } + + var symbol: String { + switch self { + case .sunny: "sun.max.fill" + case .cloudy: "cloud.fill" + case .rainy: "cloud.rain.fill" + case .snowy: "cloud.snow.fill" + case .windy: "wind" + case .stormy: "cloud.bolt.rain.fill" + case .foggy: "cloud.fog.fill" + case .rainbow: "rainbow" + } + } + + var color: Color { + switch self { + case .sunny: Color(red: 1.0, green: 0.7, blue: 0.2) // orange + case .cloudy: Color(red: 0.6, green: 0.6, blue: 0.65) // gray + case .rainy: Color(red: 0.3, green: 0.6, blue: 0.9) // blue + case .snowy: Color(red: 0.55, green: 0.8, blue: 0.95) // light blue + case .windy: Color(red: 0.25, green: 0.7, blue: 0.7) // teal + case .stormy: Color(red: 0.2, green: 0.3, blue: 0.6) // dark blue + case .foggy: Color(red: 0.6, green: 0.5, blue: 0.7) // muted purple + case .rainbow: Color(red: 0.9, green: 0.45, blue: 0.6) // pink + } + } +} + +#Preview { + HStack(spacing: 24) { + WeatherCard(weather: .sunny) + .frame(width: 200, height: 260) + WeatherCard(weather: .stormy) + .frame(width: 200, height: 260) + } + .padding() +} |
