feat(ios): 浅色/深色切换图标 + ZXSettingRow 支持自定义图标

- 新增 icon-sun(太阳)/ icon-moon(月亮)双色图标
- ZXSettingRow 新增 isCustom 参数支持 Asset 图片
- SettingsView 外观行根据当前模式切换图标

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
This commit is contained in:
wangdl 2026-05-30 09:27:28 +08:00
parent 5c1cb556b9
commit 0b2aafe045
5 changed files with 8 additions and 3 deletions

View File

@ -0,0 +1 @@
{"images":[{"filename":"icon-moon.svg","idiom":"universal"}],"info":{"author":"xcode","version":1},"properties":{"template-rendering-intent":"template","preserves-vector-representation":true}}

View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="24" height="24" viewBox="0 0 24 24" fill="none"><path d="M12 6.50104C8.96243 6.50104 6.5 8.96347 6.5 12.001C6.5 15.0386 8.96243 17.501 12 17.501C15.0376 17.501 17.5 15.0386 17.5 12.001C17.5 8.96347 15.0376 6.50104 12 6.50104ZM5 12.001C5 8.13504 8.13401 5.00104 12 5.00104C15.866 5.00104 19 8.13504 19 12.001C19 15.867 15.866 19.001 12 19.001C8.13401 19.001 5 15.867 5 12.001Z" fill-rule="evenodd" fill="#000000"></path><path d="M12 1.93146C12.4142 1.93146 12.75 2.26724 12.75 2.68146L12.75 3.43146C12.75 3.84567 12.4142 4.18146 12 4.18146C11.5858 4.18146 11.25 3.84567 11.25 3.43146L11.25 2.68146C11.25 2.26724 11.5858 1.93146 12 1.93146Z" fill-rule="evenodd" fill="#AEAEAE"></path><path d="M19.1203 19.1213C18.8274 19.4142 18.3525 19.4142 18.0596 19.1213L17.5293 18.5909C17.2364 18.298 17.2364 17.8232 17.5293 17.5303C17.8222 17.2374 18.2971 17.2374 18.59 17.5303L19.1203 18.0606C19.4132 18.3535 19.4132 18.8284 19.1203 19.1213Z" fill-rule="evenodd" fill="#AEAEAE"></path><path d="M19.1203 4.88073C19.4132 5.17363 19.4132 5.6485 19.1203 5.94139L18.59 6.47172C18.2971 6.76462 17.8222 6.76462 17.5293 6.47172C17.2364 6.17883 17.2364 5.70396 17.5293 5.41106L18.0596 4.88073C18.3525 4.58784 18.8274 4.58784 19.1203 4.88073Z" fill-rule="evenodd" fill="#AEAEAE"></path><path d="M22.0696 12.001C22.0696 12.4153 21.7339 12.751 21.3196 12.751L20.5696 12.751C20.1554 12.751 19.8196 12.4153 19.8196 12.001C19.8196 11.5868 20.1554 11.251 20.5696 11.251L21.3196 11.251C21.7339 11.251 22.0696 11.5868 22.0696 12.001Z" fill-rule="evenodd" fill="#AEAEAE"></path><path d="M12 19.8206C12.4142 19.8206 12.75 20.1563 12.75 20.5706L12.75 21.3206C12.75 21.7348 12.4142 22.0706 12 22.0706C11.5858 22.0706 11.25 21.7348 11.25 21.3206L11.25 20.5706C11.25 20.1563 11.5858 19.8206 12 19.8206Z" fill-rule="evenodd" fill="#AEAEAE"></path><path d="M6.47077 6.47174C6.17788 6.76463 5.703 6.76463 5.41011 6.47174L4.87978 5.94141C4.58689 5.64851 4.58689 5.17364 4.87978 4.88075C5.17267 4.58785 5.64755 4.58785 5.94044 4.88075L6.47077 5.41108C6.76366 5.70397 6.76366 6.17884 6.47077 6.47174Z" fill-rule="evenodd" fill="#AEAEAE"></path><path d="M6.47076 17.5303C6.76365 17.8232 6.76365 18.298 6.47076 18.5909L5.94043 19.1213C5.64754 19.4142 5.17266 19.4142 4.87977 19.1213C4.58688 18.8284 4.58688 18.3535 4.87977 18.0606L5.4101 17.5303C5.70299 17.2374 6.17787 17.2374 6.47076 17.5303Z" fill-rule="evenodd" fill="#AEAEAE"></path><path d="M4.18048 12.001C4.18048 12.4153 3.84469 12.751 3.43048 12.751L2.68048 12.751C2.26627 12.751 1.93048 12.4153 1.93048 12.001C1.93048 11.5868 2.26627 11.251 2.68048 11.251L3.43048 11.251C3.84469 11.251 4.18048 11.5868 4.18048 12.001Z" fill-rule="evenodd" fill="#AEAEAE"></path></svg>

