Skip to content

G
game2048
Commit 937969c1 authored by huangwenjie's avatar huangwenjie
Browse files
Options

动效

parent f4b1ebe4
Hide whitespace changes
Inline Side-by-side
Showing with 185 additions and 41 deletions
resource/playScene/guideArrow.png
View replaced file @ f4b1ebe4 View file @ 937969c1
resource/playScene/guideArrow.png

251 Bytes | W: | H:

resource/playScene/guideArrow.png

266 Bytes | W: | H:

resource/playScene/guideArrow.png
resource/playScene/guideArrow.png
resource/playScene/guideArrow.png
resource/playScene/guideArrow.png
  • 2-up
  • Swipe
  • Onion skin
resource/res.json
View file @ 937969c1
......@@ -9,7 +9,7 @@
"name": "gameOverPanel"
},
{
"keys": "bombBtn.png,bombTips.png,doFilterBtn.png,ele1024.png,ele128.png,ele16.png,ele2.png,ele2048.png,ele256.png,ele32.png,ele4.png,ele512.png,ele64.png,ele8.png,exchangeBtn.png,exchangeTips.png,filterBtn.png,filterTips.png,focusTips.png,guideArrow.png,guideFinger.png,playBg.png",
"keys": "bomb(1).png,bomb(10).png,bomb(11).png,bomb(12).png,bomb(13).png,bomb(14).png,bomb(15).png,bomb(16).png,bomb(17).png,bomb(18).png,bomb(19).png,bomb(2).png,bomb(20).png,bomb(3).png,bomb(4).png,bomb(5).png,bomb(6).png,bomb(7).png,bomb(8).png,bomb(9).png,bombBtn.png,bombTips.png,create1024.svga,create128.svga,create16.svga,create2048.svga,create256.svga,create32.svga,create4.svga,create512.svga,create64.svga,create8.svga,doFilterBtn.png,ele1024.png,ele128.png,ele16.png,ele2.png,ele2048.png,ele256.png,ele32.png,ele4.png,ele512.png,ele64.png,ele8.png,exchangeBtn.png,exchangeTips.png,filterBtn.png,filterTips.png,filting (1).png,filting (10).png,filting (11).png,filting (12).png,filting (13).png,filting (14).png,filting (15).png,filting (16).png,filting (17).png,filting (2).png,filting (3).png,filting (4).png,filting (5).png,filting (6).png,filting (7).png,filting (8).png,filting (9).png,focusTips.png,goBackBtn.png,guideArrow.png,guideFinger.png,musicOff.png,musicOn.png,playBg.png,propBottom.png",
"name": "playScene"
},
{
......
src/scenes/playScene/GameEle.ts
View file @ 937969c1
......@@ -13,7 +13,7 @@ export class GameEle extends Sprite {
super()
this._eleType = eleType
this.anchor.set(60, 60)
switch (eleType + "") {
case "2":
this.texture = RES.getRes("ele2.png")
......
src/scenes/playScene/PlayScene.ts
View file @ 937969c1
import { FrameAni } from './../../../engine/2d/ui/FrameAni';
import { MovieClip } from './../../../engine/2d/svga/MovieClip';
import { Shape } from './../../../engine/2d/graphics/Shape';
import { noBlockLeft, noBlockRight, noBlockTop, noBlockBottom } from './Check';
import { DisplayObject } from './../../../engine/2d/display/DisplayObject';
import { GDispatcher } from './../../../engine/2d/events/GDispatcher';
import { Button } from './../../../engine/2d/ui/Button';
import { GameEle } from './GameEle';
......@@ -47,9 +49,14 @@ export class PlayScene extends Scene {
}
bg: Sprite
goBackBtn: Button
musicBtn: Button
bombBtn: Button
bombCountTxt: TextField
exchangeBtn: Button
exchangeCountTxt: TextField
filterBtn: Button
filterCountTxt: TextField
scoreTxt: TextField
unlockScoreTxt: TextField
......@@ -75,16 +82,42 @@ export class PlayScene extends Scene {
this.exchangeBtn.x = 115
this.addChild(this.exchangeBtn)
let exchangeBottom = new Sprite(RES.getRes("propBottom.png"))
exchangeBottom.x = 90
exchangeBottom.y = 0
this.exchangeBtn.addChild(exchangeBottom)
this.exchangeCountTxt = this.drawTxt(0, 105, 10, "#ffffff", 26)
this.exchangeBtn.addChild(this.exchangeCountTxt)
this.bombBtn = new Button(RES.getRes('bombBtn.png'))
this.bombBtn.y = 1280
this.bombBtn.x = 312
this.addChild(this.bombBtn)
let bombBottom = new Sprite(RES.getRes("propBottom.png"))
bombBottom.x = 90
bombBottom.y = 0
this.bombBtn.addChild(bombBottom)
this.bombCountTxt = this.drawTxt(0, 105, 10, "#ffffff", 26)
this.bombBtn.addChild(this.bombCountTxt)
this.filterBtn = new Button(RES.getRes('filterBtn.png'))
this.filterBtn.y = 1280
this.filterBtn.x = 510
this.addChild(this.filterBtn)
let filterBottom = new Sprite(RES.getRes("propBottom.png"))
filterBottom.x = 90
filterBottom.y = 0
this.filterBtn.addChild(filterBottom)
this.filterCountTxt = this.drawTxt(0, 105, 10, "#ffffff", 26)
this.filterBtn.addChild(this.filterCountTxt)
this.loadSvgas()
for (let x = 0; x < 4; x++) {
this.board[x] = []
this.containerPool[x] = []
......@@ -105,6 +138,14 @@ export class PlayScene extends Scene {
}
}
this.goBackBtn = new Button(RES.getRes("goBackBtn.png"))
this.goBackBtn.x = 0
this.goBackBtn.y = 200
this.addChild(this.goBackBtn)
this.musicBtn = new Button(RES.getRes("musicOn.png"))
this.musicBtn.x = 680
this.musicBtn.y = 200
this.addChild(this.musicBtn)
this.exchangeTarget1 = new Sprite(RES.getRes("focusTips.png"))
this.exchangeTarget2 = new Sprite(RES.getRes("focusTips.png"))
......@@ -112,7 +153,7 @@ export class PlayScene extends Scene {
if (!localStorage.getItem("game2048Guide")) {
localStorage.setItem("game2048Guide", "true")
this.board[1][1] = 2
this.board[1][0] = 2
this.board[1][3] = 2
this.renderBoard()
this.initGuide()
......@@ -120,6 +161,17 @@ export class PlayScene extends Scene {
this.generateOneElement()
this.generateOneElement()
}
this.updateProp(2, 2, 1)
}
createAniPool = []
createArr = [4, 8, 16, 32, 64, 128, 256, 512, 1024, 2048]
loadSvgas() {
for (let i = 0; i < this.createArr.length; i++) {
this.createAniPool[i] = RES.getRes("create" + this.createArr[i] + ".svga")
}
}
guideMask
......@@ -144,17 +196,24 @@ export class PlayScene extends Scene {
this.addChild(this.guideMask)
let arrow = new Sprite(RES.getRes("guideArrow.png"))
arrow.x = 350
arrow.x = 500
arrow.y = 900
arrow.alpha = 0
this.guideMask.addChild(arrow)
Tween.get(arrow, { loop: true })
.to({ x: 355, alpha: 1 }, 600)
.wait(200)
let finger = new Sprite(RES.getRes("guideFinger.png"))
finger.x = 325
finger.x = 500
finger.y = 900
this.guideMask.addChild(finger)
Tween.get(finger, { loop: true })
.to({ x: 375 }, 1000)
.to({ x: 350 }, 500)
.wait(300)
let tips = this.drawTxt("滑动屏幕让2个相同食物碰撞", 250, 1000)
this.guideMask.addChild(tips)
......@@ -173,27 +232,56 @@ export class PlayScene extends Scene {
this.filterBtn.addEventListener(MouseEvent.CLICK, this.onClick_filterBtn, this)
}
_bombCount: number
_exchangeCount: number
_netCount: number
_bombCount: number = 0
_exchangeCount: number = 0
_netCount: number = 0
set bombCount(value) {
this._bombCount = value
this.bombCountTxt.text = this._bombCount + ""
}
get bombCount() {
return this._bombCount
}
set exchangeCount(value) {
this._exchangeCount = value
this.exchangeCountTxt.text = this._exchangeCount + ""
}
get exchangeCount() {
return this._exchangeCount
}
set netCount(value) {
this._netCount = value
this.filterCountTxt.text = this._netCount + ""
}
get netCount() {
return this._netCount
}
updateProp(bombCount: number, exchangeCount: number, netCount: number) {
if (bombCount == 0 || bombCount !== this._bombCount) {
this._bombCount = bombCount
if (bombCount == 0 || bombCount !== this.bombCount) {
this.bombCount = bombCount
}
if (exchangeCount == 0 || exchangeCount !== this._exchangeCount) {
this._exchangeCount = exchangeCount
if (exchangeCount == 0 || exchangeCount !== this.exchangeCount) {
this.exchangeCount = exchangeCount
}
if (netCount == 0 || netCount !== this._netCount) {
this._netCount = netCount
if (netCount == 0 || netCount !== this.netCount) {
this.netCount = netCount
}
}
exchangeTarget1
exchangeTarget2
onClick_exchangeBtn() {
if (this.exchanging) {
if (this.exchanging || this.exchangeCount <= 0) {
return
}
this.exchangeBtn.mouseEnable = false
......@@ -201,9 +289,9 @@ export class PlayScene extends Scene {
this.onExchanging()
}
exchangeMask
exchangeMask: Shape
showExchangeMask() {
this.exchangeMask = new Graphics();
this.exchangeMask = new Shape();
this.exchangeMask.mouseChildren = true
this.exchangeMask.mouseEnable = true
this.exchangeMask.beginFill(0x000000, 0.6);
......@@ -218,9 +306,7 @@ export class PlayScene extends Scene {
this.exchangeMask.lineTo(750, 1624)
this.exchangeMask.lineTo(0, 1624)
this.exchangeMask.lineTo(0, 0)
this.exchangeMask.beginHole()
this.exchangeMask.drawCircle(30, 1000, 100)
this.exchangeMask.endHole()
this.exchangeMask.drawCircle(180, 1340, 95, true)
this.exchangeMask.endFill();
this.addChild(this.exchangeMask)
......@@ -364,9 +450,9 @@ export class PlayScene extends Scene {
})
}
bombMask
bombMask: Shape
showBombMask() {
this.bombMask = new Graphics();
this.bombMask = new Shape();
this.bombMask.mouseChildren = true
this.bombMask.mouseEnable = true
this.bombMask.beginFill(0x000000, 0.6);
......@@ -381,9 +467,7 @@ export class PlayScene extends Scene {
this.bombMask.lineTo(750, 1624)
this.bombMask.lineTo(0, 1624)
this.bombMask.lineTo(0, 0)
this.bombMask.beginHole()
this.bombMask.drawCircle(30, 1000, 100)
this.bombMask.endHole()
this.bombMask.drawCircle(375, 1340, 95, true)
this.bombMask.endFill();
this.addChild(this.bombMask)
......@@ -395,8 +479,8 @@ export class PlayScene extends Scene {
let func
this.bombMask.addEventListener(MouseEvent.CLICK, func = () => {
this.bombBtn.mouseEnable = true
console.log(123)
this.removeChild(this.bombMask)
this.removeAllClick()
this.bombing = false
this.bombMask.removeEventListener(MouseEvent.CLICK, func, this)
}, this)
......@@ -404,6 +488,9 @@ export class PlayScene extends Scene {
}
onClick_bombBtn() {
if (this.bombing || this.bombCount <= 0) {
return
}
this.bombing = true
this.bombBtn.mouseEnable = false
this.showBombMask()
......@@ -412,13 +499,23 @@ export class PlayScene extends Scene {
if (this.board[x][y] > 0) {
this.containerPool[x][y].addEventListener(MouseEvent.CLICK, (e) => {
// 炸弹动效
this.board[x][y] = 0
this.renderBoard()
this.removeAllClick()
this.removeChild(this.bombMask)
this.bombBtn.mouseEnable = true
this.bombing = false
var arr = [];
for (var i = 1; i <= 20; i++)arr.push(RES.getRes("bomb(" + i + ").png"));
let showImage = new FrameAni(arr);
showImage.x = this.containerPool[x][y].x + 60
showImage.y = this.containerPool[x][y].y + 60
showImage.scale.set(0.5, 0.5)
this.addChild(showImage);
showImage.play()
setTimeout(() => {
this.board[x][y] = 0
this.renderBoard()
this.removeAllClick()
this.removeChild(this.bombMask)
this.bombBtn.mouseEnable = true
this.bombing = false
this.removeChild(showImage)
}, 300);
}, this)
}
......@@ -426,10 +523,10 @@ export class PlayScene extends Scene {
}
}
filterMask
filterMask: Shape
doFilterBtn
showFilterMask() {
this.filterMask = new Graphics();
this.filterMask = new Shape();
this.filterMask.mouseChildren = true
this.filterMask.mouseEnable = true
this.filterMask.beginFill(0x000000, 0.6);
......@@ -444,9 +541,7 @@ export class PlayScene extends Scene {
this.filterMask.lineTo(750, 1624)
this.filterMask.lineTo(0, 1624)
this.filterMask.lineTo(0, 0)
this.filterMask.beginHole()
this.filterMask.drawCircle(30, 1000, 100)
this.filterMask.endHole()
this.filterMask.drawCircle(575, 1340, 95, true)
this.filterMask.endFill();
this.addChild(this.filterMask)
......@@ -472,10 +567,22 @@ export class PlayScene extends Scene {
this.addChild(this.doFilterBtn)
let btnFunc
this.doFilterBtn.addEventListener(MouseEvent.CLICK, btnFunc = () => {
var arr = [];
for (var i = 1; i <= 17; i++)arr.push(RES.getRes("filting (" + i + ").png"));
for (let x = 0; x < 4; x++) {
for (let y = 0; y < 4; y++) {
if (this.board[x][y] > 0 && this.board[x][y] < 128) {
// 滤网动效
let showImage = new FrameAni(arr);
showImage.x = this.containerPool[x][y].x + 60
showImage.y = this.containerPool[x][y].y + 60
showImage.scale.set(0.9, 0.9)
this.addChild(showImage);
showImage.play()
setTimeout(() => {
this.removeChild(showImage)
}, 500);
Tween.get(this.containerPool[x][y].children[0])
.to({ scaleX: 0, scaleY: 0 }, 200)
.call(() => {
......@@ -503,6 +610,9 @@ export class PlayScene extends Scene {
}
onClick_filterBtn() {
if (this.filtering || this.netCount <= 0) {
return
}
this.filterBtn.mouseEnable = false
this.filtering = true
this.showFilterMask()
......@@ -514,7 +624,6 @@ export class PlayScene extends Scene {
for (let x = 0; x < 4; x++) {
for (let y = 0; y < 4; y++) {
if (this.board[x][y] > 0 && this.board[x][y] < 128) {
this.containerPool[x][y].children[0].anchor.set(60, 60)
Tween.get(this.containerPool[x][y].children[0], { loop: true })
.to({ rotation: 15 }, 50)
.to({ rotation: -15 }, 100)
......@@ -598,6 +707,9 @@ export class PlayScene extends Scene {
this.removeChild(this.guideMask)
this.guideMask = null
}
if (this.moving || this.exchanging || this.bombing || this.filtering) {
return
}
if (this.checkAllZero()) {
// 只有0
this.generateOneElement()
......@@ -896,6 +1008,7 @@ export class PlayScene extends Scene {
}
moveData = [[], [], [], []]
scoreTips: TextField
updateArr(arr, t = 0) {
this.moveData = [[], [], [], []]
// 先删除数组中的0
......@@ -912,6 +1025,7 @@ export class PlayScene extends Scene {
}
}
// 判断相加/合并
let addScore = 0
for (let i = 1; i < arr.length; i++) {
if (arr[i] === 0) break
if (arr[i] === arr[i - 1]) {
......@@ -953,8 +1067,38 @@ export class PlayScene extends Scene {
//一次性走完就让 i = 0 例如 2240 =》8000
//i = 0 //此处不能 i -= 1 [8,2,2,4]会出问题
// 播放对应合成svga
this.createArr.forEach((num, idx) => {
if (num === arr[i - 1]) {
let mp = new MovieClip(this.createAniPool[idx])
mp.x = this.containerPool[target.row][target.col].x - 70
mp.y = this.containerPool[target.row][target.col].y - 70
this.addChild(mp)
mp.startAniRange(0)
setTimeout(() => {
this.removeChild(mp)
}, 1000);
}
})
addScore += arr[i - 1]
this.score += arr[i - 1]
}
if (addScore > 0) {
this.scoreTips = this.drawTxt("+" + addScore, 250, 340, "#ffffff", 34)
this.scoreTips.alpha = 0
this.addChild(this.scoreTips)
Tween.get(this.scoreTips)
.to({ y: 300, alpha: 1 }, 200)
.wait(200)
.to({ y: 250, alpha: 0 }, 100)
.call(() => {
this.removeChild(this.scoreTips)
})
}
}
}
......
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