var app = new PIXI.Application(520,460);
document.body.appendChild(app.view);
//创建背景
var bg = new PIXI.Sprite.fromImage("res/lianxi/elevator/bg.png");
app.stage.addChild(bg);
var elevator = new PIXI.Sprite.fromImage("res/lianxi/elevator/dt.png");
elevator.y = 380;
elevator.x = 325;
app.stage.addChild(elevator);
var person = new PIXI.Sprite.fromImage("res/lianxi/elevator/p1.png");
person.y = 40;
person.x = 40;
elevator.addChild(person);
var btn1 = new PIXI.Sprite.fromImage("res/lianxi/elevator/anniu-shang-2_08.png");
btn1.x = 480;
btn1.y = 40;
app.stage.addChild(btn1);
var btn2 = new PIXI.Sprite.fromImage("res/lianxi/elevator/anniu-shang-2_08.png");
btn2.x = 480;
btn2.y = 130;
app.stage.addChild(btn2);
var btn3 = new PIXI.Sprite.fromImage("res/lianxi/elevator/anniu-shang-2_08.png");
btn3.x = 480;
btn3.y = 220;
app.stage.addChild(btn3);
var btn4 = new PIXI.Sprite.fromImage("res/lianxi/elevator/anniu-shang-2_08.png");
btn4.x = 480;
btn4.y = 310;
app.stage.addChild(btn4);
var btn5 = new PIXI.Sprite.fromImage("res/lianxi/elevator/anniu-shang-2_08.png");
btn5.x = 480;
btn5.y = 410;
app.stage.addChild(btn5);
btn1.interactive = true;
btn1.buttonMode = true;
btn2.interactive = true;
btn2.buttonMode = true;
btn3.interactive = true;
btn3.buttonMode = true;
btn4.interactive = true;
btn4.buttonMode = true;
btn5.interactive = true;
btn5.buttonMode = true;
var isMoving = false;//表示电梯停止还是移动
var nows;//表示电梯目标位置
var news;//表示电梯新的位置
btn1.on("click",change1);
function change1(){
if(isMoving === true){
return;
}
isMoving = true;
nows = 8;
if(elevator.y == 8){
isMoving = false;
}
}
btn2.on("click",change2);
function change2(){
if(isMoving === true){
return;
}
isMoving = true;
nows = 101;
if(elevator.y == 101){
isMoving = false;
}
}
btn3.on("click",change3);
function change3(){
if(isMoving === true){
return;
}
isMoving = true;
nows = 194;
if(elevator.y == 194){
isMoving = false;
}
}
btn4.on("click",change4);
function change4(){
if(isMoving === true){
return;
}
isMoving = true;
nows = 287;
if(elevator.y == 287){
isMoving = false;
}
}
btn5.on("click",change5);
function change5(){
if(isMoving === true){
return;
}
isMoving = true;
nows = 380;
if(elevator.y == 380){
isMoving = false;
}
}
app.ticker.add(animate);
function animate(){
if(isMoving === false){
return;
}
if(nows<elevator.y){
news = elevator.y-10;
if(news<nows){
news = nows;
}
elevator.y = news;
}else{
news = elevator.y+10;
if(news>nows){
news = nows;
}
elevator.y = news;
}
}
要求实现电梯在移动时,点击其他按钮无效。(上面代码并不能实现,我以为能够实现,不知道我的代码为什么不能实现,希望有大佬能够私信教我一下);
下面是我通过不断探索,实现了电梯在移动时,点击其他按钮无效的效果。
var isMoving = false;
var nows;
var news;
btn1.on("click",change1);
function change1(){
if(isMoving===true){
return;
}else{
isMoving =true;
nows = 8;
}
}
btn2.on("click",change2);
function change2(){
if(isMoving===true){
return;
}else{
isMoving =true;
nows = 101;
}
}
btn3.on("click",change3);
function change3(){
if(isMoving===true){
return;
}else{
isMoving =true;
nows = 194;
}
}
btn4.on("click",change4);
function change4(){
if(isMoving===true){
return;
}else{
isMoving =true;
nows = 287;
}
}
btn5.on("click",change5);
function change5(){
if(isMoving===true){
return
}else{
isMoving =true;
nows = 380;
}
}
app.ticker.add(animate);
function animate(){
if(isMoving === false){
return;
}
if(nows<elevator.y){
news = elevator.y-2;
if(news<nows){
news = nows;
isMoving = false;
}
elevator.y = news;
}else{
news = elevator.y+2;
if(news>nows){
news = nows;
isMoving = false;
}
elevator.y = news;
}
}
想要的效果实现了,但是animate函数里的代码我还是模模糊糊得,半懂。(希望大佬来解答)