主机参考:VPS测评参考推荐/专注分享VPS服务器优惠信息!若您是商家可以在本站进行投稿,查看详情!此外我们还提供软文收录、PayPal代付、广告赞助等服务,查看详情! |
我们发布的部分优惠活动文章可能存在时效性,购买时建议在本站搜索商家名称可查看相关文章充分了解该商家!若非中文页面可使用Edge浏览器同步翻译!PayPal代付/收录合作 |
1. 开启深色模式
在 app.json 中设置 "darkmode": true
// app.json{ ... "darkmode": true} 2. 设置主题文件
创建一个新主题文件,根目录下的一个,在主题配置文件theme.json中,设置导入路径为app.json。
// app.json{ ... "themeLocation": "theme.json"}
主题。 json配置文件分为两个属性:light和dark,分别是普通模式和深色模式。
以下是示例 Theme.json(仅供参考)。
// theme.json{ "light": { "navBackgroundColor": "#ffffff", "navTextStyle": "black " }, "dark": { "navBackgroundColor": "#000000", "navTextStyle" : "white" }}
必须存在两个属性:浅色和深色。 内层命名是自定义的,没有严格要求。
3. 在 app.json 中应用配置属性
配置属性以 @ 开头,并以 theme.json 中的自定义名称开头来描述配置。 一个例子是:
// app.json{ .. . ”window”: { “navigationBarBackgroundColor”: “@navBackgroundColor", "navigationBarTitleText": "小背包,大梦想", "navigationBarTextStyle": "@navTextStyle" }, "darkmode": true, "themeLocation": "theme.json"}
配置完成后,深色模式(深色模式),小程序根据您设置的颜色进行变换。
4. wxss 样式适应深色模式。
在 wxss 中,媒体查询优先 k3] 方案适应不同的主题。 p>
以下样式在普通模式下为灰白色,在深色模式下为黑色。
/* 样式在普通模式下应用 /page{ background: # f1f1f1;} /* 在深色模式下应用样式。 */@media (prefers-color-scheme: dark) { page{ background: #000000 }} 5.渲染
推荐教程:“微信小程序”
下载微信应用
微信支持语音消息、视频、照片和文字。微信是一款支持通过手机网络发送的移动通讯软件,可以单独聊天或群聊。组,还可以根据地理位置进行搜索。您附近的人带来全新的移动通信体验。 有需要的朋友可以保存并下载自己的经验。
下载
这几篇文章你可能也喜欢:
- 微信小程序订单如何退款(微信小程序订单如何退款)
- 微信小程序如何配置网络请求超时?
- 微信小程序网络超时怎么办(微信小程序网络异常处理)
- 分享微信小程序签到考勤后台代码(如何获取小程序考勤位置)
- 微信小程序无法使用怎么办?(微信小程序无法使用怎么办?说微信尚未升级)
本文由主机参考刊发,转载请注明:微信小程序深色模式 https://zhujicankao.com/123615.html
评论前必须登录!
注册