SwiftUI 兼容 Light Dark

1. Assets 右键 New Color Set

---

2. 起个合适的颜色名称，修改一下

• demo_bgcolor
• demo_card_bgcolor
• demo_text_color

---

3. Show Me The Code

//
//  light_dark_demo.swift
//  bill2
//
//  Created by 朱洪苇 on 2023/8/10.
//

import SwiftUI

struct light_dark_demo: View {
    var body: some View {
        ZStack {
            Rectangle()
                .foregroundColor(Color("demo_bgcolor"))
            
            RoundedRectangle(cornerRadius: 23, style: .continuous)
            	.foregroundColor(Color("demo_card_bgcolor"))
                .frame(width: 230, height: 80)
            
            Text("Hello hongweizhu.com")
                .foregroundColor(Color("demo_text_color"))
        }
        .ignoresSafeArea()
    }
}

struct light_dark_demo_Previews: PreviewProvider {
    static var previews: some View {
        light_dark_demo()
    }
}

---

4. Preview

---

5. 找到合适的颜色

• 通过截屏微信 Light Dark 模式，吸取颜色值
• https://developer.apple.com/tutorials/swiftui-concepts/layering-content 模仿 Apple，网页底部可切换 Light Dark

---

喜欢或对你有帮助，请点个赞吧，自己先点个嘿嘿 。

有错误或者疑问还请评论指出。

我的个人网站 点击访问 hongweizhu.com 。

---

END

---