ThinkChat🤖让你学习和工作更高效,注册即送10W Token,即刻开启你的AI之旅 广告
[TOC] ## 3.6 设备能力 小程序的宿主环境提供了非常多的操作设备能力来帮助用户在特定场景下做高效的输入,例如:扫码、操控蓝牙等等能力。当然也有很多设备能力不是为了解决输入低效问题而设计的,它们更多的是解决用户侧一些体验问题,例如:获取设备网络状态;调整屏幕亮度等等, ### 3.6.1 利用微信扫码能力`wx.scanCode` 为了让用户减少输入,我们可以把复杂的信息编码成一个二维码,利用宿主环境wx.scanCode这个API调起微信扫一扫,用户扫码之后,wx.scanCode的success回调会收到这个二维码所对应的字符串信息。 代码清单4-19 利用wx.scanCode获取二维码的数据 ~~~ //page.js Page({ // 点击“扫码订餐”的按钮,触发tapScan回调 tapScan: function() { // 调用wx.login获取微信登录凭证 wx.scanCode({ success: function(res) { var num = res.result // 获取到的num就是餐桌的编号 } }) } }) ~~~ 应用场景: 1. 通过扫商品上的二维码做一个商品展示的小程序 2. 通过扫共享单车上的二维码去开启单车 3. 餐厅点餐的小程序,我们给餐厅中每个餐桌编号1-100号,把这个数字编码到二维码(也可以把其他信息编码进来,如餐桌人数限制,或者灯光调节等等,为了避免复杂,我们这里只考虑餐桌号)中,扫码获得编号之后,就可以知道是哪一桌点的菜,大大提高点餐体验和效率。 ### 3.6.2 获取网络状态`wx.getNetworkType` 我们知道手机连接到互联网有几种方式:Wifi、2G、3G、4G,包括很快到来的5G,每种方式的上传速度和下载速度差异很大,它们的计费方式的差异也导致用户在使用互联网服务的时候有不同的使用习惯。 通过小程序提供的获取网络状态的能力,做一些更友好的体验提示。 代码清单4-20 利用wx.getNetworkType获取网络状态 ~~~ //page.js Page({ // 点击“预览文档”的按钮,触发tap回调 tap: function() { wx.getNetworkType({ success: function(res) { // networkType字段的有效值: // wifi/2g/3g/4g/unknown(Android下不常见的网络类型)/none(无网络) if (res.networkType == 'wifi') { // 从网络上下载pdf文档 wx.downloadFile({ url:'http://test.com/somefile.pdf', success: function (res) { // 下载成功之后进行预览文档 wx.openDocument({ filePath: res.tempFilePath }) } }) } else { wx.showToast({ title: '当前为非Wifi环境' }) } } } } }) ~~~ ### 3.6.3 动态监听网络状态变化`wx.onNetworkStatusChange` 某些情况下,我们的手机连接到网络的方式会动态变化,例如手机设备连接到一个信号不稳定的Wifi热点,导致手机会经常从Wifi切换到移动数据网络。小程序宿主环境也提供了一个可以动态监听网络状态变化的接口`wx.onNetworkStatusChange`,让开发者可以及时根据网络状况去调整小程序的体验,wx.onNetworkStatusChange这个接口的使用场景留给读者来思考。