Skip to content

Z
zjzy_client_game
Commit abf88f4b authored by 王勇霞's avatar 王勇霞
Browse files
Options

拼图小游戏

parent 3f987fa6
Show whitespace changes
Inline Side-by-side
Showing with 316 additions and 584 deletions
resource/game/tips.png
View replaced file @ 3f987fa6 View file @ abf88f4b
resource/game/tips.png

27.4 KB | W: | H:

resource/game/tips.png

4.3 KB | W: | H:

resource/game/tips.png
resource/game/tips.png
resource/game/tips.png
resource/game/tips.png
  • 2-up
  • Swipe
  • Onion skin
resource/res.json
View file @ abf88f4b
...@@ -33,7 +33,7 @@ ...@@ -33,7 +33,7 @@
"name": "common" "name": "common"
}, },
{ {
"keys": "1.png,2.png,3.png,4.png,back.png,cardBg.jpg,hand.png,tips.png,按钮.png,规则.png,返回.png", "keys": "hand.png,tips.png,底图背景.png,指向.png",
"name": "game" "name": "game"
}, },
{ {
......
src/Main.ts
View file @ abf88f4b
...@@ -30,24 +30,22 @@ export class Main { ...@@ -30,24 +30,22 @@ export class Main {
constructor(canvas: HTMLCanvasElement, data = { constructor(canvas: HTMLCanvasElement, data = {
needGuide: true, needGuide: true,
uiConfig: { uiConfig: {
cardBackBg:
"https://yun.duiba.com.cn/aurora/assets/3ddcd8fae8c5f382c6a54a93a343b0f297f68d4e.png",
cardFontBg1:
"https://yun.duiba.com.cn/aurora/assets/4a1cb2affeb9024ada20078108cdd05737ba9168.png",
cardFontBg2:
"https://yun.duiba.com.cn/aurora/assets/96f167f23e8691e50e65dc79bb5b709272a447ee.png",
cardFontBg3:
"https://yun.duiba.com.cn/aurora/assets/1f4da40a6bd75817b2f3cc1d35ee2a436b4db39c.png",
cardFontBg4:
"https://yun.duiba.com.cn/aurora/assets/3fe99f439878e90979a779c12cbb25cfce48f725.png",
mainBg: mainBg:
"https://yun.duiba.com.cn/aurora/assets/cee253d9388f52840d17c05686200e631a2d826b.png", "https://yun.duiba.com.cn/aurora/assets/b76307c3830811177a4bce87a7d07fd04a9646de.png",
ruleBtn:
"https://yun.duiba.com.cn/aurora/assets/aa3c770ff5f844351a7bb4d2a2ee3f1574fb9a51.png",
serviceBtn: serviceBtn:
"https://yun.duiba.com.cn/aurora/assets/307a139dd1ec7a7e6b552faf17fd35c9e7032b10.png", "https://yun.duiba.com.cn/aurora/assets/925b347e43fde06f793ae313d3e67d06e17cec38.png",
ruleBtn:
"https://yun.duiba.com.cn/aurora/assets/fc23c1787f39e8ba169153daf0513448729133ef.png",
mainBtn: mainBtn:
"https://yun.duiba.com.cn/aurora/assets/5c56beda337c4513d7d6eeaee4da377a7090b3d2.png", "https://yun.duiba.com.cn/aurora/assets/b890b2c45802e5112b256db7594d4244901b0044.png",
cardBg1:
"https://yun.duiba.com.cn/aurora/assets/035c6e18dfed4edf140dc21d4a32e2ee2754079e.png",
cardBg2:
"https://yun.duiba.com.cn/aurora/assets/e2fa2ceef3208e261a752014433b4274dc6a4533.png",
cardBg3:
"https://yun.duiba.com.cn/aurora/assets/2d9cbb2af52668b1dd962aad03e0f833c7d0dc9d.png",
cardBg4:
"https://yun.duiba.com.cn/aurora/assets/40f7165b41c37956ee2c39c65b6b0be6b661a024.png",
} }
}) { }) {
Tools.gameData = data Tools.gameData = data
......
src/ResJson.ts
View file @ abf88f4b
...@@ -533,89 +533,45 @@ export const ResJson = { ...@@ -533,89 +533,45 @@ export const ResJson = {
} }
}, },
{ {
"keys": "1.png,2.png,3.png,4.png,back.png,cardBg.jpg,hand.png,tips.png,按钮.png,规则.png,返回.png", "keys": "hand.png,tips.png,底图背景.png,指向.png",
"name": "game", "name": "game",
"atlas": { "atlas": {
"tips.png": { "底图背景.png": {
"x": 2, "x": 2,
"y": 2, "y": 2,
"w": 523, "w": 620,
"h": 72, "h": 620,
"ox": 0, "ox": 0,
"oy": 0, "oy": 0,
"sw": 523, "sw": 620,
"sh": 72, "sh": 620,
"ro": false "ro": false
}, },
"按钮.png": { "tips.png": {
"x": 2, "x": 624,
"y": 76, "y": 2,
"w": 348, "w": 414,
"h": 101, "h": 29,
"ox": 0,
"oy": 0,
"sw": 348,
"sh": 101,
"ro": false
},
"3.png": {
"x": 2,
"y": 179,
"w": 140,
"h": 265,
"ox": 0,
"oy": 0,
"sw": 140,
"sh": 265,
"ro": true
},
"back.png": {
"x": 2,
"y": 321,
"w": 140,
"h": 265,
"ox": 0, "ox": 0,
"oy": 0, "oy": 0,
"sw": 140, "sw": 414,
"sh": 265, "sh": 29,
"ro": true "ro": true
}, },
"1.png": { "指向.png": {
"x": 269,
"y": 179,
"w": 140,
"h": 264,
"ox": 0,
"oy": 0,
"sw": 140,
"sh": 264,
"ro": false
},
"2.png": {
"x": 2, "x": 2,
"y": 463, "y": 624,
"w": 141, "w": 151,
"h": 264, "h": 147,
"ox": 0, "ox": 0,
"oy": 0, "oy": 0,
"sw": 141, "sw": 151,
"sh": 264, "sh": 147,
"ro": true
},
"4.png": {
"x": 527,
"y": 2,
"w": 140,
"h": 264,
"ox": 0,
"oy": 0,
"sw": 140,
"sh": 264,
"ro": false "ro": false
}, },
"hand.png": { "hand.png": {
"x": 268, "x": 155,
"y": 463, "y": 624,
"w": 119, "w": 119,
"h": 120, "h": 120,
"ox": 0, "ox": 0,
...@@ -623,28 +579,6 @@ export const ResJson = { ...@@ -623,28 +579,6 @@ export const ResJson = {
"sw": 119, "sw": 119,
"sh": 120, "sh": 120,
"ro": false "ro": false
},
"规则.png": {
"x": 352,
"y": 76,
"w": 91,
"h": 50,
"ox": 0,
"oy": 0,
"sw": 91,
"sh": 50,
"ro": true
},
"返回.png": {
"x": 404,
"y": 76,
"w": 91,
"h": 53,
"ox": 0,
"oy": 0,
"sw": 91,
"sh": 53,
"ro": true
} }
} }
}, },
...@@ -892,5 +826,5 @@ export const ResJson = { ...@@ -892,5 +826,5 @@ export const ResJson = {
} }
} }
], ],
"path": "https://yun.duiba.com.cn/db_games/activity/template/1669024227/resource/" "path": "https://yun.duiba.com.cn/db_games/activity/template/1669103592/resource/"
} }
\ No newline at end of file
src/template/Game.ts
View file @ abf88f4b
...@@ -4,56 +4,67 @@ import { Scene } from "../../module/views/Scene"; ...@@ -4,56 +4,67 @@ import { Scene } from "../../module/views/Scene";
import { GDispatcher } from "../Main"; import { GDispatcher } from "../Main";
import { Tools } from "../Tools"; import { Tools } from "../Tools";
import UI from "../UI"; import UI from "../UI";
import { guideList, list, defaultUI } from "./GameConfig"; import { defaultUI } from "./GameConfig";
let lastIndex = -1; // 最后一次点击的下标
export class Game extends Scene { export class Game extends Scene {
get groupNames() { get groupNames() {
return ["game"]; return ["game"];
} }
// 传输数据
needGuide = false; needGuide = false;
uiConfig = defaultUI; uiConfig = defaultUI;
differValue = 0;
mainBg: FYGE.Sprite;
backBtn: FYGE.Sprite; backBtn: FYGE.Sprite;
ruleBtn: FYGE.Sprite; ruleBtn: FYGE.Sprite;
startBtn: FYGE.Sprite; startBtn: FYGE.Sprite;
handSvga: Hand;
// 引导部分 // 引导部分
guidelayer; guidelayer;
guideWrap: FYGE.Container; guideWrap: FYGE.Container;
puzzleBox: FYGE.Sprite;
// 游戏部分 textureList: Chip[] = []; //未打乱的图片数组
gamelayer; textureContanier: FYGE.Container;
gameWrap: FYGE.Container; sortArr = [];
gameBack: FYGE.Sprite; startPositionX: number = 0;
startPositionY: number = 0;
currentPositionX: number = 0;
currentPositionY: number = 0;
startTarget;
currentTarget;
direction: -1 | 0 | 1 | 2;
correctNumber: number = 0;
canMove: boolean = false;
isPause: boolean = true;
tween1: FYGE.Tween;
tween2: FYGE.Tween;
isFinish: number = 0;
puzzleIndex: number = 2;
list = []; // 数组
guideCardList = []; // 新手引导中的卡片列表
cardList = []; // 游戏中的卡片列表
guideStep = 1; // 引导步数
initUi() { initUi() {
this.needGuide = Tools.gameData.needGuide; // 模板中传过来的 // 模板中传过来的
this.uiConfig = Tools.gameData.uiConfig; // 模板中传过来的UI this.needGuide = Tools.gameData.needGuide;
this.uiConfig = Tools.gameData.uiConfig; // UI配置
if (document.body.clientHeight <= 667) {
this.differValue = 80;
}
UI.Sp(this, this.uiConfig.mainBg, 0, 0); this.mainBg = UI.Sp(this, this.uiConfig.mainBg, 0, this.differValue);
this.backBtn = UI.Sp(this, this.uiConfig.serviceBtn, 0, 274); this.backBtn = UI.Sp(this.mainBg, this.uiConfig.serviceBtn, 0, 229);
this.ruleBtn = UI.Sp(this, this.uiConfig.ruleBtn, 608, 274); this.ruleBtn = UI.Sp(this.mainBg, this.uiConfig.ruleBtn, 586, 229);
this.startBtn = UI.Sp(this, this.uiConfig.mainBtn, 224, 1231); this.startBtn = UI.Sp(this.mainBg, this.uiConfig.mainBtn, 224, 1141);
this.textureContanier = UI.Ctn(this.mainBg, 75, 496);
// 遍历生成底图 // 遍历生成底图
for (let i = 0; i < 8; i++) { this.textureList = [];
UI.Sp( for (var i = 0; i < 4; i++) {
this, const chip = new Chip();
this.uiConfig.cardBackBg, chip.init(this.uiConfig["cardBg" + (i + 1)], i);
Math.floor(i % 4) * 168 + 50, this.textureList.push(chip);
Math.floor(i / 4) * 360 - 15 + 538 this.textureContanier
); .addChild(chip)
} .position.set(Math.floor(i % 2) * 302, Math.floor(i / 2) * 302);
// 如果是新手引导阶段, 有手势引导
if (this.needGuide) {
this.handSvga = this.startBtn.addChild(new Hand());
this.handSvga.position.set(200, -120);
} }
// 添加点击事件 // 添加点击事件
this.backBtn.addEventListener( this.backBtn.addEventListener(
FYGE.MouseEvent.CLICK, FYGE.MouseEvent.CLICK,
...@@ -65,7 +76,6 @@ export class Game extends Scene { ...@@ -65,7 +76,6 @@ export class Game extends Scene {
this.ruleBtn.addEventListener( this.ruleBtn.addEventListener(
FYGE.MouseEvent.CLICK, FYGE.MouseEvent.CLICK,
function () { function () {
// 活动规则-wyx
GDispatcher.dispatchEvent("openRule"); GDispatcher.dispatchEvent("openRule");
}, },
this this
...@@ -73,402 +83,289 @@ export class Game extends Scene { ...@@ -73,402 +83,289 @@ export class Game extends Scene {
this.startBtn.addEventListener( this.startBtn.addEventListener(
FYGE.MouseEvent.CLICK, FYGE.MouseEvent.CLICK,
function () { function () {
// 开始游戏-wyx
Tools.btnDelay(this.startBtn);
if (this.needGuide) { if (this.needGuide) {
this.needGuide = false;
this.onEnterGuide(); this.onEnterGuide();
} else { } else {
GDispatcher.dispatchEvent("startId"); Tools.btnDelay(this.startBtn);
this.gameUIRender(); this.gameUIRender();
} }
}, },
this this
); );
}
guideUIRender() {
this.guidelayer = UI.Ctn(this, 0, 0);
this.guidelayer.addChild(
Tools.getRect(layers.stageWidth, 1624, 0x0000000, 0.6)
);
this.guideWrap = UI.Ctn(this.guidelayer, 50, 530);
UI.Sp(this.guideWrap, "tips.png", 56, 720);
this.list = JSON.parse(JSON.stringify(guideList));
this.cardList = [];
this.list.map((item, i) => {
const card = new GuideCard({
...item,
index: i,
list: this.list,
cardList: this.guideCardList,
});
this.guideCardList.push(card);
this.guideWrap // 移动事件
.addChild(card) this.textureContanier.addEventListener(
.position.set(Math.floor(i % 4) * 168, Math.floor(i / 4) * 360 - 15); FYGE.MouseEvent.MOUSE_DOWN,
this.guideCardList[i].alpha = 0; this.mouseDownEvent,
FYGE.Tween.get(this.guideCardList[i])
.wait(i * 200)
.to(
{
y: Math.floor(i / 4) * 360,
alpha: 1,
},
500
);
});
this.guidelayer.addEventListener(
FYGE.MouseEvent.CLICK,
function () {
this.clickGuideCard();
},
this this
); );
} this.textureContanier.addEventListener(
gameUIRender() { FYGE.MouseEvent.MOUSE_MOVE,
this.gamelayer = UI.Sp(this, this.uiConfig.mainBg, 0, 0); this.mouseMoveEvent,
// this.gameBack = UI.Sp(this.gamelayer, "返回.png", 0, 274); this
// this.gameBack.addEventListener(
// FYGE.MouseEvent.CLICK,
// function () {
// this.removeChild(this.gamelayer);
// },
// this
// );
this.gameWrap = UI.Ctn(this.gamelayer, 50, 530);
this.list = JSON.parse(JSON.stringify(list)).sort(
() => Math.random() - 0.5
);
this.cardList = [];
this.list.map((item, i) => {
const card = new Card({
...item,
index: i,
list: this.list,
cardList: this.cardList,
});
this.cardList.push(card);
this.gameWrap
.addChild(card)
.position.set(Math.floor(i % 4) * 168, Math.floor(i / 4) * 360 - 15);
this.cardList[i].alpha = 0;
FYGE.Tween.get(this.cardList[i])
.wait(i * 200)
.to(
{
y: Math.floor(i / 4) * 360,
alpha: 1,
},
500
); );
}); this.textureContanier.addEventListener(
} FYGE.MouseEvent.MOUSE_UP,
onEnterGuide() { this.mouseUpEvent,
this.startBtn.removeChild(this.handSvga); this
this.guideUIRender();
}
clickGuideCard() {
console.log("点击卡片");
if (this.guideStep == 1) {
this.guideCardList[2].removeHand();
this.guideCardList[5].handSvga = this.guideCardList[5].addChild(
new Hand()
); );
this.guideCardList[2].onOverTurn(this.guideCardList[2]);
} else if (this.guideStep == 2) {
this.guideCardList[5].removeHand();
this.guideCardList[5].onOverTurn(this.guideCardList[5], () => {
setTimeout(() => {
this.guideCardList[2].onZoomCard(this.guideCardList[2]);
this.guideCardList[5].onZoomCard(this.guideCardList[5]);
});
});
} else if (this.guideStep == 3) {
// 回到游戏
this.removeChild(this.guidelayer);
}
this.guideStep += 1;
} }
start(data) { start(data) {
super.start(); super.start();
} }
closeGame() {
// e.data.isGuide;
this.removeChild(this.gamelayer);
}
initEvents() { // 新手引导
super.initEvents(); onEnterGuide() {
GDispatcher.addEventListener("closeGame", this.closeGame, this); this.needGuide = false;
} this.guideUIRender();
removeEvents() {
super.removeEvents();
GDispatcher.removeEventListener("closeGame", this.closeGame, this);
} }
} guideUIRender() {
this.guidelayer = UI.Ctn(this, 0, 0);
class Card extends FYGE.Container { this.guidelayer.addChild(
img; Tools.getRect(layers.stageWidth, 1624, 0x0000000, 0.8)
uiConfig = Tools.gameData.uiConfig; );
public isFront = false; // 是否正面 this.guideWrap = UI.Ctn(this.guidelayer, 0, 487);
public match = false; // 是否匹配 this.puzzleBox = UI.Sp(this.guideWrap, "底图背景.png", 64, 0);
public type; // 类型 UI.Sp(this.guideWrap, "指向.png", 341, 643);
constructor(data?) { UI.Sp(this.guideWrap, "tips.png", 168, 826);
super(); for (var i = 0; i < 4; i++) {
this.initUi(data); UI.Sp(
this.puzzleBox,
this.uiConfig["cardBg" + (i + 1)],
Math.floor(i % 2) * 302 + 9,
Math.floor(i / 2) * 302 + 9
);
} }
this.guidelayer.addEventListener(
initUi(data) {
this.type = data.type;
this.img = UI.Sp(this, this.uiConfig.cardBackBg, 0, 0);
this.img.anchorX = 70;
this.img.anchorY = 133;
this.addEventListener(
FYGE.MouseEvent.CLICK, FYGE.MouseEvent.CLICK,
function () { function () {
Tools.btnDelay(this); this.clickGuideCard();
this.clickCard(data);
}, },
this this
); );
} }
clickCard(data) { clickGuideCard() {
if (this.isFront) return; this.removeChild(this.guidelayer);
this.isFront = true;
this.onOverTurn(this, () => {
if (lastIndex > -1) {
console.log(data.list[lastIndex].type, data.type);
if (data.list[lastIndex].type === data.type) {
const tempIndex = lastIndex;
lastIndex = -1;
// 匹配成功, 进行动画缩放
// 当前卡片缩放
this.onZoomCard(data.cardList[data.index]);
// 上一个卡片缩放
this.onZoomCard(data.cardList[tempIndex], () => {
// 检测是否完成, 提交游戏
if (this.checkIsAllMatch(data.cardList)) {
console.log("提交游戏");
GDispatcher.dispatchEvent("submit");
} }
});
} else {
const tempIndex = lastIndex;
lastIndex = -1;
// 等待一段时间翻转
setTimeout(() => {
// 当前卡片翻转
this.onOverTurn(data.cardList[data.index], () => {
data.cardList[data.index].isFront = false;
});
// 上一个卡片翻转 gameUIRender() {
this.onOverTurn(data.cardList[tempIndex], () => { this.isPause = false;
data.cardList[tempIndex].isFront = false; this.canMove = true;
}); console.log("开始游戏");
}, 500); this.startBtnHandle(false);
} GDispatcher.dispatchEvent("startId");
} else { this.onUpsetOrder();
lastIndex = data.index; }
} /**
}); * @param canClick 能否点击
} */
onOverTurn(that, callback = () => {}) { startBtnHandle(canClick) {
FYGE.Tween.get(that.img) if (canClick) {
.to( this.startBtn.visible = true;
{
scaleX: 0,
},
200
)
.call(() => {
if (that.match) {
that.img.texture = FYGE.Texture.fromUrl(this.uiConfig.cardBackBg);
that.match = false;
} else { } else {
that.img.texture = FYGE.Texture.fromUrl( this.startBtn.visible = false;
this.uiConfig["cardFontBg" + that.type]
);
that.match = true;
} }
FYGE.Tween.get(that.img)
.to(
{
scaleX: 1,
},
200
)
.call(() => {
console.log("翻转结束");
if (callback) {
callback();
} }
// 打乱顺序
onUpsetOrder() {
// 因为默认顺序是1234
this.sortArr = Array.from(Array(4), (_, index) => index);
this.sortArr.sort(() => {
return 0.5 - Math.random();
}); });
}); const oldArr = Array.from(Array(4), (_, index) => index);
} if (this.sortArr.join() == oldArr.join()) {
onZoomCard(that, callback = () => {}) { // console.info("相等");
FYGE.Tween.get(that.img) this.onUpsetOrder();
.to( return;
{ }
scaleX: 1.2, let tempArr = [];
scaleY: 1.2, for (let i = 0; i < this.sortArr.length; i++) {
}, tempArr[this.sortArr[i]] = this.textureList[i];
300 }
) for (let i = 0; i < 4; i++) {
.call(() => { let x = Math.floor(this.sortArr[0] % 2) * 302;
FYGE.Tween.get(that.img) let y = Math.floor(this.sortArr[0] / 2) * 302;
.to( this.sortArr.splice(0, 1);
{ FYGE.Tween.get(this.textureList[i])
scaleX: 1, .to({ x: x, y: y }, 1000)
scaleY: 1,
},
300
)
.call(() => { .call(() => {
console.log("缩放结束"); this.isFinish++;
that.match = true; if (this.isFinish >= 4) {
if (callback) { GDispatcher.dispatchEvent("finish");
callback();
} }
}); });
});
}
// 检测是否全部翻完
checkIsAllMatch(list) {
for (const item of list) {
if (!item.match) {
return false;
}
} }
return true; this.textureList = tempArr;
}
mouseDownEvent(e: FYGE.MouseEvent) {
if (this.isPause) return;
if (!this.canMove) return;
this.startPositionX = e.stageX;
this.startPositionY = e.stageY;
this.startTarget = e.currentTarget.parent.parent;
}
mouseMoveEvent(e: FYGE.MouseEvent) {
if (this.isPause) return;
if (!this.canMove) return;
this.currentPositionX = e.stageX;
this.currentPositionY = e.stageY;
let X = this.currentPositionX - this.startPositionX;
let Y = this.currentPositionY - this.startPositionY;
if (Math.abs(X) > Math.abs(Y) && X > 0) {
if (this.startTarget.x >= 425) return;
// console.log("向右划")
this.direction = 2;
} else if (Math.abs(X) > Math.abs(Y) && X < 0) {
if (this.startTarget.x === 0) return;
// console.log("向左划")
this.direction = 1;
} else if (Math.abs(X) < Math.abs(Y) && Y > 0) {
if (this.startTarget.y === 430) return;
// console.log("向下划")
this.direction = 0;
} else if (Math.abs(X) < Math.abs(Y) && Y < 0) {
if (this.startTarget.y === 0) return;
// console.log("向上划");
this.direction = -1;
} else {
// console.log('只是点击了而已')
} }
destroy() {
super.destroy();
FYGE.Tween.removeTweens(this.img);
} }
} mouseUpEvent(e: FYGE.MouseEvent) {
if (this.isPause) return;
if (!this.canMove) return;
class GuideCard extends FYGE.Container { let num = this.startTarget.x / 302 + (this.startTarget.y / 302) * 2;
img; console.log("mouseUpEvent---num", num);
uiConfig = Tools.gameData.uiConfig;
public isFront = false; // 是否正面
public match = false; // 是否匹配
public type; // 类型
handSvga: Hand; // 手指引导
constructor(data?) {
super();
this.initUi(data);
}
removeHand() { switch (this.direction) {
this.removeChild(this.handSvga); case -1:
} this.queryChange(num - 2);
initUi(data) { break;
this.type = data.type; case 0:
this.img = UI.Sp(this, this.uiConfig.cardBackBg, 0, 0); this.queryChange(num + 2);
this.img.anchorX = 70; break;
this.img.anchorY = 133; case 1:
if (data.index == 2) { this.queryChange(num - 1);
this.handSvga = this.addChild(new Hand()); break;
} case 2:
} this.queryChange(num + 1);
onOverTurn(that, callback = () => {}) { break;
FYGE.Tween.get(that.img) default:
.to( break;
{ }
scaleX: 0, }
}, queryChange(num: number) {
200 if (this.isPause) return;
) if (num >= 0 && num <= 3) {
.call(() => { this.currentTarget = this.textureList[num];
if (that.match) { if (this.countRowCol()) {
that.img.texture = FYGE.Texture.fromUrl(this.uiConfig.cardBackBg); this.exchangeTarget(this.startTarget, this.currentTarget);
that.match = false;
} else { } else {
that.img.texture = FYGE.Texture.fromUrl( console.log("在数组中但不是同一行");
this.uiConfig["cardFontBg" + that.type] }
}
}
countRowCol() {
if (this.isPause) return;
return (
this.textureList.indexOf(this.startTarget) % 2 ===
this.textureList.indexOf(this.currentTarget) % 2 ||
Math.floor(this.textureList.indexOf(this.startTarget) / 2) ===
Math.floor(this.textureList.indexOf(this.currentTarget) / 2)
); );
that.match = true;
} }
FYGE.Tween.get(that.img) exchangeTarget(target: Chip, currentTarget: Chip) {
.to( if (this.isPause) return;
{ let tempX = currentTarget.x;
scaleX: 1, let tempY = currentTarget.y;
}, this.canMove = false;
200 this.tween1 = FYGE.Tween.get(currentTarget)
) .to({ x: target.x, y: target.y }, 200)
.call(() => {});
this.tween2 = FYGE.Tween.get(target)
.to({ x: tempX, y: tempY }, 200)
.call(() => { .call(() => {
console.log("翻转结束"); this.isWin();
if (callback) {
callback();
}
});
}); });
let index1 = this.textureList.indexOf(currentTarget);
let index2 = this.textureList.indexOf(target);
let temp = target;
this.textureList[index2] = currentTarget;
this.textureList[index1] = temp;
} }
onZoomCard(that, callback = () => {}) { isWin() {
FYGE.Tween.get(that.img) this.textureList.map((item, index) => {
.to( if (index === item.correctNum) {
{ this.correctNumber++;
scaleX: 1.2,
scaleY: 1.2,
},
300
)
.call(() => {
FYGE.Tween.get(that.img)
.to(
{
scaleX: 1,
scaleY: 1,
},
300
)
.call(() => {
console.log("缩放结束");
that.match = true;
if (callback) {
callback();
} }
}); });
}); this.canMove = true;
if (this.correctNumber >= 4) {
this.gameOver();
} else {
this.correctNumber = 0;
}
}
gameOver() {
console.log("游戏结束");
this.isPause = true;
this.canMove = true;
this.isFinish = 0;
this.startBtnHandle(true);
if (this.correctNumber >= 4) {
console.log("win");
GDispatcher.dispatchEvent("win");
} else {
console.log("over");
GDispatcher.dispatchEvent("over");
}
this.correctNumber = 0;
if (this.tween1 && this.tween2) {
setTimeout(() => {
FYGE.Tween.removeTweenSelf(this.tween1);
FYGE.Tween.removeTweenSelf(this.tween2);
}, 200);
} }
destroy() { this.textureList.sort((a, b) => {
super.destroy(); return a.correctNum - b.correctNum;
FYGE.Tween.removeTweens(this.img); });
} }
}
class Hand extends FYGE.Container { initEvents() {
img; super.initEvents();
constructor(data?) { // GDispatcher.addEventListener("closeGame", this.closeGame, this);
super();
this.initUi();
} }
initUi() { removeEvents() {
this.img = UI.Sp(this, "hand.png", 56, 166); super.removeEvents();
FYGE.Tween.get(this.img, { // GDispatcher.removeEventListener("closeGame", this.closeGame, this);
loop: true, this.textureContanier.removeEventListener(
}) FYGE.MouseEvent.MOUSE_DOWN,
.to( this.mouseDownEvent,
{ this
x: 70, );
y: 185, this.textureContanier.removeEventListener(
}, FYGE.MouseEvent.MOUSE_MOVE,
500 this.mouseMoveEvent,
) this
.to( );
{ this.textureContanier.removeEventListener(
x: 56, FYGE.MouseEvent.MOUSE_UP,
y: 166, this.mouseUpEvent,
}, this
400
); );
} }
}
class Chip extends FYGE.Sprite {
public ct: FYGE.Container;
private chip: FYGE.Sprite;
public correctNum: number;
destroy() { init(res, correctNum) {
super.destroy(); this.correctNum = correctNum;
FYGE.Tween.removeTweens(this.img); this.ct = UI.Ctn(this, 0, 0);
UI.Sp(this.ct, res, 0, 0);
} }
} }
src/template/GameConfig.ts
View file @ abf88f4b
// 翻牌游戏卡片种类
export const cardTypeList = {
1: {
name: "香韵",
img: "https://yun.duiba.com.cn/aurora/assets/1f4da40a6bd75817b2f3cc1d35ee2a436b4db39c.png",
},
2: {
name: "七彩",
img: "https://yun.duiba.com.cn/aurora/assets/3fe99f439878e90979a779c12cbb25cfce48f725.png",
},
3: {
name: "阳光",
img: "https://yun.duiba.com.cn/aurora/assets/4a1cb2affeb9024ada20078108cdd05737ba9168.png",
},
4: {
name: "清甜",
img: "https://yun.duiba.com.cn/aurora/assets/96f167f23e8691e50e65dc79bb5b709272a447ee.png",
},
};
// 游戏列表
export const list = [
{
type: 1,
},
{
type: 2,
},
{
type: 1,
},
{
type: 2,
},
{
type: 3,
},
{
type: 3,
},
{
type: 4,
},
{
type: 4,
},
];
// 新手引导列表
export const guideList = [
{
type: 1,
isFront: false,
hand: false,
match: false, // 是否匹配
},
{
type: 2,
isFront: false,
hand: false,
match: false,
},
{
type: 3,
isFront: false,
hand: true,
match: false,
},
{
type: 2,
isFront: false,
hand: false,
match: false,
},
{
type: 1,
isFront: false,
hand: false,
match: false,
},
{
type: 3,
isFront: false,
hand: false,
match: false,
},
{
type: 4,
isFront: false,
hand: false,
match: false,
},
{
type: 4,
isFront: false,
hand: false,
match: false,
},
];
export const defaultUI = { export const defaultUI = {
mainBg:
"https://yun.duiba.com.cn/aurora/assets/b76307c3830811177a4bce87a7d07fd04a9646de.png",
cardBackBg: cardBackBg:
"https://yun.duiba.com.cn/aurora/assets/3ddcd8fae8c5f382c6a54a93a343b0f297f68d4e.png", "https://yun.duiba.com.cn/aurora/assets/3ddcd8fae8c5f382c6a54a93a343b0f297f68d4e.png",
cardFontBg1: cardFontBg1:
...@@ -106,8 +11,6 @@ export const defaultUI = { ...@@ -106,8 +11,6 @@ export const defaultUI = {
"https://yun.duiba.com.cn/aurora/assets/1f4da40a6bd75817b2f3cc1d35ee2a436b4db39c.png", "https://yun.duiba.com.cn/aurora/assets/1f4da40a6bd75817b2f3cc1d35ee2a436b4db39c.png",
cardFontBg4: cardFontBg4:
"https://yun.duiba.com.cn/aurora/assets/3fe99f439878e90979a779c12cbb25cfce48f725.png", "https://yun.duiba.com.cn/aurora/assets/3fe99f439878e90979a779c12cbb25cfce48f725.png",
mainBg:
"https://yun.duiba.com.cn/aurora/assets/cee253d9388f52840d17c05686200e631a2d826b.png",
ruleBtn: ruleBtn:
"https://yun.duiba.com.cn/aurora/assets/aa3c770ff5f844351a7bb4d2a2ee3f1574fb9a51.png", "https://yun.duiba.com.cn/aurora/assets/aa3c770ff5f844351a7bb4d2a2ee3f1574fb9a51.png",
serviceBtn: serviceBtn:
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment