chore: 完成部分svg资源替换

This commit is contained in:
Junhui Chen 2025-09-10 18:57:41 +08:00
parent b036f3d18e
commit 17dc5bbe5e
8 changed files with 124 additions and 53 deletions

File diff suppressed because one or more lines are too long

View File

@ -315,8 +315,9 @@ struct BlindBoxView: View {
HStack { HStack {
// //
Button(action: showUserProfile) { Button(action: showUserProfile) {
SVGImage(svgName: "User") Image(systemName: "line.3.horizontal")
.frame(width: 24, height: 24) .font(.system(size: 20, weight: .regular))
.foregroundColor(.primary)
.padding(13) // Increases tap area while keeping visual size .padding(13) // Increases tap area while keeping visual size
.contentShape(Rectangle()) // Makes the padded area tappable .contentShape(Rectangle()) // Makes the padded area tappable
} }
@ -392,19 +393,11 @@ struct BlindBoxView: View {
.animation(.easeOut(duration: 1.5), value: showScalingOverlay) .animation(.easeOut(duration: 1.5), value: showScalingOverlay)
} }
if mediaType == .all && !showScalingOverlay { if mediaType == .all && !showScalingOverlay {
ZStack { BlindCountBadge(text: "\(viewModel.blindCount?.availableQuantity ?? 0) Boxes")
SVGImage(svgName: "BlindCount") .position(x: UIScreen.main.bounds.width * 0.7,
.frame(width: 100, height: 60) y: UIScreen.main.bounds.height * 0.18)
.opacity(showScalingOverlay ? 0 : 1)
Text("\(viewModel.blindCount?.availableQuantity ?? 0) Boxes") .animation(.easeOut(duration: 1.5), value: showScalingOverlay)
.font(Typography.font(for: .body, family: .quicksandBold))
.foregroundColor(.white)
.offset(x: 6, y: -18)
}
.position(x: UIScreen.main.bounds.width * 0.7,
y: UIScreen.main.bounds.height * 0.18)
.opacity(showScalingOverlay ? 0 : 1)
.animation(.easeOut(duration: 1.5), value: showScalingOverlay)
} }
if !showScalingOverlay { if !showScalingOverlay {
VStack(spacing: 20) { VStack(spacing: 20) {
@ -654,6 +647,24 @@ struct BlindBoxView: View {
showModal = false showModal = false
} }
} }
// MARK: - SwiftUI
private struct BlindCountBadge: View {
let text: String
var body: some View {
Text(text)
.font(Typography.font(for: .body, family: .quicksandBold))
.foregroundColor(.white)
.padding(.horizontal, 12)
.padding(.vertical, 8)
.background(
Capsule()
.fill(Color.black)
.shadow(color: Color.black.opacity(0.15), radius: 4, x: 0, y: 2)
)
}
}
/// ///
private func hideSettings() { private func hideSettings() {

View File

@ -93,8 +93,9 @@ struct AvatarUploader: View {
Color.gray.opacity(0.1) Color.gray.opacity(0.1)
.frame(width: size, height: size) .frame(width: size, height: size)
.overlay( .overlay(
SVGImage(svgName: "Avatar") Image(systemName: "person.crop.circle")
.frame(width: size * 0.8, height: size * 0.8) .font(.system(size: size * 0.5))
.foregroundColor(.gray)
) )
.clipShape(RoundedRectangle(cornerRadius: size * 0.1)) .clipShape(RoundedRectangle(cornerRadius: size * 0.1))
.overlay( .overlay(

View File

@ -157,9 +157,9 @@ struct UserProfileModal: View {
Router.shared.navigate(to: .mediaUpload) Router.shared.navigate(to: .mediaUpload)
}) { }) {
HStack(spacing: 16) { HStack(spacing: 16) {
SVGImage(svgName: "Upload") Image(systemName: "tray.and.arrow.up")
.font(.system(size: 20, weight: .regular))
.foregroundColor(.orange) .foregroundColor(.orange)
.frame(width: 20, height: 20)
Text("Upload Resources") Text("Upload Resources")
.font(Typography.font(for: .body)) .font(Typography.font(for: .body))
@ -179,9 +179,9 @@ struct UserProfileModal: View {
Router.shared.navigate(to: .memories) Router.shared.navigate(to: .memories)
}) { }) {
HStack(spacing: 16) { HStack(spacing: 16) {
SVGImage(svgName: "Memory") Image(systemName: "photo.on.rectangle")
.font(.system(size: 20, weight: .regular))
.foregroundColor(.orange) .foregroundColor(.orange)
.frame(width: 20, height: 20)
Text("My Memories") Text("My Memories")
.font(Typography.font(for: .body)) .font(Typography.font(for: .body))
@ -225,9 +225,9 @@ struct UserProfileModal: View {
} }
}) { }) {
HStack(spacing: 16) { HStack(spacing: 16) {
SVGImage(svgName: "Set") Image(systemName: "gearshape")
.font(.system(size: 20, weight: .regular))
.foregroundColor(.orange) .foregroundColor(.orange)
.frame(width: 20, height: 20)
Text("Setting") Text("Setting")
.font(Typography.font(for: .body)) .font(Typography.font(for: .body))

View File

@ -125,9 +125,10 @@ struct MediaUploadView: View {
/// ///
private var uploadHintView: some View { private var uploadHintView: some View {
HStack (spacing: 6) { HStack (spacing: 6) {
SVGImage(svgName: "Tips") Image(systemName: "lightbulb")
.frame(width: 16, height: 16) .font(.system(size: 16, weight: .regular))
.padding(.leading,6) .foregroundColor(.themeTextMessageMain)
.padding(.leading,6)
Text("The upload process will take approximately 2 minutes. Thank you for your patience.") Text("The upload process will take approximately 2 minutes. Thank you for your patience.")
.font(.caption) .font(.caption)
.foregroundColor(.black) .foregroundColor(.black)
@ -601,26 +602,28 @@ struct UploadPromptView: View {
var body: some View { var body: some View {
Button(action: { showMediaPicker = true }) { Button(action: { showMediaPicker = true }) {
// ZStack {
SVGImageHtml(svgName: "IP") RoundedRectangle(cornerRadius: 20)
.frame(width: 225, height: 225) .fill(Color.white)
.contentShape(Rectangle()) .frame(width: 225, height: 225)
.overlay( }
ZStack { .contentShape(Rectangle())
RoundedRectangle(cornerRadius: 20) .overlay(
.stroke(style: StrokeStyle( ZStack {
lineWidth: 5, RoundedRectangle(cornerRadius: 20)
lineCap: .round, .stroke(style: StrokeStyle(
dash: [12, 8] lineWidth: 5,
)) lineCap: .round,
.foregroundColor(Color.themePrimary) dash: [12, 8]
))
// Add plus icon in the center .foregroundColor(Color.themePrimary)
Image(systemName: "plus")
.font(.system(size: 32, weight: .bold)) // Add plus icon in the center
.foregroundColor(.black) Image(systemName: "plus")
} .font(.system(size: 32, weight: .bold))
) .foregroundColor(.black)
}
)
} }
} }
} }

View File

@ -85,8 +85,9 @@ struct UserInfo: View {
.zIndex(1) // .zIndex(1) //
// Dynamic text that changes based on keyboard state // Dynamic text that changes based on keyboard state
HStack(spacing: 6) { HStack(spacing: 6) {
SVGImage(svgName: "Tips") Image(systemName: "lightbulb")
.frame(width: 16, height: 16) .font(.system(size: 16, weight: .regular))
.foregroundColor(.themeTextMessageMain)
.padding(.leading,6) .padding(.leading,6)
Text("Choose a photo as your avatar, and we'll generate a video mystery box for you.") Text("Choose a photo as your avatar, and we'll generate a video mystery box for you.")
.font(Typography.font(for: .caption)) .font(Typography.font(for: .caption))

View File

@ -109,8 +109,10 @@ struct SettingsView: View {
Button(action: action) { Button(action: action) {
HStack { HStack {
// //
SVGImage(svgName: icon) Image(systemName: systemSymbol(for: icon))
.frame(width: 22, height: 22) .font(.system(size: 18, weight: .regular))
.foregroundColor(.primary)
.frame(width: 22, height: 22)
// //
Text(title) Text(title)
@ -130,9 +132,26 @@ struct SettingsView: View {
.listRowBackground(Color.white) .listRowBackground(Color.white)
.listRowSeparator(.hidden) .listRowSeparator(.hidden)
} }
// SVG
private func systemSymbol(for icon: String) -> String {
switch icon {
case "Account":
return "person.circle"
case "Permission":
return "lock.rectangle"
case "Suport":
return "headphones"
case "AboutUs":
return "info.circle"
default:
return "questionmark.circle"
}
}
} }
// MARK: - // MARK: -
#Preview { #Preview {
SettingsView(isPresented: .constant(true)) SettingsView(isPresented: .constant(true))
} }

View File

@ -63,8 +63,8 @@ struct SubscriptionStatusBar: View {
var body: some View { var body: some View {
ZStack(alignment: .leading) { ZStack(alignment: .leading) {
// Background SVG - First layer // SwiftUI
SVGImage(svgName: status.backgroundImageName) SubscriptionBackground(status: status)
.frame(maxWidth: .infinity, minHeight: 120) .frame(maxWidth: .infinity, minHeight: 120)
.clipped() .clipped()
@ -107,6 +107,42 @@ struct SubscriptionStatusBar: View {
} }
} }
// MARK: -
private struct SubscriptionBackground: View {
let status: SubscriptionStatus
var body: some View {
ZStack(alignment: .topTrailing) {
RoundedRectangle(cornerRadius: 20)
.fill(background)
.shadow(color: Color.black.opacity(0.06), radius: 10, x: 0, y: 6)
//
if case .pioneer = status {
Circle()
.fill(Color.black.opacity(0.08))
.frame(width: 90, height: 90)
.offset(x: 12, y: -12)
} else {
Circle()
.fill(Color.black.opacity(0.04))
.frame(width: 70, height: 70)
.offset(x: 12, y: -12)
}
}
.clipShape(RoundedRectangle(cornerRadius: 20))
}
private var background: some ShapeStyle {
switch status {
case .free:
return LinearGradient(colors: [Color.white, Color.white.opacity(0.96)], startPoint: .topLeading, endPoint: .bottomTrailing)
case .pioneer:
return LinearGradient(colors: [Color.themePrimary.opacity(0.85), Color.orange.opacity(0.6)], startPoint: .topLeading, endPoint: .bottomTrailing)
}
}
}
// MARK: - // MARK: -
#Preview { #Preview {
VStack(spacing: 20) { VStack(spacing: 20) {