
首先,請更新微信版本至 6.5.11 。
微信 7 月 11 日發(fā)布了一大堆小程序新特性,小程序迎來了一次全方位的升級,其中包含 3 個新增組件標(biāo)簽、7 個新增 API ,并且強(qiáng)化了視頻組件。
這些升級和新特性帶來了什么?
增強(qiáng)頁面體驗。小程序可以調(diào)整頂部標(biāo)題欄的顏色了,還能獲取頁面布局,比如記住用戶上次瀏覽的位置。可以在地圖、視頻和畫布上展示簡單的圖片和文字??梢院芊奖愕卣故靖晃谋?,文章排版可以更精美。
提升硬件能力。小程序可以讓用戶手機(jī)屏幕保持亮起,還支持截屏事件通知,比如當(dāng)用戶在小程序中截屏保存了敏感信息時可以提醒注意隱私安全。
強(qiáng)化視頻功能。視頻可動態(tài)切換全屏非全屏,可以讓視頻倍數(shù)播放,增加了視頻上手勢控制音量和亮度的功能。
下面一一解讀。
新增 3 個組件標(biāo)簽
1. 在地圖、視頻和畫布上,可以展示簡單的圖片及文字
新增 <cover-view /> 可以覆蓋在原生組件之上。
cover-view 解決了 video 或 canvas 上面沒法放置元素的問題。以前,要在視頻上放一個圖或者一段字是很難的,借助于這個新標(biāo)簽就能很容易實現(xiàn)。
2. 在微信群聊中使用的小程序,可將群名稱展示在自己的頁面上
新增 <open-data /> 可以展示微信開放數(shù)據(jù)。
open-data 方法讓同一個群的用戶可以在小程序里看到群昵稱(用這樣的顯示方法的話,開發(fā)者貌似就沒法存群昵稱了)。
3. 小程序中可以很方便地展示富文本,如一段排版精美的文章
新增 <rich-text /> 可以展示富文本。
rich-text 只是給帶有內(nèi)嵌樣式的 html 代碼做了一次轉(zhuǎn)換,然后在小程序里展示,不是 web 頁面直接展示。不太順手,其實用 webview 網(wǎng)頁承載富文本,是不是更好。
新增 7 個 API
1. 可以獲取小程序中的元素布局信息
新增 API createSelectorQuery 獲取元素布局信息。
createSelectorQuery,類似 jQuery 的 $ ,當(dāng)然,并沒有 $ 厲害,目前只能選擇某個元素,然后獲取這個元素的部分信息。
2. 當(dāng)用戶在小程序中截屏,可發(fā)送通知
新增 API onUserCaptureScreen 監(jiān)聽用戶進(jìn)行截屏事件。
onUserCaptureScreen 監(jiān)聽用戶的截屏事件,可以做一些截屏分享的功能。例如,當(dāng)用戶截屏,就給他直接生成一個用當(dāng)前屏幕跟其他視覺元素拼接的圖片,比如做一個截屏和小程序二維碼結(jié)合的、朋友圈分享用的圖片。
3. 定位并記錄用戶的屏幕滑動情況
新增 API pageScrollTo 使頁面滾動到指定位置。
pageScrollTo,解決之前不能滾動到指定位置的體驗問題。
4. 可調(diào)整頂部標(biāo)題欄的顏色
新增 API setNavigationBarColor 支持小程序修改標(biāo)題欄顏色。
setNavigationBarColor,讓小程序能靈活的變換標(biāo)題欄的樣式,優(yōu)化體驗。
5. 讓用戶的手機(jī)屏幕保持常亮
新增 API setKeepScreenOn 允許小程序設(shè)置屏幕保持常亮。
setKeepScreenOn,控制屏幕亮度的 API,以后打開小程序,可以控制小程序一直處于常亮狀態(tài)。
6. 獲取文件信息
新增 API getFileInfo 獲取文件信息。
7. 控制線上版本 vConsole 的打開關(guān)閉
新增 API setEnableDebug 控制線上版本 vConsole 的打開關(guān)閉。
值得關(guān)注的強(qiáng)化視頻組件
官方發(fā)文沒有針對視頻組件強(qiáng)化的描述。
- 新增 video 上下文 requestFullScreen exitFullScreen 接口,支持全屏。
- 新增 video 上下文 playbackRate 接口 支持倍速播放。
- 修復(fù) video 上下文 seek 接口 在播放前設(shè)置無效的問題。
- 更新 組件 <video /> 增加 loop 屬性支持循環(huán)播放 詳情。
- 更新 組件 <video /> 增加 muted 屬性支持靜音播放 詳情。
- 更新 組件 <video /> 增加 bindfullscreenchange 事件監(jiān)聽視頻全屏變化詳情。
- 更新 組件 <video /> 支持手勢操作控制音量和亮度。
- 更新 組件 <video /> 支持視頻拖動增加 icon 提示。
- 更新 組件 <video /> 在 Android 下切換成原生播放器。
1. 視頻可動態(tài)切換全屏非全屏
例如:點(diǎn)擊頁面某個按鈕就直接全屏播放某個視頻,又或者是首次進(jìn)入小程序時馬上就全屏播放一個引導(dǎo)視頻,等視頻播放完再切換到落地頁。
2. 可以讓視頻倍數(shù)播放
playbackRate 接口支持的倍率有 0.5/0.8/1.0/1.25/1.5,這個接口能讓視頻可快可慢地進(jìn)行播放,可能會為部分視頻類應(yīng)用提供一些比較有創(chuàng)意的玩法。
3. 支持手勢控制音量和亮度
想必現(xiàn)在 H5 里的原生視頻組件都沒有實現(xiàn)這樣的體驗。
參考官方文檔:
https://mp.weixin.qq.com/debug/wxadoc/dev/api/
https://mp.weixin.qq.com/debug/wxadoc/dev/devtools/new.html