0.0.4 • Published 2 years ago
game-ysl2 v0.0.4
ysl2
游戏
安装
npm install game-ysl2使用
必须开启 "enableSkia": "true"- json
{
"usingComponents": {
"game": "game-ysl2/ysl"
}
}- mini.project.json
{
"node_modules_es6_whitelist": [
"common-game"
]
}- js
Page({
data: {
gameSource: {
baseOps: {
speed: 3,//速度,值越大速度越块
speedXS: 3,//速度系数
minBottomY: 860,//从底部开始计算 元素最小状态时的Y坐标
minWidth: 320,//最小状态位置的宽度
maxBottomY: 320,//从底部开始计算 元素最大状态时的Y坐标
maxWidth: 750,//最大状态位置的宽度
xzMaxScale: true,//是否限制最大缩放比例 true:当超过maxBottomY位置之后,不再继续放大
stepH: 200,//两个物品之间的间距
},
liveY: 700,//生命线
gameShowRect: { x: 0, y: 0, width: 750, height: 700 },//游戏元素显示区域
items: [
{ def: { "src": "https://img.alicdn.com/imgextra/i2/1080040467/O1CN01k64aWR1FJvfIQZQB0_!!1080040467.png" }, showTime: 100, error: { src: "https://img.alicdn.com/imgextra/i3/1080040467/O1CN01Xy4Vmi1FJvfNpBzD3_!!1080040467.png" }, val: 10, bound: { left: 0, top: 0, right: 0, bottom: 17 }, probability: 1, scaleOps: { min: 0.2, max: 0.8 } },
{ def: { "src": "https://img.alicdn.com/imgextra/i2/1080040467/O1CN01xkaOh41FJvfK7UxTL_!!1080040467.png" }, showTime: 100, error: { src: "https://img.alicdn.com/imgextra/i2/1080040467/O1CN01sVny9x1FJvfLFzoGn_!!1080040467.png" }, val: 10, bound: { left: 0, top: 0, right: 0, bottom: 17 }, probability: 1, scaleOps: { min: 0.5, max: 1.1 } },
{ def: { "src": "https://img.alicdn.com/imgextra/i2/1080040467/O1CN01nqKiJA1FJvfEBK28Y_!!1080040467.png" }, showTime: 100, error: { src: "https://img.alicdn.com/imgextra/i2/1080040467/O1CN01j7njuh1FJvfIMaZ5D_!!1080040467.png" }, val: 10, bound: { left: 0, top: 0, right: 0, bottom: 17 }, probability: 1, scaleOps: { min: 0.5, max: 1.1 } },
{ def: { "src": "https://img.alicdn.com/imgextra/i4/1080040467/O1CN01LuwLby1FJvfLFybRM_!!1080040467.png" }, showTime: 100, error: { src: "https://img.alicdn.com/imgextra/i3/1080040467/O1CN01rZPijP1FJvfMGQNk1_!!1080040467.png" }, val: 10, bound: { left: 0, top: 0, right: 0, bottom: 17 }, probability: 1, scaleOps: { min: 0.3, max: 0.9 } },
],
clickObj: {
totalNum: 3,//按钮个数
padding: { left: 50, right: 50 },//左右内边距，除开以外就平分
showTime: 100,
top: 800,//点击按钮y坐标
def: { src: "https://img.alicdn.com/imgextra/i1/1080040467/O1CN01WCptTW1FJvfLFwerZ_!!1080040467.png" },
success: { src: "https://img.alicdn.com/imgextra/i4/1080040467/O1CN01Q52T1F1FJvfIwsVuE_!!1080040467.png", },
error: { src: "https://img.alicdn.com/imgextra/i4/1080040467/O1CN01sxM8BA1FJvfPSZzKt_!!1080040467.png" }
},
rongqiguangxiao: {
showTime: 100,
def: { src: "https://img.alicdn.com/imgextra/i1/1080040467/O1CN01LCISZf1FJvfFfpviC_!!1080040467.png", y: 100 },
success: { src: "https://img.alicdn.com/imgextra/i2/1080040467/O1CN01yE28zF1FJvfMjUsDx_!!1080040467.png", y: 100 },
error: { src: "https://img.alicdn.com/imgextra/i2/1080040467/O1CN016vpchc1FJvfMGSzuI_!!1080040467.png", y: 100 }
},
tipScorePos: {
fadeTime: 0.5,//消失时间
numOffset: -4,//数字两边空白太多，增加偏移量
x: 750 / 2,
y: 200,
scale: "1",
// bg: { src: "https://img.alicdn.com/imgextra/i2/1080040467/O1CN01FM8QxU1FJveZ9Z9j1_!!1080040467.png", x: 0, y: -30 },
numArr: [
{ "src": "https://img.alicdn.com/imgextra/i2/1080040467/O1CN01bKfga31FJvefiDgi3_!!1080040467.png", val: "+" },
{ "src": "https://img.alicdn.com/imgextra/i1/1080040467/O1CN01Uk6ILV1FJvejP28uq_!!1080040467.png", val: 0 },
{ "src": "https://img.alicdn.com/imgextra/i1/1080040467/O1CN01SFCu5S1FJvej7jKha_!!1080040467.png", val: 1 },
{ "src": "https://img.alicdn.com/imgextra/i1/1080040467/O1CN01gxqiz41FJveZ0mVJ2_!!1080040467.png", val: 2 },
{ "src": "https://img.alicdn.com/imgextra/i1/1080040467/O1CN012ld0fR1FJvefiBXek_!!1080040467.png", val: 3 },
{ "src": "https://img.alicdn.com/imgextra/i4/1080040467/O1CN01XcnWsR1FJvef87tV4_!!1080040467.png", val: 4 },
{ "src": "https://img.alicdn.com/imgextra/i4/1080040467/O1CN01Acs2WA1FJvejP1sHM_!!1080040467.png", val: 5 },
{ "src": "https://img.alicdn.com/imgextra/i1/1080040467/O1CN01HWYtQ71FJvehmHwkq_!!1080040467.png", val: 6 },
{ "src": "https://img.alicdn.com/imgextra/i2/1080040467/O1CN01GADOky1FJvefiAbQj_!!1080040467.png", val: 7 },
{ "src": "https://img.alicdn.com/imgextra/i4/1080040467/O1CN01jjj0bW1FJveZ0nubV_!!1080040467.png", val: 8 },
{ "src": "https://img.alicdn.com/imgextra/i3/1080040467/O1CN017VdUL61FJveZ0mq4Y_!!1080040467.png", val: 9 },
],
},
scorePos: {
align: "left",
x: 100,
y: 80,
// money: true,
bg: {
src: "https://img.alicdn.com/imgextra/i3/1080040467/O1CN01XKDCKs1FJvfIQXH9a_!!1080040467.png",
error: { src: "https://img.alicdn.com/imgextra/i3/1080040467/O1CN014dk9Md1FJvfFfqCKt_!!1080040467.png" },
def: { src: "https://img.alicdn.com/imgextra/i3/1080040467/O1CN01XKDCKs1FJvfIQXH9a_!!1080040467.png", },
x: 50,
y: 70
},
// 分数数字图片 0 - 9
numOffset: -6,//数字两边空白太多，增加偏移量
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
},
],
errorArr: [
{ src: "https://img.alicdn.com/imgextra/i2/1080040467/O1CN01y9r6MI1FJvfNpBW61_!!1080040467.png", val: 0 },
{ src: "https://img.alicdn.com/imgextra/i3/1080040467/O1CN01WQ3CZq1FJvf9Uv3pf_!!1080040467.png", val: 1 },
{ src: "https://img.alicdn.com/imgextra/i3/1080040467/O1CN018Txaer1FJvf9UsiK9_!!1080040467.png", val: 2 },
{ src: "https://img.alicdn.com/imgextra/i2/1080040467/O1CN01SnLkwA1FJvfMGRejL_!!1080040467.png", val: 3 },
{ src: "https://img.alicdn.com/imgextra/i3/1080040467/O1CN01KM1WZ21FJvfK7X2ON_!!1080040467.png", val: 4 },
{ src: "https://img.alicdn.com/imgextra/i1/1080040467/O1CN01LUHtdE1FJvfJpGkNL_!!1080040467.png", val: 5 },
{ src: "https://img.alicdn.com/imgextra/i2/1080040467/O1CN01H4nRZI1FJvfNpCFr7_!!1080040467.png", val: 6 },
{ src: "https://img.alicdn.com/imgextra/i2/1080040467/O1CN01zNdpbo1FJvfK7X2OW_!!1080040467.png", val: 7 },
{ src: "https://img.alicdn.com/imgextra/i3/1080040467/O1CN01hZPwwB1FJvfEBKuC6_!!1080040467.png", val: 8 },
{ src: "https://img.alicdn.com/imgextra/i4/1080040467/O1CN01NUoqH61FJvfIwrZhx_!!1080040467.png", val: 9 },
]
},
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: -6,//数字两边空白太多，增加偏移量
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/i3/1080040467/O1CN01AxXVE31FJvfPSaj5b_!!1080040467.png",
val: "s"
},
],
errorArr: [
{ src: "https://img.alicdn.com/imgextra/i2/1080040467/O1CN01y9r6MI1FJvfNpBW61_!!1080040467.png", val: 0 },
{ src: "https://img.alicdn.com/imgextra/i3/1080040467/O1CN01WQ3CZq1FJvf9Uv3pf_!!1080040467.png", val: 1 },
{ src: "https://img.alicdn.com/imgextra/i3/1080040467/O1CN018Txaer1FJvf9UsiK9_!!1080040467.png", val: 2 },
{ src: "https://img.alicdn.com/imgextra/i2/1080040467/O1CN01SnLkwA1FJvfMGRejL_!!1080040467.png", val: 3 },
{ src: "https://img.alicdn.com/imgextra/i3/1080040467/O1CN01KM1WZ21FJvfK7X2ON_!!1080040467.png", val: 4 },
{ src: "https://img.alicdn.com/imgextra/i1/1080040467/O1CN01LUHtdE1FJvfJpGkNL_!!1080040467.png", val: 5 },
{ src: "https://img.alicdn.com/imgextra/i2/1080040467/O1CN01H4nRZI1FJvfNpCFr7_!!1080040467.png", val: 6 },
{ src: "https://img.alicdn.com/imgextra/i2/1080040467/O1CN01zNdpbo1FJvfK7X2OW_!!1080040467.png", val: 7 },
{ src: "https://img.alicdn.com/imgextra/i3/1080040467/O1CN01hZPwwB1FJvfEBKuC6_!!1080040467.png", val: 8 },
{ src: "https://img.alicdn.com/imgextra/i4/1080040467/O1CN01NUoqH61FJvfIwrZhx_!!1080040467.png", val: 9 },
{ src: "https://img.alicdn.com/imgextra/i1/1080040467/O1CN01qGuTfk1FJvfNpCSLN_!!1080040467.png", val: "s" },
]
},
}
},
onLoad() {
},
// 组件主动公开方法----------
beginFun() {
// 开始游戏
this.gameComponent.onEvent("start");
},
stopFun() {
// 结束游戏
this.gameComponent.onEvent("stop");
},
resetFun(e) {
// 重置游戏
this.gameComponent.onEvent("reset");
},
pauseFun() {
// 暂停游戏
this.gameComponent.onEvent("pause");
},
// 组件回调方法------------------
onRef(game) {
this.gameComponent = game;
console.log("进入游戏")
},
onInitDone() {
// my.alert({
// content: "游戏初始化完成"
// })
// 初始化game
this.gameComponent.onEvent("reset");
},
onUpdate(ops) {
// { totalScore: 0, imgObj: { } }
console.log(ops)
},
onGameOver(totalScore) {
console.log(totalScore)
},
});- xaml
<game gameSource="{{gameSource}}"
onRef="onRef"
onInitDone="onInitDone"
onUpdate="onUpdate"
onGameOver="onGameOver"
/>
<view onTap="beginFun" style="position:relative;z-index: 10;">开始</view>
<view onTap="pauseFun" style="position:relative;z-index: 10;">暂停</view>
<view onTap="stopFun" style="position:relative;z-index: 10;">结束</view>
<view onTap="resetFun" style="position:relative;z-index: 10;">重置游戏</view>