0.0.7 • Published 2 years ago
game-bigrich2 v0.0.7
game-bigrich2
游戏
安装
npm install game-bigrich2
使用
必须开启 "enableSkia": "true"
- json
{
"usingComponents": {
"game": "game-bigrich2/index"
}
}
- mini.project.json
{
"node_modules_es6_whitelist": [
"common-game"
]
}
- js
Page({
data: {
gameSource: JSON.stringify({
ops: {
singleBoxDuration: 0.1,//单个格子移动的时间
bgMoveDuration: 1,//单次人物移动完之后背景移动动画时间
minMoveNum: 3,//必须超过此值才移动背景
centerPos: {
x: 750 / 2,
y: 1000
},
numberShowTime: 1000,//色子显示时间(毫秒)
num2Offset: {
x: -4,
y: -64
},
box: { src: "https://img.alicdn.com/imgextra/i3/1080040467/O1CN01ahbCya1FJvhJaDi4o_!!1080040467.png", alpha: 0 },
// box: { src: "https://img.alicdn.com/imgextra/i4/1080040467/O1CN01xTJTCI1FJvhCPSMv7_!!1080040467.png", }
},
initStep: 0,//初始位置
// number
number: {
srcArr: [
{ "src": "https://img.alicdn.com/imgextra/i3/1080040467/O1CN01WGt7s71FJvhJjwJER_!!1080040467.png", "name": "帧 0.png", "width": "314", "height": "339", val: 1 },
{ "src": "https://img.alicdn.com/imgextra/i4/1080040467/O1CN01CESReT1FJvhHvNPlX_!!1080040467.png", "name": "帧 1.png", "width": "314", "height": "332" },
{ "src": "https://img.alicdn.com/imgextra/i2/1080040467/O1CN01iAv9OW1FJvhIc2JUP_!!1080040467.png", "name": "帧 2.png", "width": "314", "height": "333" },
{ "src": "https://img.alicdn.com/imgextra/i3/1080040467/O1CN019WPBif1FJvhCVsoY2_!!1080040467.png", "name": "帧 3.png", "width": "314", "height": "332" },
{ "src": "https://img.alicdn.com/imgextra/i4/1080040467/O1CN01pWeojM1FJvhBlVVR7_!!1080040467.png", "name": "帧 4.png", "width": "314", "height": "333" },
{ "src": "https://img.alicdn.com/imgextra/i1/1080040467/O1CN01kZOJbw1FJvh9b4pyy_!!1080040467.png", "name": "帧 5.png", "width": "314", "height": "338", val: 2 },
{ "src": "https://img.alicdn.com/imgextra/i1/1080040467/O1CN01xDzICa1FJvhBstAET_!!1080040467.png", "name": "帧 6.png", "width": "314", "height": "332" },
{ "src": "https://img.alicdn.com/imgextra/i3/1080040467/O1CN01YKR9re1FJvhDtBCNK_!!1080040467.png", "name": "帧 7.png", "width": "314", "height": "333" },
{ "src": "https://img.alicdn.com/imgextra/i2/1080040467/O1CN01xvRDcg1FJvhGl0cO4_!!1080040467.png", "name": "帧 8.png", "width": "314", "height": "332" },
{ "src": "https://img.alicdn.com/imgextra/i1/1080040467/O1CN01p4SADD1FJvhF6hUOu_!!1080040467.png", "name": "帧 9.png", "width": "314", "height": "333" },
{ "src": "https://img.alicdn.com/imgextra/i4/1080040467/O1CN01LALYKf1FJvhHvLbVw_!!1080040467.png", "name": "帧 10.png", "width": "314", "height": "338", val: 3 },
{ "src": "https://img.alicdn.com/imgextra/i4/1080040467/O1CN01FimT2N1FJvhDtDoW3_!!1080040467.png", "name": "帧 11.png", "width": "314", "height": "332" },
{ "src": "https://img.alicdn.com/imgextra/i2/1080040467/O1CN01Fh607p1FJvhDtD8wo_!!1080040467.png", "name": "帧 12.png", "width": "314", "height": "333" },
{ "src": "https://img.alicdn.com/imgextra/i3/1080040467/O1CN01AQ2UZQ1FJvh8xTG0y_!!1080040467.png", "name": "帧 13.png", "width": "314", "height": "332" },
{ "src": "https://img.alicdn.com/imgextra/i1/1080040467/O1CN01H9cDPn1FJvhHvL4FA_!!1080040467.png", "name": "帧 14.png", "width": "314", "height": "333" },
{ "src": "https://img.alicdn.com/imgextra/i1/1080040467/O1CN01r6RlpF1FJvhJjvlyF_!!1080040467.png", "name": "帧 15.png", "width": "314", "height": "338", val: 4 },
{ "src": "https://img.alicdn.com/imgextra/i3/1080040467/O1CN01hnqZJh1FJvhCVt5B3_!!1080040467.png", "name": "帧 16.png", "width": "314", "height": "332" },
{ "src": "https://img.alicdn.com/imgextra/i3/1080040467/O1CN01wWaiVQ1FJvhF6lNZF_!!1080040467.png", "name": "帧 17.png", "width": "314", "height": "333" },
{ "src": "https://img.alicdn.com/imgextra/i4/1080040467/O1CN01TKbqlX1FJvh8xQVa8_!!1080040467.png", "name": "帧 18.png", "width": "314", "height": "332" },
{ "src": "https://img.alicdn.com/imgextra/i2/1080040467/O1CN01uEpXQi1FJvhGkz0b8_!!1080040467.png", "name": "帧 19.png", "width": "314", "height": "333" },
{ "src": "https://img.alicdn.com/imgextra/i2/1080040467/O1CN01pTVM2J1FJvh7Odtg1_!!1080040467.png", "name": "帧 20.png", "width": "314", "height": "338", val: 5 },
{ "src": "https://img.alicdn.com/imgextra/i3/1080040467/O1CN01exYaUI1FJvhDtDwql_!!1080040467.png", "name": "帧 21.png", "width": "314", "height": "332" },
{ "src": "https://img.alicdn.com/imgextra/i1/1080040467/O1CN012i9uHT1FJvhHvMkBD_!!1080040467.png", "name": "帧 22.png", "width": "314", "height": "333" },
{ "src": "https://img.alicdn.com/imgextra/i3/1080040467/O1CN01zOkZGl1FJvhF6iE9e_!!1080040467.png", "name": "帧 23.png", "width": "314", "height": "332" },
{ "src": "https://img.alicdn.com/imgextra/i1/1080040467/O1CN01eb56Tm1FJvhKTTBEa_!!1080040467.png", "name": "帧 24.png", "width": "314", "height": "333" },
{ "src": "https://img.alicdn.com/imgextra/i4/1080040467/O1CN01s4NupL1FJvhBlUIce_!!1080040467.png", "name": "帧 25.png", "width": "314", "height": "338", val: 6 },
{ "src": "https://img.alicdn.com/imgextra/i2/1080040467/O1CN01A9xQgM1FJvhBlWe6k_!!1080040467.png", "name": "帧 26.png", "width": "314", "height": "332" },
{ "src": "https://img.alicdn.com/imgextra/i3/1080040467/O1CN018qUqqz1FJvh9b4Ik5_!!1080040467.png", "name": "帧 27.png", "width": "314", "height": "333" },
{ "src": "https://img.alicdn.com/imgextra/i3/1080040467/O1CN01kfQg9k1FJvhKTUFjT_!!1080040467.png", "name": "帧 28.png", "width": "314", "height": "332" },
{ "src": "https://img.alicdn.com/imgextra/i1/1080040467/O1CN01XfJNux1FJvh2a1NJp_!!1080040467.png", "name": "帧 29.png", "width": "314", "height": "333" },
],
type: "animate",
width: "314",
height: "338",
boomSpeed: "0.51",
anchor: { x: 0.5, y: 0.5 },
x: 375,
y: 500,
},
number2: [
{ "src": "https://img.alicdn.com/imgextra/i2/1080040467/O1CN01uZiY6T1FJvhIdb7TX_!!1080040467.png", "val": "0", "offsetX": "4", "width": "25", "height": "31" },
{ "src": "https://img.alicdn.com/imgextra/i2/1080040467/O1CN01go0Ku81FJvhGmaV9M_!!1080040467.png", "val": "1", "offsetX": "4", "width": "13", "height": "31" },
{ "src": "https://img.alicdn.com/imgextra/i3/1080040467/O1CN01arFC6d1FJvhJlXnvV_!!1080040467.png", "val": "2", "offsetX": "4", "width": "23", "height": "31" },
{ "src": "https://img.alicdn.com/imgextra/i4/1080040467/O1CN01zwpLNd1FJvhG7ex2q_!!1080040467.png", "val": "3", "offsetX": "4", "width": "24", "height": "31" },
{ "src": "https://img.alicdn.com/imgextra/i2/1080040467/O1CN01ZZH1QV1FJvhDunQbd_!!1080040467.png", "val": "4", "offsetX": "4", "width": "25", "height": "31" },
{ "src": "https://img.alicdn.com/imgextra/i3/1080040467/O1CN01xSaSv61FJvhBn3mLD_!!1080040467.png", "val": "5", "offsetX": "4", "width": "24", "height": "31" },
{ "src": "https://img.alicdn.com/imgextra/i1/1080040467/O1CN011MVgSP1FJvh2bfLqx_!!1080040467.png", "val": "6", "offsetX": "4", "width": "24", "height": "31" },
{ "src": "https://img.alicdn.com/imgextra/i2/1080040467/O1CN01KNDlnU1FJvh8z2XEc_!!1080040467.png", "val": "7", "offsetX": "4", "width": "24", "height": "31" },
{ "src": "https://img.alicdn.com/imgextra/i3/1080040467/O1CN01xssiPU1FJvhDumxUW_!!1080040467.png", "val": "8", "offsetX": "4", "width": "24", "height": "31" },
{ "src": "https://img.alicdn.com/imgextra/i2/1080040467/O1CN01phqOlg1FJvh7Q7Gbq_!!1080040467.png", "val": "9", "offsetX": "4", "width": "24", "height": "31" },
],
// 奖品配置
items: [
{ src: "https://img.alicdn.com/imgextra/i3/1080040467/O1CN01gHfDHM1FJvhFwDkGO_!!1080040467.png", width: 104, height: 108, anchor: { x: 0.5, y: 0.5 }, offset: { x: 70, y: -80 } },
],
start: { src: "https://img.alicdn.com/imgextra/i3/1080040467/O1CN01Q5fl6q1FJvhHleLS7_!!1080040467.png", fx: "right", x: 163, y: 30 },//第一格子
map: {
src: "https://img.alicdn.com/imgextra/i1/1080040467/O1CN01H4ELYp1FJvh7F1sUR_!!1080040467.png", width: 750, height: 1523, y: 1000, offset: { bottom: 144 },
childArr: [
// boxType: 1:黄色 2:红色 3:橙色 4:酒红色
{ boxType: 1, fx: "left", firstFx: "right", offset: { x: -55, y: -58 } },
{ boxType: 1, fx: "right", offset: { x: -70, y: -48 } },
{ boxType: 1, fx: "right", offset: { x: -70, y: -48 } },
{ boxType: 2, fx: "right", offset: { x: -70, y: -48 } },
{ boxType: 1, fx: "left", offset: { x: -230, y: -44 } },
{ boxType: 1, fx: "top", offset: { x: -156, y: -84 } },
{ boxType: 1, fx: "right", offset: { x: -70, y: -48 } },
{ boxType: 1, fx: "left", offset: { x: -230, y: -44 } },
{ boxType: 2, fx: "left", offset: { x: -230, y: -44 }, prizeOffset: { x: 10, y: 0 } },
{ boxType: 1, fx: "right", offset: { x: -70, y: -48 } },
{ boxType: 1, fx: "right", offset: { x: -70, y: -48 } },
{ boxType: 2, fx: "right", offset: { x: -70, y: -48 } },
{ boxType: 1, fx: "left", offset: { x: -230, y: -44 } },
{ boxType: 1, fx: "left", offset: { x: -230, y: -44 } },
{ boxType: 1, fx: "bottom", offset: { x: -220, y: 44 } },
{ boxType: 1, fx: "left", offset: { x: -230, y: -44 } },
{ boxType: 1, fx: "right", offset: { x: -70, y: -48 } },
{ boxType: 2, fx: "left", offset: { x: -230, y: -44 } },
{ boxType: 1, fx: "right", offset: { x: -70, y: -48 } },
{ boxType: 1, fx: "right", offset: { x: -70, y: -48 } },
{ boxType: 2, fx: "top", offset: { x: -156, y: -84 } },
{ boxType: 1, fx: "right", offset: { x: -70, y: -48 } },
{ boxType: 1, fx: "left", offset: { x: -224, y: -50 } },
{ boxType: 1, fx: "left", offset: { x: -220, y: -44 } },
{ boxType: 1, fx: "right", offset: { x: -70, y: -48 } },
{ boxType: 2, fx: "left", offset: { x: -220, y: -44 } },
{ boxType: 1, fx: "right", offset: { x: -70, y: -48 } },
{ boxType: 1, fx: "top", offset: { x: -156, y: -94 } },
{ boxType: 1, fx: "left", offset: { x: -220, y: -44 } },
]
},//offset:每个方向的格子边界偏移量
player: { src: "https://img.alicdn.com/imgextra/i2/1080040467/O1CN01dU0pE31FJvhGb8tGT_!!1080040467.png", anchor: { x: 0.45, y: 0.95 } }
}),
},
onLoad(query) {
my.pt = this;
},
playFun() {
// 获取player元素后面6个格子对象 6:返回指定个数
let t = this.gameComponent.onEvent("getBox", 6);
console.log(t)
// 开始移动,6:移动的格数
let num = parseInt((Math.random() * 6) + 1)
this.gameComponent.onEvent("playDice", {
num: num,
callback: () => {
this.gameComponent.onEvent("go", num);
}
});
},
onRef(game) {
this.gameComponent = game;
console.log("进入游戏")
},
onInitDone() {
/* my.alert({
content: "游戏初始化完成"
}) */
},
onUpdate(ops) {
// { totalScore: 0, imgObj: { } }
console.log(ops)
// 获取player位置
let pos = this.gameComponent.onEvent("getPlayerPos");
this.setData({
x: pos.x,
y: pos.y
})
},
onGameOver(totalScore) {
console.log(totalScore)
}
})
- xaml
<view class="pageBox">
<game gameSource="{{gameSource}}" onRef="onRef" onInitDone="onInitDone" onUpdate="onUpdate" onGameOver="onGameOver" />
<view style="position:absolute;width:200rpx;height:200rpx;background:rgba(0,0,0,0.3);left:{{x}}rpx;top:{{y}}rpx;"></view>
</view>
<view onTap="playFun" style="position:absolute;left: 40%;bottom: 100rpx;">开始</view>
-acss
.pageBox{
position: absolute;
width: 750rpx;
height: 100vh;
left: 50%;
top: 50%;
transform: translateX(-50%) translateY(-50%);
background-color: #ccc;
}