After

Width:  |  Height:  |  Size: 2.7 KiB

View File

@ -0,0 +1 @@
{"images":[{"filename":"icon-sun.svg","idiom":"universal"}],"info":{"author":"xcode","version":1},"properties":{"template-rendering-intent":"template","preserves-vector-representation":true}}

View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="24" height="24" viewBox="0 0 24 24" fill="none"><path d="M12 7.24976C9.37651 7.24976 7.24976 9.37651 7.24976 12C7.24976 14.6235 9.37651 16.7502 12 16.7502C14.6235 16.7502 16.7502 14.6235 16.7502 12C16.7502 9.37651 14.6235 7.24976 12 7.24976ZM5.74976 12C5.74976 8.54809 8.54809 5.74976 12 5.74976C15.4519 5.74976 18.2502 8.54809 18.2502 12C18.2502 15.4519 15.4519 18.2502 12 18.2502C8.54809 18.2502 5.74976 15.4519 5.74976 12Z" fill-rule="evenodd" fill="#000000"></path><path d="M11.5014 15.5221C9.77312 15.2797 8.44324 13.7952 8.44324 12C8.44324 10.2049 9.77312 8.72037 11.5014 8.47793C11.7749 8.43957 12 8.66712 12 8.94326L12 15.0568C12 15.3329 11.7749 15.5605 11.5014 15.5221Z" fill="#AEAEAE"></path><path d="M12 1.94318C12.4142 1.94318 12.75 2.27896 12.75 2.69318L12.75 3.69318C12.75 4.10739 12.4142 4.44318 12 4.44318C11.5858 4.44318 11.25 4.10739 11.25 3.69318L11.25 2.69318C11.25 2.27896 11.5858 1.94318 12 1.94318Z" fill-rule="evenodd" fill="#AEAEAE"></path><path d="M19.1162 19.1232C18.8233 19.4161 18.3484 19.4161 18.0556 19.1232L17.3484 18.4161C17.0556 18.1232 17.0556 17.6483 17.3484 17.3554C17.6413 17.0625 18.1162 17.0625 18.4091 17.3554L19.1162 18.0625C19.4091 18.3554 19.4091 18.8303 19.1162 19.1232Z" fill-rule="evenodd" fill="#AEAEAE"></path><path d="M19.1162 4.8908C19.4091 5.1837 19.4091 5.65857 19.1162 5.95146L18.4091 6.65857C18.1162 6.95146 17.6413 6.95146 17.3484 6.65857C17.0555 6.36568 17.0555 5.8908 17.3484 5.59791L18.0555 4.8908C18.3484 4.59791 18.8233 4.59791 19.1162 4.8908Z" fill-rule="evenodd" fill="#AEAEAE"></path><path d="M22.0638 12.007C22.0638 12.4212 21.728 12.757 21.3138 12.757L20.3138 12.757C19.8996 12.757 19.5638 12.4212 19.5638 12.007C19.5638 11.5927 19.8996 11.257 20.3138 11.257L21.3138 11.257C21.728 11.257 22.0638 11.5927 22.0638 12.007Z" fill-rule="evenodd" fill="#AEAEAE"></path><path d="M12 19.5707C12.4142 19.5707 12.75 19.9065 12.75 20.3207L12.75 21.3207C12.75 21.735 12.4142 22.0707 12 22.0707C11.5858 22.0707 11.25 21.735 11.25 21.3207L11.25 20.3207C11.25 19.9065 11.5858 19.5707 12 19.5707Z" fill-rule="evenodd" fill="#AEAEAE"></path><path d="M6.65162 6.65857C6.35872 6.95146 5.88385 6.95146 5.59096 6.65857L4.88385 5.95146C4.59096 5.65856 4.59096 5.18369 4.88385 4.8908C5.17674 4.5979 5.65162 4.5979 5.94451 4.8908L6.65162 5.5979C6.94451 5.8908 6.94451 6.36567 6.65162 6.65857Z" fill-rule="evenodd" fill="#AEAEAE"></path><path d="M6.65161 17.3554C6.9445 17.6483 6.9445 18.1232 6.65161 18.4161L5.9445 19.1232C5.65161 19.4161 5.17673 19.4161 4.88384 19.1232C4.59095 18.8303 4.59095 18.3554 4.88384 18.0625L5.59095 17.3554C5.88384 17.0625 6.35871 17.0625 6.65161 17.3554Z" fill-rule="evenodd" fill="#AEAEAE"></path><path d="M4.43616 12.007C4.43616 12.4212 4.10037 12.757 3.68616 12.757L2.68616 12.757C2.27194 12.757 1.93616 12.4212 1.93616 12.007C1.93616 11.5927 2.27194 11.257 2.68616 11.257L3.68616 11.257C4.10037 11.257 4.43616 11.5927 4.43616 12.007Z" fill-rule="evenodd" fill="#AEAEAE"></path></svg>

