【一步步开发AI运动APP】六、运动计时计数能调用

之前我们为您分享了【一步步开发AI运动小程序】开发系列博文,通过该系列博文,很多开发者开发出了很多精美的AI健身、线上运动赛事、AI学生体测、美体、康复锻炼等应用场景的AI运动小程序;为了帮助开发者继续深耕AI运动领域市场,今天开始我们将为您分享新系列【一步步开发AI运动APP】的博文,带您开发性能更强、体验更好的AI运动APP。

通过前几篇博文,您已经可以通过插件在APP上进行抽帧、人体检测了,在获得到人体结构后,便可以进行运行分析实现人体计时计数了,uniAPP插件同微信小程序一样,仍然内置了跳绳、开合跳、俯卧撑、仰卧起坐、深蹲(深蹲起)、平板支撑、马步蹲 等多个常见运动,可以满足健身、线上赛事、学生体测等场景需求,若有个性运动定制需求,也可以使用插件提供的pose-calc姿态分析检测接口,进行自定义扩展,后续章节再向您介绍。

一、创建运动分析器

通过createSport(key string)可以创建相应的运动实例:

javascript 复制代码
import {getSports,createSport} from "@/uni_modules/yz-ai-sport";

function createSport(){
	//获取已注册的所有运动列表
	let sports = getSports();
	console.log(sports);
	
	//创建了一个开合跳运动分析器
	const sport = createSport('jumping-jack');
}

二、进行运动分析,监听计数变化

启动运动分析,并向运动分析器推送人体结构,即可开展运动分析进行计时计数:

javascript 复制代码
import {getSports,createSport} from "@/uni_modules/yz-ai-sport";

function createSport(){

	//创建了一个开合跳运动分析器
	const sport = createSport('jumping-jack');
	sport.onTick = (counts,times)=>{
		//当计时计数发生变化时,会触发onTick回调
		console.log(counts,times);
		//更新UI等操作
	};
	sport.start();//启动运动分析
	
	let human = ... //见前一节,进行人体识别
	sport.pushing(human);
}

三、停止、重置运动分析

可以调用sport.stop()停止或暂停运动分析,sport.reset()重置计数状态。

四、完整代码

html 复制代码
<template>
		<yz-ai-camera class="camera" :style="{width:previewWidth,height:previewHeight}" :device="cameraDevice"
			resolution="medium" @on-camera-ready="onCameraReady" />
		<yz-pose-grapher ref="grapher" class="grapher" :style="{width:previewWidth,height:previewHeight}"
			:scaleRate="previewRate" :offsetX="previewOffsetX" :offsetY="previewOffsetY" lineColor="#FFFFFF"
			pointColor="#0091ff" leftColor="#009d00" />
</template>
<script>

import {getCameraContext,createHumanDetector,getSports,createSport} from "@/uni_modules/yz-ai-sport";

let cameraContext;
let sport;

export default {
	data(){
		return {};
	}
	methods:{
		onCameraReady(){
			cameraContext = getCameraContext();
			sport = createSport('jumping-jack');
			sport.onTick=(counts,times)=>{
				console.log(counts,times);
			};
			soprt.start();
		},
		onDetecting(){
			let options = {
				multiple: false,
				enabledGPU: true,
				highPerformance: false
			};
			humanDetector = createHumanDetector(options);
			humanDetector.startExtractAndDetect({
				onDetected(result){
					let humans = result.humans;
					this.$refs.grapher.drawing(humans);
					
					sport.pushing(humans[0]);
				}
			});
		}
	}
}
</script>
相关推荐
lxmyzzs21 分钟前
【图像算法 - 21】慧眼识虫:基于深度学习与OpenCV的农田害虫智能识别系统
人工智能·深度学习·opencv·算法·yolo·目标检测·计算机视觉
Gloria_niki22 分钟前
机器学习之K 均值聚类算法
人工智能·机器学习
AI人工智能+29 分钟前
表格识别技术:通过图像处理与深度学习,将非结构化表格转化为可编辑结构化数据,推动智能化发展
人工智能·深度学习·ocr·表格识别
深圳多奥智能一卡(码、脸)通系统42 分钟前
智能二维码QR\刷IC卡\人脸AI识别梯控系统功能设计需基于模块化架构,整合物联网、生物识别、权限控制等技术,以下是多奥分层次的系统设计框架
人工智能·门禁·电梯门禁·二维码梯控·梯控·电梯
批量小王子1 小时前
2025-08-19利用opencv检测图片中文字及图片的坐标
人工智能·opencv·计算机视觉
没有梦想的咸鱼185-1037-16632 小时前
SWMM排水管网水力、水质建模及在海绵与水环境中的应用
数据仓库·人工智能·数据挖掘·数据分析
即兴小索奇2 小时前
【无标题】
人工智能·ai·商业·ai商业洞察·即兴小索奇
国际学术会议-杨老师2 小时前
2025年计算机视觉与图像国际会议(ICCVI 2025)
人工智能·计算机视觉
欧阳小猜2 小时前
深度学习②【优化算法(重点!)、数据获取与模型训练全解析】
人工智能·深度学习·算法
fsnine3 小时前
深度学习——神经网络
人工智能·深度学习·神经网络