前言

最近接触了微信小程序 API - wx.setScreenBrightness 、wx.getScreenBrightness 接口,调用该接口可以调节并显示手机屏幕亮度数据。对于喜欢腾讯新闻、今日头条等一些阅读类小程序的小伙伴,还是挺友好的。不需要下拉屏幕或退出小程序页面就可以调整屏幕亮度,直接在小程序内部完成屏幕亮度调节工作,更加快速。下面,就分享一下如何使用该微信小程序API接口以及需注意的问题。

好!下面进入正文首先,打开微信开发者工具,添加小程序项目,选择一个本地新建的空白小程序文件即可,APPid根据情况填写。完成(工具会自动生成小程序必要一些的文件)。本次删除了logs/until页面,直接在index页面上开发了

第一步,打开 app.json 文件(全局控制,决定页面文件的路径、窗口表现),检查是否写入pages/index/index,否则无法访问index页面。接着配置navigation的相关参数,控制窗口顶部相关样式信息,如backgroundcolor(背景)、textstyle(文本颜色)等

源码参考:

//app.json
{ "pages": [ "pages/index/index" ], "window": { "navigationBarBackgroundColor": "#000000", "navigationBarTextStyle": "white", "navigationBarTitleText": "调节屏幕亮度", "backgroundColor": "#eeeeee", "backgroundTextStyle": "light", "enablePullDownRefresh": false } }

第二步,打开index的js文件,在page下定义changeScreenLight对象,并同时在.wxml文件中设置参数,传递changeScreenLight下相关事件函数处理的值。接着开始配置wx.setScreenBrightness 以及 wx.getScreenBrightness两个事件函数!

1)wx.setScreenBrightness 即获得屏幕亮度值,用value参数来写入,这里还使用了parseFloat、toFixed两个函数来界定value的取值。为了把获得的value值回调至下个事件函数wx.getScreenBrightnes的ScreenBrightnes中,这里借助var that = this 来处理,即把这个this事件的值复制一份到that,在下个事件函数中,用that.setDatal来回调数值。

2)wx.getScreenBrightness 即给屏幕亮度赋值,通过success参数(成功调用)的res属性来传递这个事件函数,接着使用that.setData回调数值,而其中的ScreenBrightness:res.value即res第一个事件函数中的value值啦!

源码参考:

//index.js
Page({
  data:{
  },
  changeScreenLight:function(e){
    var that = this;
    //滑动拉杆获得值
    wx.setScreenBrightness({
      value: parseFloat(e.detail.value).toFixed(1)
    })
    //给屏幕亮度赋值
    wx.getScreenBrightness({
      success: function(res) {
        that.setData({
          ScreenBrightness: res.value
        })
      }
    })
  }
})
第三步,配置index.wxml文件。index.wxml文件的配置和.js文件是有关联性的。这里在.wxml用slider做了一个滑杆,通过min、max、step控制滑杆的最小值、最大值以及每滑动一单位时的增量,最后通过bindchange="changeScreenLight",来传递.js文件中changeScreenLight相关事件函数的处理结果。{{ScreenBrightness}}参数则是传递了.js文件中的value值。

源码参考:

<slider min="0" max="1" step="0.1"bindchange="changeScreenLight"/>
<view>屏幕亮度:{{ScreenBrightness}}</view>

总结:getScreenBrightness 接口若安卓系统设置中开启了自动调节亮度功能,则屏幕亮度会根据光线自动调整,该接口仅能获取自动调节亮度之前的值,而非实时的亮度值。

