feat: 支持跟随系统深色/浅色模式(darkmode + theme.json + 主题检测)

This commit is contained in:
2026-08-06 16:40:03 +08:00
parent 06ae61f083
commit e01951cd0e
8 changed files with 66 additions and 5 deletions
+2
View File
@@ -1,4 +1,6 @@
export default defineAppConfig({
darkmode: true,
themeLocation: 'theme.json',
pages: [
'pages/index/index',
'pages/shop/index',
+26
View File
@@ -0,0 +1,26 @@
{
"light": {
"navBgColor": "#ffffff",
"navTxtStyle": "black",
"bgColor": "#ffffff",
"bgTxtStyle": "dark",
"bgColorTop": "#ffffff",
"bgColorBottom": "#ffffff",
"tabBarColor": "#b08d8d",
"tabBarSelectedColor": "#ff9a9e",
"tabBarBgColor": "#ffffff",
"tabBarBorderStyle": "black"
},
"dark": {
"navBgColor": "#1e1e2f",
"navTxtStyle": "white",
"bgColor": "#1e1e2f",
"bgTxtStyle": "light",
"bgColorTop": "#1e1e2f",
"bgColorBottom": "#1e1e2f",
"tabBarColor": "#a0a0c0",
"tabBarSelectedColor": "#ff7eb3",
"tabBarBgColor": "#1e1e2f",
"tabBarBorderStyle": "white"
}
}
+8 -2
View File
@@ -262,8 +262,14 @@ export function setTheme(theme: ThemeMode) {
/** 根据自动模式解析实际生效主题 */
export function resolveTheme(mode: ThemeMode): 'light' | 'dark' {
if (mode === 'auto') {
const info = Taro.getSystemInfoSync()
return info.theme === 'dark' ? 'dark' : 'light'
// 需 app.json 开启 darkmode 后 theme 字段才有效;getSystemInfoSync 已废弃,改用 getAppBaseInfo
try {
const info = Taro.getAppBaseInfo()
return info.theme === 'dark' ? 'dark' : 'light'
} catch {
const info = Taro.getSystemInfoSync()
return info.theme === 'dark' ? 'dark' : 'light'
}
}
return mode
}