华为手表开发:WATCH 3 Pro(9)获取计步器

希望能写一些简单的教程和案例分享给需要的人

鸿蒙可穿戴开发

环境与设备

系统: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

在文本框中输入页面名称(showStepCounter)名称可以自己拟定

点击弹框右下角Finsin按钮完成页面创建

需要引用包

import sensor from ‘@ohos.sensor’;

代码如下:

showStepCounter.hml
<div class="container">
    <text class="title">
        当前步数 {{ stepCount }}
    </text>
</div>

showStepCounter.js

import sensor from '@system.sensor';

export default {
    data: {
        stepCount: '...'
    },
    onInit() {
        console.info("dao_logger::" + "计步器准备启动");
        sensor.subscribeStepCounter({
            success: function (ret) {
                this.stepCount = ret.steps;
                console.info("dao_logger::" + "当前步数为:" + ret.steps);
            },
            fail: function (data, code) {
                console.info("dao_logger::" + "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/showStepCounter/showStepCounter",
        });
    }
}

加入权限

我们在 config.json 里面加入就行了

    "reqPermissions": [
      {
        "name": "ohos.permission.ACTIVITY_MOTION"
      }
    ]

位置可以参考下面图片

在这里插入图片描述

点击结果 按钮跳转后 :

点击“允许”按钮提供权限

在这里插入图片描述

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

盗理者

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值