From c53a320698c17d98477c0384f1f644da9735f645 Mon Sep 17 00:00:00 2001 From: Christian Cleberg Date: Sat, 14 Mar 2026 09:56:39 -0500 Subject: implement more learning categories --- AnimalCard.swift | 103 +++++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 103 insertions(+) create mode 100644 AnimalCard.swift (limited to 'AnimalCard.swift') diff --git a/AnimalCard.swift b/AnimalCard.swift new file mode 100644 index 0000000..2207d45 --- /dev/null +++ b/AnimalCard.swift @@ -0,0 +1,103 @@ +// +// AnimalCard.swift +// DayByDay +// + +import SwiftUI + +/// A single large, colorful card representing one animal. +/// Tapping the card plays a bounce animation and speaks the animal name aloud. +struct AnimalCard: View { + let animal: LearnAnimal + @State private var isTapped = false + + var body: some View { + ZStack { + RoundedRectangle(cornerRadius: 32, style: .continuous) + .fill(animal.color.gradient) + .shadow(color: animal.color.opacity(0.4), radius: 8, y: 4) + + VStack(spacing: 16) { + Image(systemName: animal.symbol) + .font(.system(size: 64)) + .foregroundStyle(.white) + .symbolRenderingMode(.hierarchical) + + Text(animal.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(animal.name) + DispatchQueue.main.asyncAfter(deadline: .now() + 0.4) { + isTapped = false + } + } + .accessibilityLabel(animal.name) + .accessibilityAddTraits(.isButton) + } +} + +// MARK: - Animal model + +enum LearnAnimal: Int, CaseIterable, Identifiable { + case cat, dog, bird, fish, rabbit, turtle, ladybug, ant, lizard + + var id: Int { rawValue } + + var name: String { + switch self { + case .cat: "Cat" + case .dog: "Dog" + case .bird: "Bird" + case .fish: "Fish" + case .rabbit: "Rabbit" + case .turtle: "Turtle" + case .ladybug: "Ladybug" + case .ant: "Ant" + case .lizard: "Lizard" + } + } + + var symbol: String { + switch self { + case .cat: "cat.fill" + case .dog: "dog.fill" + case .bird: "bird.fill" + case .fish: "fish.fill" + case .rabbit: "hare.fill" + case .turtle: "tortoise.fill" + case .ladybug: "ladybug.fill" + case .ant: "ant.fill" + case .lizard: "lizard.fill" + } + } + + var color: Color { + switch self { + case .cat: Color(red: 0.9, green: 0.55, blue: 0.2) // orange + case .dog: Color(red: 0.6, green: 0.45, blue: 0.3) // brown + case .bird: Color(red: 0.3, green: 0.65, blue: 0.9) // sky blue + case .fish: Color(red: 0.2, green: 0.75, blue: 0.8) // teal + case .rabbit: Color(red: 0.75, green: 0.6, blue: 0.8) // lavender + case .turtle: Color(red: 0.35, green: 0.7, blue: 0.4) // green + case .ladybug: Color(red: 0.9, green: 0.25, blue: 0.25) // red + case .ant: Color(red: 0.3, green: 0.3, blue: 0.3) // dark gray + case .lizard: Color(red: 0.45, green: 0.75, blue: 0.35) // lime + } + } +} + +#Preview { + HStack(spacing: 24) { + AnimalCard(animal: .cat) + .frame(width: 200, height: 260) + } + .padding() +} -- cgit v1.2.3