发布网友 发布时间:2022-04-22 22:49
共9个回答
懂视网 时间:2022-05-16 03:18
这篇文章主要给大家介绍了关于利用微信小程序实现皮肤功能,也就是实现夜间模式的相关资料,文中通过示例代码介绍的非常详细,对大家具有一定的参考学习价值,需要的朋友们下面来一起看看吧。老规矩,先上效果图
个人对夜间模式这个功能情有独钟
晚上黑灯瞎火的看手机,屏幕亮度就算调到最低依然很是刺眼呀
所以我一直用某浏览器,因为有夜间模式
言归正传,依然是分析功能点
1.点击按钮,切换一套css(这个功能很简单)
2.把皮肤设置保存到全局变量,在访问其它页面时也能有效果
3.把设置保存到本地,退出应用再进来时,依然加载上次设置的皮肤
先从切换开始吧,switch很少用,还是贴一下吧
按钮功能OK了,现在我们去写样式
像这种黑的风格的皮肤,大背景色用#000
小背景用#333,文字用#999吧,我也懒得用取色器了
既然需要一套皮肤,那我们就去文件夹外面写一个样式文件
就新建一个skin目录,下面写一个dark.wxss吧
然后呢
我们把普通模式下的wxss复制一份,贴进来
把和颜色有关的属性留下来,其它删除
像background呀,border,color等。。其它统统不要
最后发现就剩这么点了。。
/*夜间模式*/ /****个人信息页面****/ .dark-box{ background: #000 !important; } /*用户信息部分*/ .dark-box .user-box{ background: #333 !important; color: #999; } /*列表部分*/ .dark-box .extra-box{ background: #333 !important; } .dark-box .extra-box .extra-item{ border-bottom: 1px solid #000 !important; } .dark-box .extra-box .item-head{ color: #999; } .dark-box .between-box{ background: #333 !important; } .dark-box .between-left{ background: #333 !important; } .dark-box .between-left .item-head{ color: #999; } /****个人信息页面结束****/
大家发现,我这些样式名称都有dark-box
这个dark-box就是最外面,也是最大的盒子(除了默认的page哈)
my-box是普通模式,dark-box就是夜间模式
<view class="my-box {{skinStyle}}-box">
当然你也可以在写一个皮肤样式,黄、红、蓝。。。
现在这个写法,我们只用控制变量 skinStyle的值就能改变皮肤样式了
我们还能写个blue-box的皮肤,然后设置变量为skinStyle为blue就行了
还有关键一步,在wxss文件中把这个皮肤文件引入要显示的页面
接下来第二步,这就简单了。。
设置到全局变量嘛,先getApp(),然后传过去就行了
现在在访问其它页面的时候,dark皮肤也会传进去
我只写了一个页面哈,所以只有这个页面会有变化
现在第三步了,保存到localstroge中
完了吗?并没有。。
我们要在程序打开时就获取皮肤设置
所以要在app.js去get与皮肤相关的信息
现在我们设置黑色皮肤,然后退出,进去之后不是黑色
因为我们在页面加载时没设置
现在再来看看
皮肤没问题了
结果按钮的状态是关闭,皮肤却是开着
因为开关重置了
这个就交给大家自己解决啦,启动时判断一下就OK啦
热心网友 时间:2022-05-16 00:26
截至2019年11月微信是没有夜间模式设置的,但是可以通过以下方法,让夜间使用微信也能护眼。
1.首先打开手机微信, 在我的页面打开设置,如下图
2.进入到设置页面之后打开通用,如下图:
3.然后在通用页面打开聊天背景,如下图:
4.进入到聊天背景页面之后,打开选择背景图,如下图:
5.然后在选择背景图页面选择黑色背景颜色,因为微信是没有直接设置夜间模式的,所以我们可以选择一张暗色系的黑色图来降低光线的强度,如下图:
6.最后将背景应用到所有聊天场景,如下图:
7.设置好之后,再来打开聊天窗口就可以看到背景变成黑色的了,没有那么刺眼,如下图:
注意事项:
1.夜间使用微信建议都使用夜间模式用以保护视力。
2.在微信聊天、传送图片等时,要注意保护自己、家庭、朋友的隐私。
3.每天使用微信的时间不要太长,以免造成颈椎、眼睛的疾病。
热心网友 时间:2022-05-16 01:44
1、首先,点击手机主页设置图标,进入手机设置功能页面。如下图所示。
2、进入手机设置页面后,选择“显示与亮度”并进入。如下图所示。
3、在显示与亮度页面,将iPhone外观设置为深色模式。如下图所示。
4、将iPhone外观设置为深色模式后,回到微信页面,微信即可显示为夜间模式,即可设置成功。如下图所示。
热心网友 时间:2022-05-16 03:19
付费内容限时免费查看回答1、打开微信点击我,然后点击设置。2、在设置中再点击通用。
3、在通用中点击深色模式,进入下一步设置。
4.打开夜间模式即可
热心网友 时间:2022-05-16 05:10
微信夜间模式的设置主要是六个步骤:打开手机设置页面—找到显示选项—找到深色模式—开启深色模式—找到微信的关于微信选项—找到检查新版本。下面给大家展示具体的操作步骤。
1、首先我们打开自己手机,看到自己的手机页面,找到自己手机中的的设置。
2、其次在手机中设置的页面中找到显示这个选项,然后点击进入.
3、在手机的显示这个页面下拉找到深色模式,找到后点击打开开关。
4、点击深色模式后手机的页面如下图所示。页面已经显示为夜间的场面了。
5、打开自己手机的微信,如果自己手机微信不能适应,就点击微信设置里的关于微信。
6、检查看下自己手机的微信是否是最新版本,如果不是就要进行微信的更新。
注意事项:
1、各手机设置路径不一致,请自己根据自己的手机来进行微信夜间模式的设置。
2、如果手机不适应,就要点击手机的微信设置找到检查新版本进行更新。
热心网友 时间:2022-05-16 07:18
微信夜间模式怎么设置?微信夜间模式开启技巧步骤如下:
1、首先点击打开移动微信APP,并且登录自己的微信账号按钮。
2、然后在微信主页面上,单击右下角的我,然后找到并点击“设置”按钮。
3、之后进入设置页面后,我们找到并单击“勿扰模式”按钮 。
4、最后进入勿扰模式页面中并点击开启,并根据您的需要设置适合的时间。勿扰模式也就是夜间模式,开启技巧完成。
热心网友 时间:2022-05-16 09:43
微信没有夜间模式,可以把背景换成黑色的。把手机亮度调低,换上黑色背景图把聊天的背景换成黑色的,聊天业界就是夜间模式了;在阅读公众号文章的时候,长按就会出现夜间全屏阅读的选项了,点击即可。热心网友 时间:2022-05-16 12:41
更新至微信最新版本7.0.12。
只要把手机调节成“深色”模式就可以了!
手机设置里面“显示与亮度”,里面的“深色”模式。
热心网友 时间:2022-05-16 15:56
微信没有夜间模式,可以把背景换成黑色的。