0.0.10 • Published 2 years ago
game-circle v0.0.10
circle
游戏
安装
npm install game-circle
使用
必须开启 "enableSkia": "true"
- json
{
"usingComponents": {
"game": "game-circle/circle"
}
}
- mini.project.json
{
"node_modules_es6_whitelist": [
"common-game"
]
}
- js
Page({
data: {
gameSource: {
defImg: { src: "https://img.alicdn.com/imgextra/i4/1080040467/O1CN01TdkM9i1FJvfRJeLO2_!!1080040467.png", x: 300, y: 300, penSize: 20, rang: 100, checkMaxAngule: [250, 300] },
activeImg: { src: "https://img.alicdn.com/imgextra/i1/1080040467/O1CN01J9WHwz1FJvfTE0Krx_!!1080040467.png" },
startRange: Ï{ min: 165, max: 188 },//开始触摸点角度(圆心向右为基线,逆时针增加角度)
touchStarGame: !true,//游戏如果未开始,点击游戏区域自动开始
autoStartCallback: !true,//开始游戏回调方法
isShunshizhen: true,//是否顺时针转动
timePos: {
align: "right",
x: 695,
y: 90,
// bg: {
// src: "https://img.alicdn.com/imgextra/i1/555657275/O1CN01SqKaAA23c04M4oqRY_!!555657275.png",
// x: 48,
// y: 206
// },
time: 10,//倒计时时间
// 时间数字图片 0 - 9
numOffset: -4,//数字两边空白太多,增加偏移量
numArr: [
{
"src": "https://img.alicdn.com/imgextra/i3/1080040467/O1CN01MIsuJb1FJvf9UteWE_!!1080040467.png",
val: 0
},
{
"src": "https://img.alicdn.com/imgextra/i3/1080040467/O1CN018LGto51FJvf9UwGhM_!!1080040467.png",
val: 1
},
{
"src": "https://img.alicdn.com/imgextra/i3/1080040467/O1CN01x6LgsK1FJvfIQYLeP_!!1080040467.png",
val: 2
},
{
"src": "https://img.alicdn.com/imgextra/i4/1080040467/O1CN016POYXH1FJvfQBzbf9_!!1080040467.png",
val: 3
},
{
"src": "https://img.alicdn.com/imgextra/i1/1080040467/O1CN01RkXycP1FJvfEBK6JO_!!1080040467.png",
val: 4
},
{
"src": "https://img.alicdn.com/imgextra/i4/1080040467/O1CN010PG7zc1FJvfIwqdTl_!!1080040467.png",
val: 5
},
{
"src": "https://img.alicdn.com/imgextra/i1/1080040467/O1CN01jqswru1FJvfJpIxbd_!!1080040467.png",
val: 6
},
{
"src": "https://img.alicdn.com/imgextra/i3/1080040467/O1CN01p2iDLk1FJvfIMY9OB_!!1080040467.png",
val: 7
},
{
"src": "https://img.alicdn.com/imgextra/i1/1080040467/O1CN01aP0qoQ1FJvfOXnj0s_!!1080040467.png",
val: 8
},
{
"src": "https://img.alicdn.com/imgextra/i2/1080040467/O1CN01e9ZrKb1FJvfMGSnR2_!!1080040467.png",
val: 9
},
{
"src": "https://img.alicdn.com/imgextra/i4/1080040467/O1CN01SworjC1FJvfMcMajA_!!1080040467.png",
val: "s"
},
],
},
bgImgs: {
x: 0,
y: 0,
duration: 1,
arr: [
{ "src": "https://img.alicdn.com/imgextra/i4/1080040467/O1CN016QfVZS1FJvfJWNgIo_!!1080040467.png", "name": "H_00000.png", "width": "650", "height": "650" },
{ "src": "https://img.alicdn.com/imgextra/i2/1080040467/O1CN01w7oMlW1FJvfD3FvGk_!!1080040467.png", "name": "H_00001.png", "width": "650", "height": "650" },
{ "src": "https://img.alicdn.com/imgextra/i2/1080040467/O1CN01Q8bqMz1FJvfD3Fimi_!!1080040467.png", "name": "H_00002.png", "width": "650", "height": "650" },
{ "src": "https://img.alicdn.com/imgextra/i3/1080040467/O1CN01h94WNL1FJvfGoEi4s_!!1080040467.png", "name": "H_00003.png", "width": "650", "height": "650" },
{ "src": "https://img.alicdn.com/imgextra/i1/1080040467/O1CN01Gwbmw41FJvfD3H88z_!!1080040467.png", "name": "H_00004.png", "width": "650", "height": "650" },
{ "src": "https://img.alicdn.com/imgextra/i2/1080040467/O1CN01CfI9zx1FJvfIcWcVt_!!1080040467.png", "name": "H_00005.png", "width": "650", "height": "650" },
{ "src": "https://img.alicdn.com/imgextra/i4/1080040467/O1CN01I6RJIH1FJvfD3FaTN_!!1080040467.png", "name": "H_00006.png", "width": "650", "height": "650" },
{ "src": "https://img.alicdn.com/imgextra/i4/1080040467/O1CN01OetyEX1FJvfIcXQRh_!!1080040467.png", "name": "H_00007.png", "width": "650", "height": "650" },
{ "src": "https://img.alicdn.com/imgextra/i3/1080040467/O1CN01xC9ksy1FJvfCSwEKx_!!1080040467.png", "name": "H_00008.png", "width": "650", "height": "650" },
{ "src": "https://img.alicdn.com/imgextra/i3/1080040467/O1CN01ag9P5Q1FJvfIcW16P_!!1080040467.png", "name": "H_00009.png", "width": "650", "height": "650" },
{ "src": "https://img.alicdn.com/imgextra/i1/1080040467/O1CN01JAElaL1FJvfD3EeGd_!!1080040467.png", "name": "H_00010.png", "width": "650", "height": "650" },
{ "src": "https://img.alicdn.com/imgextra/i4/1080040467/O1CN01l138mG1FJvfIcWYMU_!!1080040467.png", "name": "H_00011.png", "width": "650", "height": "650" },
{ "src": "https://img.alicdn.com/imgextra/i1/1080040467/O1CN01F9Bk7P1FJvfGoEVbL_!!1080040467.png", "name": "H_00012.png", "width": "650", "height": "650" },
{ "src": "https://img.alicdn.com/imgextra/i1/1080040467/O1CN01ykuEoZ1FJvfFN3mhp_!!1080040467.png", "name": "H_00013.png", "width": "650", "height": "650" },
{ "src": "https://img.alicdn.com/imgextra/i3/1080040467/O1CN01FjjPaf1FJvf3dquMs_!!1080040467.png", "name": "H_00014.png", "width": "650", "height": "650" },
{ "src": "https://img.alicdn.com/imgextra/i2/1080040467/O1CN01mpCOdT1FJvf3dseSv_!!1080040467.png", "name": "H_00015.png", "width": "650", "height": "650" },
{ "src": "https://img.alicdn.com/imgextra/i1/1080040467/O1CN01XvdN2s1FJvf8IA6jj_!!1080040467.png", "name": "H_00016.png", "width": "650", "height": "650" },
{ "src": "https://img.alicdn.com/imgextra/i1/1080040467/O1CN01LCzaHS1FJvf8I7DxB_!!1080040467.png", "name": "H_00017.png", "width": "650", "height": "650" },
{ "src": "https://img.alicdn.com/imgextra/i4/1080040467/O1CN01TsuxdD1FJvfKGsyOe_!!1080040467.png", "name": "H_00018.png", "width": "650", "height": "650" },
{ "src": "https://img.alicdn.com/imgextra/i4/1080040467/O1CN01jrxWUU1FJvfD3Dyi8_!!1080040467.png", "name": "H_00019.png", "width": "650", "height": "650" },
{ "src": "https://img.alicdn.com/imgextra/i2/1080040467/O1CN015vQ8KB1FJvfGoDhgS_!!1080040467.png", "name": "H_00020.png", "width": "650", "height": "650" },
{ "src": "https://img.alicdn.com/imgextra/i2/1080040467/O1CN01UE40y61FJvfFN5jFu_!!1080040467.png", "name": "H_00021.png", "width": "650", "height": "650" },
{ "src": "https://img.alicdn.com/imgextra/i1/1080040467/O1CN01SD0mZQ1FJvfJWNsnb_!!1080040467.png", "name": "H_00022.png", "width": "650", "height": "650" },
{ "src": "https://img.alicdn.com/imgextra/i2/1080040467/O1CN01yM61ig1FJvfIcXtXN_!!1080040467.png", "name": "H_00023.png", "width": "650", "height": "650" },
{ "src": "https://img.alicdn.com/imgextra/i4/1080040467/O1CN01boEZz71FJvfCT0SLu_!!1080040467.png", "name": "H_00024.png", "width": "650", "height": "650" },
{ "src": "https://img.alicdn.com/imgextra/i1/1080040467/O1CN018Ymzcy1FJvfGLUUNF_!!1080040467.png", "name": "H_00025.png", "width": "650", "height": "650" },
{ "src": "https://img.alicdn.com/imgextra/i1/1080040467/O1CN01Gxz3Ge1FJvfIcYZ86_!!1080040467.png", "name": "H_00026.png", "width": "650", "height": "650" },
{ "src": "https://img.alicdn.com/imgextra/i3/1080040467/O1CN01klyStW1FJvfHuKjDq_!!1080040467.png", "name": "H_00027.png", "width": "650", "height": "650" },
{ "src": "https://img.alicdn.com/imgextra/i3/1080040467/O1CN01rq5Y3k1FJvf3dq2K8_!!1080040467.png", "name": "H_00028.png", "width": "650", "height": "650" },
{ "src": "https://img.alicdn.com/imgextra/i4/1080040467/O1CN01Dn7uBg1FJvfGLTkdW_!!1080040467.png", "name": "H_00029.png", "width": "650", "height": "650" },
{ "src": "https://img.alicdn.com/imgextra/i4/1080040467/O1CN01oWHwZe1FJvf8I9yQv_!!1080040467.png", "name": "H_00030.png", "width": "650", "height": "650" },
{ "src": "https://img.alicdn.com/imgextra/i4/1080040467/O1CN01mmHiai1FJvfGLTkdg_!!1080040467.png", "name": "H_00031.png", "width": "650", "height": "650" },
{ "src": "https://img.alicdn.com/imgextra/i3/1080040467/O1CN01NiPKVT1FJvfGoFux4_!!1080040467.png", "name": "H_00032.png", "width": "650", "height": "650" },
{ "src": "https://img.alicdn.com/imgextra/i2/1080040467/O1CN01H4fi0e1FJvfGLT54K_!!1080040467.png", "name": "H_00033.png", "width": "650", "height": "650" },
]
}
},
},
onLoad(query) {
console.log('page onLoad', query)
},
onShow() { },
onRef(ref) {
this.gameComponent = ref;
},
onInitDone() {
// 组件初始化完成
console.log("初始化完成")
},
onUpdate(obj) {
// maxAngule:旋转的最大角度
// timeOut:倒计时是否结束
console.log(obj.maxAngule)
if (obj.maxAngule >= 320) {
console.log("游戏成功")
this.stopGameFun();
} else {
if (obj.timeOut) {
console.log("游戏失败")
} else {
console.log("画圈失败,倒计时还未结束,可以继续游戏")
}
}
},
startGameFun() {
this.gameComponent.onEvent("start");
},
stopGameFun() {
this.gameComponent.onEvent("stop");
}
})
- xaml
<game1 gameSource="{{gameSource}}" onRef="onRef" onInitDone="onInitDone" onUpdate="onUpdate" onStartCallback="onStartCallback" />
<view onTap="startGameFun">开始游戏</view>
<view onTap="stopGameFun">结束游戏</view>