mirror of
http://junepve.top:3000/chicrobot/CINC.git
synced 2026-10-30 03:11:29 +08:00
456 lines
12 KiB
JavaScript
456 lines
12 KiB
JavaScript
// 武器测试场景
|
|
// 以角色动画场景为基础,使用\assets\PNG\Weapons\Tiles目录下的武器图片
|
|
|
|
// 导入系统和UI组件
|
|
import { InputSystem } from '../../systems/InputSystem.js';
|
|
import { SelectionSystem } from '../../systems/SelectionSystem.js';
|
|
import { CommandSystem } from '../../systems/CommandSystem.js';
|
|
|
|
// 导入Unit类
|
|
import Unit from '../../objects/Unit.js';
|
|
|
|
export default class WeaponTestScene extends Phaser.Scene {
|
|
constructor() {
|
|
super({ key: 'WeaponTestScene' });
|
|
this.tileSize = 16; // 瓦片大小
|
|
this.player = null; // 玩家角色
|
|
this.inputSystem = null; // 输入系统
|
|
this.selectionSystem = null; // 选择系统
|
|
this.commandSystem = null; // 命令系统
|
|
this.weapons = []; // 武器列表
|
|
this.currentWeaponIndex = 0; // 当前选中的武器索引
|
|
this.weaponDisplay = null; // 武器展示
|
|
}
|
|
|
|
preload() {
|
|
// 加载玩家瓦片图片
|
|
console.log('加载玩家瓦片图片...');
|
|
|
|
// 加载Player0的动画帧
|
|
for (let i = 0; i < 8; i++) {
|
|
this.load.image(`player0-${i}`, `assets/PNG/Players/Tiles/tile_${String(i).padStart(4, '0')}.png`);
|
|
}
|
|
|
|
// 加载武器图片
|
|
console.log('加载武器图片...');
|
|
for (let i = 0; i < 40; i++) {
|
|
this.load.image(`weapon-${i}`, `assets/PNG/Weapons/Tiles/tile_${String(i).padStart(4, '0')}.png`);
|
|
}
|
|
|
|
console.log('图片加载完成');
|
|
}
|
|
|
|
create() {
|
|
// 物理世界和相机边界
|
|
const worldSize = 2000;
|
|
this.physics.world.setBounds(-worldSize, -worldSize, worldSize * 2, worldSize * 2);
|
|
this.cameras.main.setBounds(-worldSize, -worldSize, worldSize * 2, worldSize * 2);
|
|
this.cameras.main.centerOn(0, 0);
|
|
|
|
// 设置背景色
|
|
this.cameras.main.setBackgroundColor('#222222');
|
|
|
|
// 创建地面网格
|
|
this.createGrid();
|
|
|
|
// 创建角色动画
|
|
this.createCharacterAnimations();
|
|
|
|
// 初始化系统
|
|
this.inputSystem = new InputSystem(this, {
|
|
keyboard: true,
|
|
mouse: true,
|
|
selection: true
|
|
});
|
|
this.selectionSystem = new SelectionSystem(this);
|
|
this.commandSystem = new CommandSystem(this);
|
|
|
|
// 创建单位组
|
|
this.unitGroup = this.add.group();
|
|
|
|
// 初始化武器列表
|
|
this.initWeapons();
|
|
|
|
// 创建玩家角色
|
|
this.createPlayer();
|
|
|
|
// 设置输入控制
|
|
this.setupInput();
|
|
|
|
// 添加事件监听器
|
|
this.addEventListeners();
|
|
|
|
// 添加碰撞检测
|
|
this.physics.add.collider(this.unitGroup, this.unitGroup);
|
|
|
|
// 显示提示信息
|
|
this.showInstructions();
|
|
}
|
|
|
|
/**
|
|
* 添加事件监听器
|
|
*/
|
|
addEventListeners() {
|
|
// 监听相对移动事件(键盘控制)
|
|
this.events.on('move-relative', (dir) => {
|
|
if (this.player) {
|
|
this.player.moveRelative(dir.x, dir.y);
|
|
}
|
|
});
|
|
|
|
// 监听移动到指定点事件(鼠标点击)
|
|
this.events.on('move-to-point', (x, y) => {
|
|
if (this.player) {
|
|
this.player.setTarget(x, y);
|
|
}
|
|
});
|
|
}
|
|
|
|
/**
|
|
* 创建地面网格
|
|
*/
|
|
createGrid() {
|
|
// 创建网格线
|
|
const gridGraphics = this.add.graphics();
|
|
gridGraphics.lineStyle(1, 0x444444, 0.5);
|
|
|
|
// 绘制垂直线
|
|
for (let x = 0; x <= 2000; x += this.tileSize) {
|
|
gridGraphics.moveTo(x, 0);
|
|
gridGraphics.lineTo(x, 2000);
|
|
}
|
|
|
|
// 绘制水平线
|
|
for (let y = 0; y <= 2000; y += this.tileSize) {
|
|
gridGraphics.moveTo(0, y);
|
|
gridGraphics.lineTo(2000, y);
|
|
}
|
|
}
|
|
|
|
/**
|
|
* 创建角色动画
|
|
*/
|
|
createCharacterAnimations() {
|
|
console.log('创建角色动画...');
|
|
|
|
// 创建Player0的移动动画
|
|
this.anims.create({
|
|
key: 'player0-move',
|
|
frames: [
|
|
{ key: 'player0-1' },
|
|
{ key: 'player0-2' }
|
|
],
|
|
frameRate: 10,
|
|
repeat: -1
|
|
});
|
|
|
|
console.log('角色动画创建完成');
|
|
}
|
|
|
|
/**
|
|
* 创建玩家角色
|
|
*/
|
|
createPlayer() {
|
|
console.log('创建玩家角色...');
|
|
|
|
// 创建玩家角色使用Unit类
|
|
this.player = new Unit(this, 0, 0, 'player0-0');
|
|
this.player.setScale(2); // 放大角色
|
|
this.player.setBounce(0.2); // 反弹效果
|
|
|
|
// 自动选中玩家
|
|
this.events.emit('select-unit', this.player);
|
|
|
|
// 将玩家添加到单位组
|
|
this.unitGroup.add(this.player);
|
|
|
|
// 创建武器展示
|
|
this.createWeaponDisplay();
|
|
|
|
console.log('玩家角色创建完成');
|
|
}
|
|
|
|
/**
|
|
* 初始化武器列表
|
|
*/
|
|
initWeapons() {
|
|
console.log('初始化武器列表...');
|
|
|
|
// 初始化武器数据
|
|
for (let i = 0; i < 40; i++) {
|
|
this.weapons.push({
|
|
id: i,
|
|
name: `武器 ${i}`,
|
|
texture: `weapon-${i}`,
|
|
damage: 10 + i,
|
|
range: 1 + Math.floor(i / 10)
|
|
});
|
|
}
|
|
|
|
console.log('武器列表初始化完成,共', this.weapons.length, '件武器');
|
|
}
|
|
|
|
/**
|
|
* 创建武器展示
|
|
*/
|
|
createWeaponDisplay() {
|
|
// 武器展示背景
|
|
const displayBg = this.add.rectangle(100, 300, 180, 100, 0x333333);
|
|
displayBg.setOrigin(0.5, 0.5);
|
|
displayBg.setScrollFactor(0, 0);
|
|
displayBg.setDepth(10);
|
|
|
|
// 武器图片
|
|
this.weaponDisplay = this.add.image(100, 280, `weapon-${this.currentWeaponIndex}`);
|
|
this.weaponDisplay.setOrigin(0.5, 0.5);
|
|
this.weaponDisplay.setScale(2);
|
|
this.weaponDisplay.setScrollFactor(0, 0);
|
|
this.weaponDisplay.setDepth(11);
|
|
|
|
// 武器名称
|
|
this.weaponNameText = this.add.text(10, 330, `当前武器: ${this.weapons[this.currentWeaponIndex].name}`, {
|
|
fontSize: '14px',
|
|
fill: '#ffffff',
|
|
fontFamily: 'Arial'
|
|
}).setScrollFactor(0, 0).setDepth(11);
|
|
|
|
// 武器属性
|
|
this.weaponStatsText = this.add.text(10, 350, `伤害: ${this.weapons[this.currentWeaponIndex].damage}\n范围: ${this.weapons[this.currentWeaponIndex].range}`, {
|
|
fontSize: '12px',
|
|
fill: '#cccccc',
|
|
fontFamily: 'Arial'
|
|
}).setScrollFactor(0, 0).setDepth(11);
|
|
}
|
|
|
|
/**
|
|
* 更新武器展示
|
|
*/
|
|
updateWeaponDisplay() {
|
|
const weapon = this.weapons[this.currentWeaponIndex];
|
|
this.weaponDisplay.setTexture(weapon.texture);
|
|
this.weaponNameText.setText(`当前武器: ${weapon.name}`);
|
|
this.weaponStatsText.setText(`伤害: ${weapon.damage}\n范围: ${weapon.range}`);
|
|
}
|
|
|
|
/**
|
|
* 设置输入控制
|
|
*/
|
|
setupInput() {
|
|
// 切换武器按钮
|
|
this.createButton(this.sys.game.config.width - 200, 100, '上一件武器', () => {
|
|
this.previousWeapon();
|
|
});
|
|
|
|
this.createButton(this.sys.game.config.width - 200, 150, '下一件武器', () => {
|
|
this.nextWeapon();
|
|
});
|
|
|
|
// 装备武器按钮
|
|
this.createButton(this.sys.game.config.width - 200, 200, '装备武器', () => {
|
|
this.equipWeapon();
|
|
});
|
|
|
|
// 攻击按钮
|
|
this.createButton(this.sys.game.config.width - 200, 250, '攻击', () => {
|
|
this.attack();
|
|
});
|
|
|
|
// 返回启动场景按钮
|
|
this.createButton(this.sys.game.config.width - 200, 300, '返回启动场景', () => {
|
|
this.scene.start('BootScene');
|
|
});
|
|
}
|
|
|
|
/**
|
|
* 创建按钮
|
|
*/
|
|
createButton(x, y, text, callback) {
|
|
// 按钮背景
|
|
const button = this.add.rectangle(x, y, 180, 40, 0x333333);
|
|
button.setOrigin(0.5, 0.5);
|
|
button.setScrollFactor(0, 0);
|
|
button.setDepth(10);
|
|
button.setInteractive({ useHandCursor: true });
|
|
|
|
// 按钮文本
|
|
const buttonText = this.add.text(x - 70, y - 15, text, {
|
|
fontSize: '14px',
|
|
fill: '#ffffff',
|
|
fontFamily: 'Arial'
|
|
});
|
|
buttonText.setScrollFactor(0, 0);
|
|
buttonText.setDepth(11);
|
|
|
|
// 按钮事件
|
|
button.on('pointerdown', callback);
|
|
|
|
button.on('pointerover', () => {
|
|
button.setFillStyle(0x555555);
|
|
});
|
|
|
|
button.on('pointerout', () => {
|
|
button.setFillStyle(0x333333);
|
|
});
|
|
}
|
|
|
|
/**
|
|
* 切换到上一件武器
|
|
*/
|
|
previousWeapon() {
|
|
this.currentWeaponIndex = (this.currentWeaponIndex - 1 + this.weapons.length) % this.weapons.length;
|
|
this.updateWeaponDisplay();
|
|
console.log('切换到上一件武器:', this.weapons[this.currentWeaponIndex].name);
|
|
}
|
|
|
|
/**
|
|
* 切换到下一件武器
|
|
*/
|
|
nextWeapon() {
|
|
this.currentWeaponIndex = (this.currentWeaponIndex + 1) % this.weapons.length;
|
|
this.updateWeaponDisplay();
|
|
console.log('切换到下一件武器:', this.weapons[this.currentWeaponIndex].name);
|
|
}
|
|
|
|
/**
|
|
* 装备武器
|
|
*/
|
|
equipWeapon() {
|
|
const weapon = this.weapons[this.currentWeaponIndex];
|
|
this.player.equippedWeapon = weapon;
|
|
console.log('装备武器:', weapon.name);
|
|
|
|
// 显示装备成功提示
|
|
const equipText = this.add.text(this.sys.game.config.width / 2, 100, `已装备: ${weapon.name}`, {
|
|
fontSize: '16px',
|
|
fill: '#00ff00',
|
|
fontFamily: 'Arial',
|
|
fontWeight: 'bold'
|
|
});
|
|
equipText.setOrigin(0.5, 0.5);
|
|
equipText.setScrollFactor(0, 0);
|
|
equipText.setDepth(12);
|
|
|
|
// 2秒后移除提示
|
|
this.time.delayedCall(2000, () => {
|
|
equipText.destroy();
|
|
});
|
|
}
|
|
|
|
/**
|
|
* 攻击
|
|
*/
|
|
attack() {
|
|
if (!this.player.equippedWeapon) {
|
|
console.log('请先装备武器');
|
|
return;
|
|
}
|
|
|
|
console.log('使用武器攻击:', this.player.equippedWeapon.name);
|
|
|
|
// 播放攻击动画
|
|
this.player.anims.stop();
|
|
this.player.setTexture('player0-1');
|
|
|
|
// 1秒后恢复
|
|
this.time.delayedCall(500, () => {
|
|
this.player.setTexture('player0-0');
|
|
});
|
|
|
|
// 显示攻击效果
|
|
const attackEffect = this.add.circle(this.player.x + 30, this.player.y, 20, 0xff6600, 0.5);
|
|
this.tweens.add({
|
|
targets: attackEffect,
|
|
scale: { from: 1, to: 2 },
|
|
alpha: { from: 0.5, to: 0 },
|
|
duration: 500,
|
|
onComplete: () => {
|
|
attackEffect.destroy();
|
|
}
|
|
});
|
|
}
|
|
|
|
/**
|
|
* 显示提示信息
|
|
*/
|
|
showInstructions() {
|
|
// 标题
|
|
this.add.text(20, 20, '武器测试场景', {
|
|
fontSize: '20px',
|
|
fill: '#ffffff',
|
|
fontFamily: 'Arial',
|
|
fontWeight: 'bold'
|
|
}).setScrollFactor(0, 0).setDepth(11);
|
|
|
|
// 操作提示
|
|
const instructions = [
|
|
'WASD或方向键移动角色',
|
|
'角色移动时播放动画',
|
|
'使用按钮切换和装备武器',
|
|
'点击攻击按钮测试武器效果',
|
|
'按空格键返回启动场景'
|
|
];
|
|
|
|
for (let i = 0; i < instructions.length; i++) {
|
|
this.add.text(20, 50 + i * 25, instructions[i], {
|
|
fontSize: '14px',
|
|
fill: '#ffffff',
|
|
fontFamily: 'Arial'
|
|
}).setScrollFactor(0, 0).setDepth(11);
|
|
}
|
|
|
|
// 武器数量
|
|
this.add.text(20, 200, `武器总数: ${this.weapons.length}`, {
|
|
fontSize: '14px',
|
|
fill: '#00ff00',
|
|
fontFamily: 'Arial'
|
|
}).setScrollFactor(0, 0).setDepth(11);
|
|
}
|
|
|
|
update() {
|
|
// 更新输入系统
|
|
this.inputSystem.update();
|
|
|
|
// 更新所有单位
|
|
this.unitGroup.getChildren().forEach(unit => {
|
|
if (unit.update) {
|
|
unit.update();
|
|
}
|
|
unit.updateMovement();
|
|
|
|
// 处理角色动画
|
|
this.updateCharacterAnimation(unit);
|
|
});
|
|
|
|
// 按空格键返回启动场景
|
|
if (this.input.keyboard.checkDown(this.input.keyboard.addKey(Phaser.Input.Keyboard.KeyCodes.SPACE), 100)) {
|
|
this.scene.start('BootScene');
|
|
}
|
|
}
|
|
|
|
/**
|
|
* 更新角色动画
|
|
* @param {Object} unit - 单位对象
|
|
*/
|
|
updateCharacterAnimation(unit) {
|
|
// 检查单位是否在移动
|
|
const isMoving = Math.abs(unit.body.velocity.x) > 10 || Math.abs(unit.body.velocity.y) > 10;
|
|
|
|
if (isMoving) {
|
|
// 处理角色朝向
|
|
if (unit.body.velocity.x < -10) {
|
|
unit.setFlipX(true); // 向左翻转
|
|
} else if (unit.body.velocity.x > 10) {
|
|
unit.setFlipX(false); // 向右不翻转
|
|
}
|
|
|
|
// 播放移动动画
|
|
if (!unit.anims.isPlaying || !unit.anims.currentAnim.key.includes('move')) {
|
|
unit.play('player0-move');
|
|
}
|
|
} else {
|
|
// 静止状态,显示图片0
|
|
unit.anims.stop();
|
|
unit.setTexture('player0-0');
|
|
}
|
|
}
|
|
} |