小程序模板網(wǎng)

小程序wx.setScreenBrightness/wx.getScreenBrightness接口測試

發(fā)布時間:2018-01-24 11:02 所屬欄目:小程序開發(fā)教程

前言最近接觸了微信小程序 API - wx.setScreenBrightness 、wx.getScreenBrightness 接口,調(diào)用該接口可以調(diào)節(jié)并顯示手機(jī)屏幕亮度數(shù)據(jù)。對于喜歡騰訊新聞、今日頭條等一些閱讀類小程序的小伙伴,還是挺友好的。不需 ...

 
 
 

前言

最近接觸了微信小程序 API - wx.setScreenBrightness 、wx.getScreenBrightness 接口,調(diào)用該接口可以調(diào)節(jié)并顯示手機(jī)屏幕亮度數(shù)據(jù)。對于喜歡騰訊新聞、今日頭條等一些閱讀類小程序的小伙伴,還是挺友好的。不需要下拉屏幕或退出小程序頁面就可以調(diào)整屏幕亮度,直接在小程序內(nèi)部完成屏幕亮度調(diào)節(jié)工作,更加快速。下面,就分享一下如何使用該微信小程序API接口以及需注意的問題。

好!下面進(jìn)入正文。首先,打開微信開發(fā)者工具,添加小程序項(xiàng)目,選擇一個本地新建的空白小程序文件即可,APPid根據(jù)情況填寫。完成(工具會自動生成小程序必要一些的文件)。本次刪除了logs/until頁面,直接在index頁面上開發(fā)了

第一步,打開 app.json 文件(全局控制,決定頁面文件的路徑、窗口表現(xiàn)),檢查是否寫入pages/index/index,否則無法訪問index頁面。接著配置navigation的相關(guān)參數(shù),控制窗口頂部相關(guān)樣式信息,如backgroundcolor(背景)、textstyle(文本顏色)等

源碼參考:

 

		
  1. //app.json
  2. {
  3. "pages": [
  4. "pages/index/index"
  5. ],
  6. "window": {
  7. "navigationBarBackgroundColor": "#000000",
  8. "navigationBarTextStyle": "white",
  9. "navigationBarTitleText": "調(diào)節(jié)屏幕亮度",
  10. "backgroundColor": "#eeeeee",
  11. "backgroundTextStyle": "light",
  12. "enablePullDownRefresh": false
  13. }
  14. }

第二步,打開index的js文件,在page下定義changeScreenLight對象,并同時在.wxml文件中設(shè)置參數(shù),傳遞changeScreenLight下相關(guān)事件函數(shù)處理的值。接著開始配置wx.setScreenBrightness 以及 wx.getScreenBrightness兩個事件函數(shù)!

1)wx.setScreenBrightness 即獲得屏幕亮度值,用value參數(shù)來寫入,這里還使用了parseFloat、toFixed兩個函數(shù)來界定value的取值。為了把獲得的value值回調(diào)至下個事件函數(shù)wx.getScreenBrightnes的ScreenBrightnes中,這里借助var that = this 來處理,即把這個this事件的值復(fù)制一份到that,在下個事件函數(shù)中,用that.setDatal來回調(diào)數(shù)值。

2)wx.getScreenBrightness 即給屏幕亮度賦值,通過success參數(shù)(成功調(diào)用)的res屬性來傳遞這個事件函數(shù),接著使用that.setData回調(diào)數(shù)值,而其中的ScreenBrightness:res.value即res第一個事件函數(shù)中的value值啦!

源碼參考:

 

		
  1. //index.js
  2. Page({
  3. data:{
  4. },
  5. changeScreenLight:function(e){
  6. var that = this;
  7. //滑動拉桿獲得值
  8. wx.setScreenBrightness({
  9. value: parseFloat(e.detail.value).toFixed(1)
  10. })
  11. //給屏幕亮度賦值
  12. wx.getScreenBrightness({
  13. success: function(res) {
  14. that.setData({
  15. ScreenBrightness: res.value
  16. })
  17. }
  18. })
  19. }
  20. })

第三步,配置index.wxml文件。index.wxml文件的配置和.js文件是有關(guān)聯(lián)性的。這里在.wxml用slider做了一個滑桿,通過min、max、step控制滑桿的最小值、最大值以及每滑動一單位時的增量,最后通過bindchange="changeScreenLight",來傳遞.js文件中changeScreenLight相關(guān)事件函數(shù)的處理結(jié)果。{{ScreenBrightness}}參數(shù)則是傳遞了.js文件中的value值。  源碼參考:

 

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

總結(jié):getScreenBrightness 接口若安卓系統(tǒng)設(shè)置中開啟了自動調(diào)節(jié)亮度功能,則屏幕亮度會根據(jù)光線自動調(diào)整,該接口僅能獲取自動調(diào)節(jié)亮度之前的值,而非實(shí)時的亮度值。



易優(yōu)小程序(企業(yè)版)+靈活api+前后代碼開源 碼云倉庫:starfork
本文地址:http://22321a.com/wxmini/doc/course/19625.html 復(fù)制鏈接 如需定制請聯(lián)系易優(yōu)客服咨詢:800182392 點(diǎn)擊咨詢
QQ在線咨詢