gm-game-music
v0.3.0
Published
``` npm install gm-game-music ```
Downloads
4
Readme
gm-game-music
音乐方块游戏
安装
npm install gm-game-music使用
必须开启 "enableSkia": "true"如果项目需要使用插件，在window下加上 disablePluginSandBox：“true”- json
{
"usingComponents": {
"gm-game-music": "gm-game-music/music"
}
}- js
Page({
data: {
gameSource: {
items: [
{
src: "https://img.alicdn.com/imgextra/i3/1080040467/O1CN01SwwmP61FJvaLej83C_!!1080040467.jpg",
type: "short",
num: 44,
width: 187,
height: 307,
active: { src: "https://img.alicdn.com/imgextra/i2/1080040467/O1CN01ZEgNCQ1FJvaOXd1QS_!!1080040467.jpg" },
score: [
{
min: 0,//最小百分比
max: 10,//最大百分比
score: 10,//分数
type: "PERFECT",//类型
src: "https://img.alicdn.com/imgextra/i2/1080040467/O1CN01MkIt7L1FJvaOl6Unk_!!1080040467.png",
width: 180,
height: 48,
top: 396,
fadeTime: 0,//毫秒 显示多久消失 0就不消失，直到下次更改状态
add: { src: "https://img.alicdn.com/imgextra/i1/1080040467/O1CN01qxlnUw1FJvaNXH49l_!!1080040467.png", width: 44, height: 64 },
minNum: { src: "https://img.alicdn.com/imgextra/i1/1080040467/O1CN01R0o0xt1FJvaNgc6WR_!!1080040467.png", width: 480, height: 64, fadeTime: 500 },
},
{
min: 10,//最小百分比
max: 25,//最大百分比
score: 6,//分数
type: "AWESOME",//类型
src: "https://img.alicdn.com/imgextra/i4/1080040467/O1CN01WfdPUM1FJvaMxAFwq_!!1080040467.png",
width: 222,
height: 48,
top: 396,
fadeTime: 0,//毫秒 显示多久消失 0就不消失，直到下次更新状态
add: { src: "https://img.alicdn.com/imgextra/i1/1080040467/O1CN01qxlnUw1FJvaNXH49l_!!1080040467.png", width: 44, height: 64 },
minNum: { src: "https://img.alicdn.com/imgextra/i1/1080040467/O1CN01R0o0xt1FJvaNgc6WR_!!1080040467.png", width: 480, height: 64, fadeTime: 500 },
},
{
min: 25,//最小百分比
max: 60,//最大百分比
score: 4,//分数
type: "GOOD",//类型
src: "https://img.alicdn.com/imgextra/i3/1080040467/O1CN01Dk1AvX1FJvaQa0sSl_!!1080040467.png",
width: 138,
height: 48,
top: 396,
fadeTime: 0,//毫秒 显示多久消失 0就不消失，直到下次更新状态
add: { src: "https://img.alicdn.com/imgextra/i1/1080040467/O1CN01qxlnUw1FJvaNXH49l_!!1080040467.png", width: 44, height: 64 },
minNum: { src: "https://img.alicdn.com/imgextra/i1/1080040467/O1CN01R0o0xt1FJvaNgc6WR_!!1080040467.png", width: 480, height: 64, fadeTime: 500 },
},
{
min: 60,//最小百分比
max: 100,//最大百分比
score: 0,//分数
type: "MISS",//类型
src: "https://img.alicdn.com/imgextra/i4/1080040467/O1CN01zCBu961FJvaMeJ341_!!1080040467.png",
width: 106,
height: 48,
top: 396,
fadeTime: 0,//毫秒 显示多久消失 0就不消失，直到下次更新状态
add: { src: "https://img.alicdn.com/imgextra/i1/1080040467/O1CN01qxlnUw1FJvaNXH49l_!!1080040467.png", width: 44, height: 64 },
minNum: { src: "https://img.alicdn.com/imgextra/i1/1080040467/O1CN01R0o0xt1FJvaNgc6WR_!!1080040467.png", width: 480, height: 64, fadeTime: 500 },
},
],
},
{
src: "https://img.alicdn.com/imgextra/i4/1080040467/O1CN01tAnTWF1FJvaNO6NDh_!!1080040467.png",
type: "long",
num: 22,
width: 251,
height: 679,
active: { src: "https://img.alicdn.com/imgextra/i2/1080040467/O1CN016zVU2B1FJvaSE1p26_!!1080040467.png" },
bound: { left: 32, right: 32, top: 32, bottom: 32 },
score: [
{
min: 95,//最小百分比
max: 100,//最大百分比
score: 15,//分数
type: "PERFECT",//类型
src: "https://img.alicdn.com/imgextra/i2/1080040467/O1CN01MkIt7L1FJvaOl6Unk_!!1080040467.png",
width: 180,
height: 48,
top: 396,
fadeTime: 0,//毫秒 显示多久消失 0就不消失，直到下次更新状态
add: { src: "https://img.alicdn.com/imgextra/i1/1080040467/O1CN01qxlnUw1FJvaNXH49l_!!1080040467.png", width: 44, height: 64 },
minNum: { src: "https://img.alicdn.com/imgextra/i1/1080040467/O1CN01R0o0xt1FJvaNgc6WR_!!1080040467.png", width: 480, height: 64, fadeTime: 500 },
},
{
min: 85,//最小百分比
max: 95,//最大百分比
score: 12,//分数
type: "AWESOME",//类型
src: "https://img.alicdn.com/imgextra/i4/1080040467/O1CN01WfdPUM1FJvaMxAFwq_!!1080040467.png",
width: 222,
height: 48,
top: 396,
fadeTime: 0,//毫秒 显示多久消失 0就不消失，直到下次更新状态
add: { src: "https://img.alicdn.com/imgextra/i1/1080040467/O1CN01qxlnUw1FJvaNXH49l_!!1080040467.png", width: 44, height: 64 },
minNum: { src: "https://img.alicdn.com/imgextra/i1/1080040467/O1CN01R0o0xt1FJvaNgc6WR_!!1080040467.png", width: 480, height: 64, fadeTime: 500 },
},
{
min: 40,//最小百分比
max: 85,//最大百分比
score: 8,//分数
type: "GOOD",//类型
src: "https://img.alicdn.com/imgextra/i3/1080040467/O1CN01Dk1AvX1FJvaQa0sSl_!!1080040467.png",
width: 138,
height: 48,
top: 396,
fadeTime: 0,//毫秒 显示多久消失 0就不消失，直到下次更新状态
add: { src: "https://img.alicdn.com/imgextra/i1/1080040467/O1CN01qxlnUw1FJvaNXH49l_!!1080040467.png", width: 44, height: 64 },
minNum: { src: "https://img.alicdn.com/imgextra/i1/1080040467/O1CN01R0o0xt1FJvaNgc6WR_!!1080040467.png", width: 480, height: 64, fadeTime: 500 },
},
{
min: 0,//最小百分比
max: 40,//最大百分比
score: 0,//分数
type: "MISS",//类型
src: "https://img.alicdn.com/imgextra/i4/1080040467/O1CN01zCBu961FJvaMeJ341_!!1080040467.png",
width: 106,
height: 48,
top: 396,
fadeTime: 0,//毫秒 显示多久消失 0就不消失，直到下次更新状态
add: { src: "https://img.alicdn.com/imgextra/i1/1080040467/O1CN01qxlnUw1FJvaNXH49l_!!1080040467.png", width: 44, height: 64 },
minNum: { src: "https://img.alicdn.com/imgextra/i1/1080040467/O1CN01R0o0xt1FJvaNgc6WR_!!1080040467.png", width: 480, height: 64, fadeTime: 500 },
},
],
},
],
totalScore: { src: "https://img.alicdn.com/imgextra/i4/1080040467/O1CN01qA65TD1FJvaKwPMt9_!!1080040467.png", width: 1130, height: 146, top: 260 },
line: { src: "https://img.alicdn.com/imgextra/i2/1080040467/O1CN01dkTbHO1FJvaQ0ljDP_!!1080040467.png", width: 750, height: 17, bottom: 340 },
music: {
bg: { src: "https://img.alicdn.com/imgextra/i4/1080040467/O1CN01bVzFqC1FJvaOYBfCu_!!1080040467.png", width: 639, height: 65, top: 166 },
play: { src: "https://img.alicdn.com/imgextra/i4/1080040467/O1CN01aOok8F1FJvaITHQ9h_!!1080040467.png", width: 108, height: 108, top: 166 }
},
clickPlayer: { src: "https://img.alicdn.com/imgextra/i1/1080040467/O1CN01GjOGcX1FJvaKk8GRQ_!!1080040467.png", width: 156, height: 156 }
},
audio: "http://isv-vod.alibabausercontent.com/RGjZJMdpNgKGVQeEyw8/mxVPucoRR1vDtdZicz6?auth_key=1600589495-0-0-996d53997df9421727cc4280354f48ee",
per: 0
},
onLoad() {
},
onRef(game) {
this.musicComponent = game;
},
beginFun() {
let bl = this.musicComponent.start();
if (!bl) {
my.alert({ content: "音乐还在缓冲中..." })
}
},
overFun() {
this.musicComponent.stop();
},
resetFun() {
this.musicComponent.reset();
},
onFinish(score) {
my.alert({
content: "游戏结束,总分数：" + score
})
},
onProgress(progress) {
// 资源读取进度回调
},
onError(e) {
// 资源读取报错回调
},
onInitDone() {
my.alert({
content: "游戏初始化完成"
})
},
onUpdate(item) {
/*
item:{
per:百分比
scoreObj:消除分数对象
sprite:{
imgObj:消除方块对象
}
}
scoreObj:{
min: 95,//最小百分比
max: 100,//最大百分比
score: 15,//分数
type: "PERFECT",//类型
src: "https://img.alicdn.com/imgextra/i2/1080040467/O1CN01MkIt7L1FJvaOl6Unk_!!1080040467.png",
width: 180,
height: 48,
top: 396,
fadeTime: 0,//毫秒 显示多久消失 0就不消失，直到下次更新状态
add: { src: "https://img.alicdn.com/imgextra/i1/1080040467/O1CN01qxlnUw1FJvaNXH49l_!!1080040467.png", width: 44, height: 64 },
minNum: { src: "https://img.alicdn.com/imgextra/i1/1080040467/O1CN01R0o0xt1FJvaNgc6WR_!!1080040467.png", width: 480, height: 64, fadeTime: 500 },
}
*/
// console.log(item)
/* my.alert({
content: "游戏消除了"
}) */
},
onAudioDone() {
my.alert({ content: "音乐缓存完毕" })
}
});
- xaml
<!--
audio:音乐地址
game-col: 元素掉落总列数，默认为4列
-->
<game-music
gameSource="{{gameSource}}"
game-col="{{4}}"
audio="{{audio}}"
onRef="onRef"
onProgress="onProgress"
onError="onError"
onFinish="onFinish"
onInitDone="onInitDone"
onUpdate="onUpdate"
onAudioDone="onAudioDone"
/>