0.2.0 • Published 3 years ago
gm-game-doudou1 v0.2.0
gm-game-doudou
豆豆小游戏
安装
npm install gm-game-doudou1使用
- app.json
此版本是使用canvas- json
{
"usingComponents": {
"gm-game-doudou": "gm-game-doudou/doudou"
}
}- js
Page({
data: {
gameSource: {
// 可行区域
roadHengBaseImg: {
src: "https://img.alicdn.com/imgextra/i4/1080040467/O1CN01qlb4y21FJvaTFca2x_!!1080040467.png",
width: 1000,
height: 6
},
roadShuBaseImg: {
src: "https://img.alicdn.com/imgextra/i3/1080040467/O1CN01cnrHfd1FJvaRX5QAP_!!1080040467.png",
width: 6,
height: 1000
},
roadItems: [
// 横线
{
lineType: "roadHengBaseImg",
width: 283,
height: 6,
left: 41,
top: 42,
},
{
lineType: "roadHengBaseImg",
width: 283,
height: 6,
left: 387,
top: 42,
},
{
lineType: "roadHengBaseImg",
width: 490,
height: 6,
left: 110,
top: 180,
},
{
lineType: "roadHengBaseImg",
width: 214,
height: 6,
left: 110,
top: 249,
},
{
lineType: "roadHengBaseImg",
width: 214,
height: 6,
left: 387,
top: 249,
},
{
lineType: "roadHengBaseImg",
width: 144,
height: 6,
left: 41,
top: 319,
},
{
lineType: "roadHengBaseImg",
width: 144,
height: 6,
left: 525,
top: 319,
},
{
lineType: "roadHengBaseImg",
width: 628,
height: 6,
left: 41,
top: 388,
},
{
lineType: "roadHengBaseImg",
width: 628,
height: 6,
left: 41,
top: 457,
},
{
lineType: "roadHengBaseImg",
width: 144,
height: 6,
left: 41,
top: 526,
},
{
lineType: "roadHengBaseImg",
width: 144,
height: 6,
left: 525,
top: 526,
},
{
lineType: "roadHengBaseImg",
width: 490,
height: 6,
left: 110,
top: 595,
},
{
lineType: "roadHengBaseImg",
width: 75,
height: 6,
left: 110,
top: 664,
},
{
lineType: "roadHengBaseImg",
width: 75,
height: 6,
left: 249,
top: 664,
},
{
lineType: "roadHengBaseImg",
width: 75,
height: 6,
left: 387,
top: 664,
},
{
lineType: "roadHengBaseImg",
width: 75,
height: 6,
left: 525,
top: 664,
},
{
lineType: "roadHengBaseImg",
width: 75,
height: 6,
left: 110,
top: 734,
},
{
lineType: "roadHengBaseImg",
width: 213,
height: 6,
left: 249,
top: 734,
},
{
lineType: "roadHengBaseImg",
width: 75,
height: 6,
left: 525,
top: 734,
},
{
lineType: "roadHengBaseImg",
width: 145,
height: 6,
left: 179,
top: 803,
},
{
lineType: "roadHengBaseImg",
width: 144,
height: 6,
left: 387,
top: 803,
},
{
lineType: "roadHengBaseImg",
width: 490,
height: 6,
left: 110,
top: 872,
},
{
lineType: "roadHengBaseImg",
width: 283,
height: 6,
left: 41,
top: 941,
},
{
lineType: "roadHengBaseImg",
width: 283,
height: 6,
left: 387,
top: 941,
},
// 竖线
{
lineType: "roadShuBaseImg",
width: 6,
height: 352,
left: 41,
top: 42,
},
{
lineType: "roadShuBaseImg",
width: 6,
height: 144,
left: 110,
top: 42,
},
{
lineType: "roadShuBaseImg",
width: 6,
height: 144,
left: 318,
top: 42,
},
{
lineType: "roadShuBaseImg",
width: 6,
height: 144,
left: 387,
top: 42,
},
{
lineType: "roadShuBaseImg",
width: 6,
height: 144,
left: 595,
top: 42,
},
{
lineType: "roadShuBaseImg",
width: 6,
height: 352,
left: 664,
top: 42,
},
{
lineType: "roadShuBaseImg",
width: 6,
height: 214,
left: 249,
top: 180,
},
{
lineType: "roadShuBaseImg",
width: 6,
height: 214,
left: 456,
top: 180,
},
{
lineType: "roadShuBaseImg",
width: 6,
height: 75,
left: 110,
top: 388,
},
{
lineType: "roadShuBaseImg",
width: 6,
height: 75,
left: 594,
top: 388,
},
{
lineType: "roadShuBaseImg",
width: 6,
height: 490,
left: 41,
top: 457,
},
{
lineType: "roadShuBaseImg",
width: 6,
height: 351,
left: 249,
top: 457,
},
{
lineType: "roadShuBaseImg",
width: 6,
height: 351,
left: 456,
top: 457,
},
{
lineType: "roadShuBaseImg",
width: 6,
height: 490,
left: 664,
top: 457,
},
{
lineType: "roadShuBaseImg",
width: 6,
height: 75,
left: 110,
top: 595,
},
{
lineType: "roadShuBaseImg",
width: 6,
height: 75,
left: 318,
top: 595,
},
{
lineType: "roadShuBaseImg",
width: 6,
height: 75,
left: 387,
top: 595,
},
{
lineType: "roadShuBaseImg",
width: 6,
height: 75,
left: 594,
top: 595,
},
{
lineType: "roadShuBaseImg",
width: 6,
height: 144,
left: 110,
top: 734,
},
{
lineType: "roadShuBaseImg",
width: 6,
height: 144,
left: 594,
top: 734,
},
{
lineType: "roadShuBaseImg",
width: 6,
height: 122,
left: 179,
top: 664,
},
{
lineType: "roadShuBaseImg",
width: 6,
height: 122,
left: 525,
top: 664,
},
{
lineType: "roadShuBaseImg",
width: 6,
height: 144,
left: 318,
top: 803,
},
{
lineType: "roadShuBaseImg",
width: 6,
height: 144,
left: 387,
top: 803,
},
],
player: {
src: "https://img.alicdn.com/imgextra/i3/1080040467/O1CN01CvByKa1FJvaVOOXoR_!!1080040467.png",
width: 96,
height: 112,
direction: "left",//图片方向
directionImg: {
"left": { src: "https://img.alicdn.com/imgextra/i3/1080040467/O1CN01CvByKa1FJvaVOOXoR_!!1080040467.png" },
"right": { src: "https://img.alicdn.com/imgextra/i2/1080040467/O1CN01kA8QEb1FJvaRrNNnu_!!1080040467.png" },
},
anchor: { //中心位置，0-1之间
x: 0.8,
y: 0.8
}
},
energy: [
{
src: "https://img.alicdn.com/imgextra/i1/1080040467/O1CN01iZl36J1FJvaTYhHZ4_!!1080040467.png",
width: 58,
height: 64,
val: 10,
direction: "left",
anchor: {
x: 0.5,
y: 0.5,
},
probability: 1,//出现概率
},
{
src: "https://img.alicdn.com/imgextra/i4/1080040467/O1CN01sMh8Wg1FJvaYhIk0Q_!!1080040467.png",
width: 50,
height: 65,
val: 10,
direction: "left",
anchor: {
x: 0.5,
y: 0.5,
},
probability: 1,//出现概率
},
{
src: "https://img.alicdn.com/imgextra/i4/1080040467/O1CN016VbrCM1FJvaTYil2L_!!1080040467.png",
width: 44,
height: 152,
val: 10,
direction: "left",
anchor: {
x: 0.5,
y: 0.5,
},
probability: 1,//出现概率
},
{
src: "https://img.alicdn.com/imgextra/i4/1080040467/O1CN01yPH9pc1FJvaZ20DbX_!!1080040467.png",
width: 68,
height: 64,
val: 10,
direction: "left",
anchor: {
x: 0.5,
y: 0.5,
},
probability: 1,//出现概率
},
{
src: "https://img.alicdn.com/imgextra/i2/1080040467/O1CN01ibo5SJ1FJvaU9fro3_!!1080040467.png",
width: 44,
height: 102,
val: 10,
direction: "left",
anchor: {
x: 0.5,
y: 0.5,
},
probability: 1,//出现概率
},
{
src: "https://img.alicdn.com/imgextra/i2/1080040467/O1CN01EHr3Rv1FJvaU9hH9N_!!1080040467.png",
width: 86,
height: 84,
val: 10,
direction: "left",
anchor: {
x: 0.5,
y: 0.5,
},
probability: 1,//出现概率
},
{
src: "https://img.alicdn.com/imgextra/i2/1080040467/O1CN01aqnIX51FJvaRXTODH_!!1080040467.png",
width: 64,
height: 76,
val: 10,
direction: "left",
anchor: {
x: 0.5,
y: 0.5,
},
probability: 1,//出现概率
},
{
src: "https://img.alicdn.com/imgextra/i4/1080040467/O1CN01eWmeuV1FJvaU9icJW_!!1080040467.png",
width: 71,
height: 58,
val: 10,
direction: "left",
anchor: {
x: 0.5,
y: 0.5,
},
probability: 1,//出现概率
},
{
src: "https://img.alicdn.com/imgextra/i1/1080040467/O1CN01Vt4zSZ1FJvaRXTnA0_!!1080040467.png",
width: 58,
height: 96,
val: 10,
direction: "left",
anchor: {
x: 0.5,
y: 0.5,
},
probability: 1,//出现概率
},
{
src: "https://img.alicdn.com/imgextra/i1/1080040467/O1CN01NnFESW1FJvaRXSicp_!!1080040467.png",
width: 44,
height: 65,
val: 10,
direction: "left",
anchor: {
x: 0.5,
y: 0.5,
},
probability: 1,//出现概率
},
],
barrier: [
{
src: "https://img.alicdn.com/imgextra/i3/1080040467/O1CN01ohzX7e1FJvaR5bx6k_!!1080040467.png",
width: 48,
height: 84,
direction: "right",
directionImg: {
"left": { src: "https://img.alicdn.com/imgextra/i2/1080040467/O1CN01LJkh0s1FJvaYeNXVh_!!1080040467.png" },
"right": { src: "https://img.alicdn.com/imgextra/i3/1080040467/O1CN01ohzX7e1FJvaR5bx6k_!!1080040467.png" },
},
isPlay: true,
anchor: {
x: 0.5,
y: 0.5,
},
probability: 1,//出现概率
},
{
src: "https://img.alicdn.com/imgextra/i2/1080040467/O1CN01icJGvl1FJvaXrmTuQ_!!1080040467.png",
width: 88,
height: 76,
direction: "right",
directionImg: {
"left": { src: "https://img.alicdn.com/imgextra/i1/1080040467/O1CN01x8IFoe1FJvaWAQ5iI_!!1080040467.png" },
"right": { src: "https://img.alicdn.com/imgextra/i2/1080040467/O1CN01icJGvl1FJvaXrmTuQ_!!1080040467.png" },
},
isPlay: true,
anchor: {
x: 0.5,
y: 0.5,
},
probability: 1,//出现概率
},
{
src: "https://img.alicdn.com/imgextra/i1/1080040467/O1CN01uYzSpz1FJvaRXTrIq_!!1080040467.png",
width: 64,
height: 48,
direction: "left",
directionImg: {
"left": { src: "https://img.alicdn.com/imgextra/i1/1080040467/O1CN01uYzSpz1FJvaRXTrIq_!!1080040467.png" },
"right": { src: "https://img.alicdn.com/imgextra/i3/1080040467/O1CN01SUnxRU1FJvaWpTQXE_!!1080040467.png" },
},
isPlay: true,
anchor: {
x: 0.5,
y: 0.5,
},
probability: 1,//出现概率
},
{
src: "https://img.alicdn.com/imgextra/i2/1080040467/O1CN0187OcnY1FJvaTYgTge_!!1080040467.png",
width: 72,
height: 40,
direction: "left",
directionImg: {
"left": { src: "https://img.alicdn.com/imgextra/i2/1080040467/O1CN0187OcnY1FJvaTYgTge_!!1080040467.png" },
"right": { src: "https://img.alicdn.com/imgextra/i1/1080040467/O1CN01JncLAg1FJvaWpSgov_!!1080040467.png" },
},
isPlay: true,
anchor: {
x: 0.5,
y: 0.5,
},
probability: 1,//出现概率
},
{
src: "https://img.alicdn.com/imgextra/i2/1080040467/O1CN01tZal9I1FJvaVOOoSj_!!1080040467.png",
width: 60,
height: 24,
direction: "left",
directionImg: {
"left": { src: "https://img.alicdn.com/imgextra/i2/1080040467/O1CN01tZal9I1FJvaVOOoSj_!!1080040467.png" },
"right": { src: "https://img.alicdn.com/imgextra/i1/1080040467/O1CN0117JCnB1FJvaRrb4yw_!!1080040467.png" },
},
isPlay: true,
anchor: {
x: 0.5,
y: 0.5,
},
probability: 1,//出现概率
},
{
src: "https://img.alicdn.com/imgextra/i1/1080040467/O1CN018Oiszd1FJvaYhMUsc_!!1080040467.png",
width: 54,
height: 52,
direction: "right",
directionImg: {
"left": { src: "https://img.alicdn.com/imgextra/i3/1080040467/O1CN01Mpj9fD1FJvaQn0AuT_!!1080040467.png" },
"right": { src: "https://img.alicdn.com/imgextra/i1/1080040467/O1CN018Oiszd1FJvaYhMUsc_!!1080040467.png" },
},
isPlay: true,
anchor: {
x: 0.5,
y: 0.5,
},
probability: 1,//出现概率
},
{
src: "https://img.alicdn.com/imgextra/i4/1080040467/O1CN01dWb2M91FJvaXrkGhz_!!1080040467.png",
width: 42,
height: 44,
direction: "left",
directionImg: {
"left": { src: "https://img.alicdn.com/imgextra/i4/1080040467/O1CN01dWb2M91FJvaXrkGhz_!!1080040467.png" },
"right": { src: "https://img.alicdn.com/imgextra/i4/1080040467/O1CN01dWb2M91FJvaXrkGhz_!!1080040467.png" },
},
isPlay: true,
anchor: {
x: 0.5,
y: 0.5,
},
probability: 1,//出现概率
},
],
defaultEnergyNum: 6,//开始游戏能量数量
defaultEnergyPos: [
{ x: 44, y: 45 },
{ x: 320, y: 45 },
{ x: 390, y: 45 },
{ x: 667, y: 45 },
{ x: 252, y: 183 },
{ x: 459, y: 183 },
{ x: 113, y: 598 },
{ x: 598, y: 598 },
{ x: 44, y: 710 },
{ x: 667, y: 710 },
{ x: 113, y: 875 },
{ x: 598, y: 875 },
{ x: 321, y: 944 },
{ x: 390, y: 944 },
],
defaultBarrierNum: 3,//开始游戏障碍物数量
defaultBarrierPos: [
{ x: 113, y: 45 },
{ x: 598, y: 45 },
{ x: 44, y: 210 },
{ x: 667, y: 210 },
{ x: 113, y: 391 },
{ x: 598, y: 391 },
{ x: 44, y: 528 },
{ x: 667, y: 528 },
{ x: 183, y: 736 },
{ x: 528, y: 736 },
{ x: 44, y: 944 },
{ x: 667, y: 944 },
],
defaultPlayerPos: [
{ x: 356, y: 183 },
{ x: 356, y: 390 },
{ x: 356, y: 597 },
{ x: 356, y: 737 },
{ x: 356, y: 875 },
],
},
},
onLoad() { },
onRef(game) {
this.doudouGameComponent = game;
},
overFun() {
this.doudouGameComponent.stop();
},
beginFun() {
my.alert({
content: "游戏开始"
})
this.doudouGameComponent.start();
},
resetFun() {
this.doudouGameComponent.reset();
},
onFinish(sprite) {
if (!!sprite) {
my.alert({
content: "游戏结束"
})
} else {
my.alert({
content: "游戏成功"
})
}
},
onInitDone() {
/* my.alert({
content: "游戏初始化完成"
}) */
},
onUpdate(item) {
// imgObj:消除对象
// {curScore,totalScore,imgObj}
this.setData({
totalScore: item.totalScore,
curScore: item.curScore,
})
},
});- xaml
<!--
onInitDone:游戏渲染完回调
onUpdate:游戏消除回调
onFinish:游戏结束回调
-->
<doudou
gameSource="{{gameSource}}"
onRef="onRef"
onInitDone="onInitDone"
onUpdate="onUpdate"
onFinish="onFinish"
/>