更新记录
1.0.0(2022-04-07) 下载此版本
1.0.0 实现手势识别算法
平台兼容性
Android | Android CPU类型 | iOS |
---|---|---|
适用版本区间:5.0 - 11.0 | armeabi-v7a:支持,arm64-v8a:支持,x86:支持 | × |
原生插件通用使用流程:
- 购买插件,选择该插件绑定的项目。
- 在HBuilderX里找到项目,在manifest的app原生插件配置中勾选模块,如需要填写参数则参考插件作者的文档添加。
- 根据插件作者的提供的文档开发代码,在代码中引用插件,调用插件功能。
- 打包自定义基座,选择插件,得到自定义基座,然后运行时选择自定义基座,进行log输出测试。
- 开发完毕后正式云打包
付费原生插件目前不支持离线打包。
Android 离线打包原生插件另见文档 https://nativesupport.dcloud.net.cn/NativePlugin/offline_package/android
iOS 离线打包原生插件另见文档 https://nativesupport.dcloud.net.cn/NativePlugin/offline_package/ios
注意事项:使用HBuilderX2.7.14以下版本,如果同一插件且同一appid下购买并绑定了多个包名,提交云打包界面提示包名绑定不一致时,需要在HBuilderX项目中manifest.json->“App原生插件配置”->”云端插件“列表中删除该插件重新选择
石头剪刀布 猜丁壳 手势识别
1、插件说明 此插件实现手势识别算法。
2、代码示例
<template>
<view>
<view class="uni-container">
<view class="uni-hello-text">
<text class="hello-text">猜丁壳手势识别演示</text>
</view>
<button type="primary" plain="true" @click="testGesture()">Gesture</button>
</view>
<canvas :style="{ width: canw+'px', height: canh+'px' }" canvas-id="myCanvas" id="myCanvas"></canvas>
</view>
</template>
<script>
// 获取 module
const gesture = uni.requireNativePlugin('kk-gesture');
export default {
data() {
canw: 0,
canh: 0,
},
onLoad() {
gesture.create()
},
methods: {
testGesture() {
const _this = this
uni.chooseImage({
count: 1, //默认9
sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图,默认二者都有
sourceType: ['album', 'camera'], //从相册选择
success: async function(res) {
const info = await uni.getSystemInfoSync()
const image_path = plus.io.convertLocalFileSystemURL(res.tempFilePaths[0])
gesture.predict({
image: image_path,
threshold: 0.5
}, (ret) => {
// uni.showModal({
// title: '识别结果',
// content: JSON.stringify(ret),
// showCancel: false
// })
console.log(ret)
// const image_path = res.tempFilePaths[0]
// var ret = {"height":256,"objects":[{"confidence":0.8696145,"landmarks":[{"x":138,"y":224},{"x":170,"y":202},{"x":191,"y":171},{"x":199,"y":143},{"x":199,"y":123},{"x":148,"y":130},{"x":145,"y":91},{"x":141,"y":69},{"x":136,"y":51},{"x":126,"y":131},{"x":117,"y":90},{"x":110,"y":65},{"x":103,"y":45},{"x":107,"y":140},{"x":96,"y":104},{"x":89,"y":80},{"x":83,"y":62},{"x":90,"y":155},{"x":77,"y":130},{"x":69,"y":112},{"x":63,"y":96}],"text":"Paper"}],"width":256}
const styles = [
[0, 1], [1, 2], [2, 3], [3, 4],
[5, 6], [6, 7], [7, 8],
[9, 10], [10, 11], [11, 12],
[13, 14], [14, 15], [15, 16],
[17, 18], [18, 19], [19, 20],
[0, 5], [5, 9], [9, 13], [13, 17],
[0, 17],
];
var imgw = ret["width"]
var imgh = ret["height"]
_this.canw = info.windowWidth
_this.canh = info.windowWidth
var scale = Math.min(_this.canw / imgw, _this.canh / imgh)
var neww = scale * imgw
var newh = scale * imgh
var ctx = uni.createCanvasContext('myCanvas')
ctx.drawImage(res.tempFilePaths[0], 0, 0, neww, newh)
console.log(_this.canw, _this.canh, scale)
ctx.strokeStyle = "rgb(255, 255, 0)"
ctx.lineWidth = 3
ret.objects.forEach(obj => {
var lmk = obj.landmarks
styles.forEach(s => {
ctx.moveTo(lmk[s[0]].x * scale, lmk[s[0]].y * scale)
ctx.lineTo(lmk[s[1]].x * scale, lmk[s[1]].y * scale)
})
ctx.stroke()
ctx.setFontSize(24)
ctx.fillStyle = "#f00"
ctx.fillText(obj.text, 20, 50)
})
ctx.draw()
})
}
});
},
}
}
</script>