From 5517b7a3db5dbd3cad8d724edc3ce179fa774d63 Mon Sep 17 00:00:00 2001 From: Junwei Zhao Date: Sat, 1 Mar 2025 22:02:08 +1100 Subject: [PATCH] Update clock position --- image-flow/ContentView.swift | 41 ++++++++++++++++++++---------------- 1 file changed, 23 insertions(+), 18 deletions(-) diff --git a/image-flow/ContentView.swift b/image-flow/ContentView.swift index 10254a4..069bfff 100644 --- a/image-flow/ContentView.swift +++ b/image-flow/ContentView.swift @@ -106,7 +106,7 @@ struct ContentView: View { Section("Clock Position") { ClockPositionGrid(selectedPosition: $clockPosition) - .frame(height: 280) + .frame(height: 240) .padding(.vertical, 8) } @@ -225,15 +225,15 @@ enum ClockPosition: String, CaseIterable { var icon: String { switch self { - case .topCenter: return "arrow.up.to.line" - case .topLeft: return "arrow.up.left.to.line" - case .topRight: return "arrow.up.right.to.line" - case .centerLeft: return "arrow.left.to.line" + case .topCenter: return "arrow.up" + case .topLeft: return "arrow.up.left" + case .topRight: return "arrow.up.right" + case .centerLeft: return "arrow.left" case .center: return "plus" - case .centerRight: return "arrow.right.to.line" - case .bottomCenter: return "arrow.down.to.line" - case .bottomLeft: return "arrow.down.left.to.line" - case .bottomRight: return "arrow.down.right.to.line" + case .centerRight: return "arrow.right" + case .bottomCenter: return "arrow.down" + case .bottomLeft: return "arrow.down.left" + case .bottomRight: return "arrow.down.right" } } } @@ -268,22 +268,25 @@ struct ClockPositionGrid: View { ForEach(row, id: \.self) { position in Button(action: { selectedPosition = position + // Add haptic feedback + let generator = UIImpactFeedbackGenerator(style: .medium) + generator.impactOccurred() }) { ZStack { RoundedRectangle(cornerRadius: 12) - .fill(selectedPosition == position ? Color.blue : Color.gray.opacity(0.2)) - .frame(width: 65, height: 65) + .fill(selectedPosition == position ? Color.blue : Color.gray.opacity(0.15)) + .frame(maxWidth: .infinity, maxHeight: .infinity) - VStack(spacing: 4) { + VStack(spacing: 6) { Image(systemName: position.icon) - .font(.system(size: 24)) + .font(.system(size: 24, weight: .semibold)) .foregroundColor(selectedPosition == position ? Color.white : Color.primary) Text(position.displayName) - .font(.caption2) + .font(.caption) + .fontWeight(selectedPosition == position ? .medium : .regular) .foregroundColor(selectedPosition == position ? Color.white : Color.primary) .lineLimit(1) - .minimumScaleFactor(0.8) } .padding(.horizontal, 4) } @@ -291,15 +294,17 @@ struct ClockPositionGrid: View { .buttonStyle(PlainButtonStyle()) .overlay( RoundedRectangle(cornerRadius: 12) - .stroke(selectedPosition == position ? Color.blue : Color.clear, lineWidth: 2) + .stroke(selectedPosition == position ? Color.blue.opacity(0.8) : Color.gray.opacity(0.3), lineWidth: selectedPosition == position ? 2 : 1) ) - .shadow(color: selectedPosition == position ? Color.blue.opacity(0.5) : Color.clear, radius: 4) + .shadow(color: selectedPosition == position ? Color.blue.opacity(0.4) : Color.clear, radius: 3, x: 0, y: 1) + .animation(.easeInOut(duration: 0.2), value: selectedPosition) } } + .frame(maxWidth: .infinity, maxHeight: .infinity) } } .padding() - .background(Color.gray.opacity(0.1)) + .background(Color.gray.opacity(0.08)) .cornerRadius(16) } }