开发 | 小程序wx.setScreenBrightness/wx.getScreenBrightness接口测试的更多相关文章

  1. 开发 | 微信小程序API-wx.setScreenBrightness/wx.getScreenBrightness

    前言 最近接触了微信小程序 API - wx.setScreenBrightness .wx.getScreenBrightness 接口,调用该接口可以调节并显示手机屏幕亮度数据.对于喜欢腾讯新闻. ...

  2. 【微信小程序】调用wx.request接口需要注意的问题

    写在前面 之前写了一篇<微信小程序实现各种特效实例>,上次的小程序的项目我负责大部分前端后台接口的对接,然后学长帮我改了一些问题.总的来说,收获了不少吧! 现在项目已经完成,还是要陆陆续续 ...

  3. 【小程序】调用wx.request接口时需要注意的问题

    写在前面 之前写了一篇<微信小程序实现各种特效实例>,上次的小程序的项目我负责大部分前端后台接口的对接,然后学长帮我改了一些问题.总的来说,收获了不少吧! 现在项目已经完成,还是要陆陆续续 ...

  4. 小程序上传wx.uploadFile - 小程序请假

    小程序上传wx.uploadFile UploadTask wx.uploadFile(Object object) 将本地资源上传到服务器.客户端发起一个 HTTPS POST 请求,其中 cont ...

  5. 微信小程序API 登录-wx.login(OBJECT) + 获取微信用户唯一标识openid | 小程序

    wx.login(OBJECT) 调用接口获取登录凭证(code)进而换取用户登录态信息,包括用户的唯一标识(openid) 及本次登录的 会话密钥(session_key).用户数据的加解密通讯需要 ...

  6. 小程序API:wx.showActionSheet 将 itemList动态赋值

    1.发现问题: 小程序调用API:wx.showActionSheet 时发现无论如何都不能将其属性itemList动态赋值. 2.分析问题: 首先我认为可能是格式的问题,itemList必须要求格式 ...

  7. 小程序上传wx.uploadFile - 小程序请假-请求

    小程序上传wx.uploadFile UploadTask wx.uploadFile(Object object) 将本地资源上传到服务器.客户端发起一个 HTTPS POST 请求,其中 cont ...

  8. 基于小程序请求接口 wx.request 封装的类 axios 请求

    基于小程序请求接口 wx.request 封装的类 axios 请求 Introduction wx.request 的配置.axios 的调用方式 源码戳我 feature 支持 wx.reques ...

  9. 使用mpvue开发小程序教程(二)

    在上篇文章中,我们介绍了使用mpvue开发小程序所需要的一些开发环境的搭建,并创建了第一个mpvue小程序代码骨架并将其运行起来.在本文中,我们来研究熟悉一下mpvue项目的主要目录和文件结构. 在V ...

  10. 使用mpvue开发小程序教程(五)

    在上一章节中,我们了解了组件的三个基本特性以及组件的基本使用方法.在实际的小程序开发中,我们应该以组件的思维去设计每个小程序的功能页面,对其进行合理的组件拆分,让每个部分都保持功能简洁.条理清楚.各司 ...

随机推荐

  1. React的JSX语法及组件

    最近一个同事很急没有做任何交接就请了陪产假,然后我来维护.说实在的我一开始是一脸懵逼的.因为MV*项目里用的最多的还是Vue:React听说也了解过,但毕竟不熟... 不过不管如何这也是工作:同事也恭 ...

  2. Git详解之八:Git与其他系统

    Git 与其他系统 世界不是完美的.大多数时候,将所有接触到的项目全部转向 Git 是不可能的.有时我们不得不为某个项目使用其他的版本控制系统(VCS, Version Control System ...

  3. 微信语音红包小程序开发如何提高精准度 红包小程序语音识别精准度 微信小程序红包开发语音红包

    公司最近开发的一个微信语音红包,就是前些时间比较火的包你说红包小程序.如何提高识别的精准度呢. 在说精准度之前,先大概说下整个语音识别的开发流程.前面我有文章已经说到过了.具体我就不谈了.一笔带过. ...

  4. 测试库的接收到的数据是否完整(jrtplib为列)

    最近使用jrtplib来接收RTP包,然后解码播放 发现解码出来的是绿屏,马赛克 于是开始排查 首先直接用wireshark抓进来的包,转为可以被vlc播放的文件 操作如下 http://blog.c ...

  5. Composer创建和发送HTTP Request

    Fiddler Composer的功能就是用来创建HTTP Request 然后发送. 你可以自定义一个Request, 也可以手写一个Request, 你甚至可以在Web会话列表中拖拽一个已有的Re ...

  6. SpringMVC @SessionAttributes注解

    @SessionAttributes 注解只能作用到类上 @SessionAttributes(value={"user"},types={String.class}) @Sess ...

  7. CSS制作波浪线

    建议先去了解清楚了径向渐变,线性渐变的用法先 这个作者的css制作波浪线讲解很不错额:https://www.jianshu.com/p/8570433e3669不理解的可以看看这个链接的额 可以去菜 ...

  8. entity framework学习

    资源 Entity Framework技术导游系列开篇与热身

  9. Tsung脚本中使用动态参数(一)---直接在脚本里编写Erlang代码

    杀死一个程序猿,只要改三次需求.同理,杀死一个接口自动化测试人员,只要改三次接口数据处理方式.我目前的状态,改了一次接口数据处理方式,有一种胸闷的感觉. 因为改需求,所以,要改脚本.T_T.所以,才有 ...

  10. MySQL创建表的语句

    show variables like 'character_set_client';#查询字符集 show databases;#列出所有的服务器上的数据库alter create database ...