华为手表开发：WATCH 3 Pro（8）获取位置服务
华为手表开发：WATCH 3 Pro（8）获取位置服务
- 初
- 环境与设备
- 文件夹：
- 文件
- 新增第二页面
- geolocation.hml
- geolocation.js
- 修改首页 -> 新建按钮 “ 跳转 ”
- index.hml
- index.js 引用包：'@system.router'
- 首页效果
- 点击结果按钮跳转后 ：
- 手表上的展示结果
- 遇到报错
初
希望能写一些简单的教程和案例分享给需要的人
鸿蒙可穿戴开发
环境与设备
系统：window
设备：HUAWEI WATCH 3 Pro
开发工具：DevEco Studio 3.0.0.800
鸿蒙开发
文件夹：
entry:项目文件夹
js：前端文件夹
pages:页面文件夹
index:首页文件夹
文件
index.css:首页样式
index.hml:首页
index.js:首页脚本
新增第二页面
操作步骤：
首先在pages鼠标右击；
点击New----第二栏菜单点击Js Page；
在文本框中输入页面名称（geolocation）名称可以自己拟定
点击弹框右下角Finsin按钮完成页面创建
需要引用包
import geolocation from ‘@system.geolocation’;
代码如下：
geolocation.hml
<div class="container"><text class="title">位置 {{ latitude }}，{{ longitude }}</text>
</div>geolocation.js
import geolocation from '@system.geolocation';export default {data: {latitude: '...',longitude: '...'},onInit() {console.info("dao_logger::定位获取");geolocation.subscribe({success: (data) => {console.info('dao_logger::位置订阅更新' + data.latitude + ',' + data.longitude)this.latitude = data.latitude;this.longitude = data.longitude;},fail: function (data, code) {console.info('dao_logger:: fail to get location. code:' + code + ', data:' + data);},});}
}修改首页 -> 新建按钮 “ 跳转 ”
index.hml
在HTML文件“index.hml”，添加按钮，这里按钮用到是<input>标签
标签属性：
type=“button”【规定 input 元素的类型】
<div class="container"><text class="title">你好，我是首页</text><input else class="btn" type="button" value="跳转" onclick="onClickTest"></input>
</div>
index.js 引用包：‘@system.router’
onInit() : 进入页面初始化运行的方法
onClickTest () ：按钮点击后触发的方法，我们将跳转页面的代码写在这个位置就可以实现点击按钮进行跳转页面的动作
import router from '@system.router';export default {data: {title: ""},onInit() {this.title = this.$t('strings.world');},onClickTest() {router.push({uri: "pages/geolocation/geolocation",});}
}首页效果
点击结果按钮跳转后 ：
点击按钮后，最新日志显示获取到的定位
手表上的展示结果
手表显示获取到的位置信息
遇到报错
遇到报错 fail to get location. code:601, data:user rejects the perssion request ，是因为没有加入权限，如下图报错日志中显示的
我们在 config.json 里面加入权限，如下图所示：
"reqPermissions": [{"name": "ohos.permission.LOCATION"},{"name": "ohos.permission.MEDIA_LOCATION"}]
华为手表开发：WATCH 3 Pro（8）获取位置服务相关推荐
- 华为手表开发：WATCH 3 Pro（10）获取心率
华为手表开发:WATCH 3 Pro(10)获取心率 初 环境与设备 文件夹: 文件 新增第二页面 引用包 import sensor from '@system.sensor'; showHeart ...
- 华为手表开发：WATCH 3 Pro（15）传感器订阅加速度计
华为手表开发:WATCH 3 Pro(15)传感器订阅加速度计 初 环境与设备 加速度传感器介绍与说明 鸿蒙开发 文件夹: 文件 重点 新增展示的文本标记 index.hml index.css in ...
- 华为手表开发：WATCH 3 Pro（2）生成密钥和证书请求文件，生成签名和配置签名
华为手表开发:WATCH 3 Pro(2)生成密钥和证书请求文件,生成签名和配置签名 初 环境与设备 生成密钥 生成签名 初 希望能写一些简单的教程和案例分享给需要的人 鸿蒙可穿戴开发 环境与设备 系 ...
- 华为手表开发：WATCH 3 Pro（11）存储数据_轻量级存储_到本地
华为手表开发:WATCH 3 Pro(11)存储数据_轻量级存储_到本地 初 环境与设备 文件夹: 文件 开发步骤 新增一个文本输入框 index.hml index.css 存储数据的逻辑 inde ...
- 华为手表开发：WATCH 3 Pro（17）传感器订阅指南针
华为手表开发:WATCH 3 Pro(17)传感器订阅指南针 初 环境与设备 指南针传感器介绍与说明 鸿蒙开发 文件夹: 文件 新增展示的文本标记 index.hml index.css index. ...
- 华为手表开发：WATCH 3 Pro（3）创建项目以及运行完整流程
华为手表开发:WATCH 3 Pro(3)创建项目以及运行完整流程 初 环境与设备 创建项目 创建项目入口 配置项目 运行项目 报错 需要在 Appgallery Connect , 创建项目,然后在 ...
- 华为手表开发：WATCH 3 Pro（5）点击按钮弹窗
华为手表开发:WATCH 3 Pro(5)点击按钮弹窗 初 环境与设备 创建项目 认识目录结构 修改首页 -> 新建按钮 " 按钮 " 文件名:**index.hml** 引 ...
- 华为手表开发：GT3（1）配置调试设备
华为手表开发:GT3(1)配置调试设备 初 环境与设备 获取手表UUID 登录 AppGallery Connect 点击用户与访问 初 希望能写一些简单的教程和案例分享给需要的人 鸿蒙可穿戴开发 欢 ...
- 微信小程序定位开发 逆地理位置查询 经纬度获取位置名称
一. 微信小程序获取用户定位==>经纬度(官方) (1)官方方法:wx.getLocation(Object object) (2)官方链接:https://developers.weixin. ...
最新文章
- arch linux 下 安装搭建python机器学习环境
- linux下qt多个程序打包,解决Ubuntu下使用linuxdeployqt打包Qt程序问题
- Python Django单表增删改操作
- Web前端工程师的一些常见误区介绍！
- 用饮水机教你什么是RAID [转]
- android8.0应用图标适配调整_怎样更换macOS Big Sur 应用图标
- .Net Core控制台应用加载读取Json配置文件
- linux中副规则_Linux中的命名规范
- 如何自学并且系统学习计算机网络?(知乎问答)
- SVN服务器搭建详解
- c语言实现猜数字游戏
- mysql jemalloc_Jemalloc优化MySQL和Nginx
- python生成随机中文_随机字生成器-Python
- light动名词_英语语法大全之动名词
- 传微软iPod杀手Zune今年秋季上市 定价299美元
- linux 设备树 usb控制器,linux 设备树中 dwc3 节点的phys参数含义
- python——基础题
- 怎么查看电脑是多少位的
- 2014全球软件技术峰会WOT:R语言金融数据分析
- Python 编码规范(pep8)