After

Width:  |  Height:  |  Size: 3.0 KiB

View File

@ -21,7 +21,7 @@ struct SettingsView: View {
VStack(spacing: 16) {
sectionHeader("外观与语言")
VStack(spacing: 0) {
ZXSettingRow(title: "外观", value: appearanceLabel, icon: "moon.stars.fill", color: Color.zxPurple)
ZXSettingRow(title: "外观", value: appearanceLabel, icon: appearance == "dark" ? "icon-moon" : "icon-sun", color: Color.zxPurple, isCustom: true)
.contentShape(Rectangle())
.onTapGesture { cycleAppearance() }
ZXSettingDivider()
@ -156,10 +156,11 @@ struct SettingsView: View {
// MARK: - Setting row components
struct ZXSettingRow: View {
let title: String; let value: String; let icon: String; let color: Color
let title: String; let value: String; let icon: String; let color: Color; var isCustom: Bool = false
var body: some View {
HStack(spacing: 12) {
Image(systemName: icon).font(.system(size: 16)).foregroundColor(color).frame(width: 32, height: 32).background(color.opacity(0.12)).clipShape(RoundedRectangle(cornerRadius: 8))
if isCustom { Image(icon).resizable().scaledToFit().frame(width: 16, height: 16).foregroundColor(color).frame(width: 32, height: 32).background(color.opacity(0.12)).clipShape(RoundedRectangle(cornerRadius: 8)) }
else { Image(systemName: icon).font(.system(size: 16)).foregroundColor(color).frame(width: 32, height: 32).background(color.opacity(0.12)).clipShape(RoundedRectangle(cornerRadius: 8)) }
Text(title).font(.system(size: 14, weight: .semibold)).foregroundColor(Color.zxF0)
Spacer()
if !value.isEmpty { Text(value).font(.system(size: 13)).foregroundColor(Color.zxF03) }