Fix battle side panel spacing
This commit is contained in:
@@ -4426,7 +4426,7 @@ export class BattleScene extends Phaser.Scene {
|
||||
|
||||
private renderPointerFeedbackHint(text: string, tone: number) {
|
||||
const left = this.layout.panelX + 18;
|
||||
const top = this.sideContentTop() - 38;
|
||||
const top = this.sideHeaderBottom() + 8;
|
||||
const width = this.layout.panelWidth - 36;
|
||||
const height = 32;
|
||||
if (!this.pointerFeedbackHintBg) {
|
||||
@@ -5264,46 +5264,52 @@ export class BattleScene extends Phaser.Scene {
|
||||
const top = this.sideContentTop();
|
||||
const selected = this.deploymentSelectedUnit();
|
||||
|
||||
const header = this.trackSideObject(this.add.rectangle(left, top, width, 124, 0x101820, 0.96));
|
||||
const header = this.trackSideObject(this.add.rectangle(left, top, width, 108, 0x101820, 0.96));
|
||||
header.setOrigin(0);
|
||||
header.setStrokeStyle(1, palette.gold, 0.78);
|
||||
this.trackSideObject(this.add.text(left + 16, top + 13, '전열 배치', {
|
||||
fontFamily: '"Malgun Gothic", "Noto Sans KR", sans-serif',
|
||||
fontSize: '24px',
|
||||
fontSize: '22px',
|
||||
color: '#f4dfad',
|
||||
fontStyle: '700'
|
||||
}));
|
||||
this.trackSideObject(this.add.text(left + 16, top + 47, this.deploymentSubtitle(), {
|
||||
this.trackSideObject(this.add.text(left + 16, top + 43, this.deploymentSubtitle(), {
|
||||
fontFamily: '"Malgun Gothic", "Noto Sans KR", sans-serif',
|
||||
fontSize: '12px',
|
||||
color: '#c8d2dd',
|
||||
wordWrap: { width: width - 32, useAdvancedWrap: true },
|
||||
maxLines: 2
|
||||
}));
|
||||
this.renderDeploymentObjectiveBrief(left + 16, top + 82, width - 32);
|
||||
this.renderDeploymentObjectiveBrief(left + 16, top + 76, width - 32);
|
||||
|
||||
const noticeTop = top + 136;
|
||||
const notice = this.trackSideObject(this.add.rectangle(left, noticeTop, width, 54, 0x0b1118, 0.94));
|
||||
const noticeTop = top + 120;
|
||||
const notice = this.trackSideObject(this.add.rectangle(left, noticeTop, width, 48, 0x0b1118, 0.94));
|
||||
notice.setOrigin(0);
|
||||
notice.setStrokeStyle(1, selected ? palette.blue : 0x647485, selected ? 0.74 : 0.56);
|
||||
this.trackSideObject(this.add.text(left + 14, noticeTop + 10, selected ? `선택: ${selected.name}` : '장수를 선택하세요.', {
|
||||
this.trackSideObject(this.add.text(left + 14, noticeTop + 8, selected ? `선택: ${selected.name}` : '장수를 선택하세요.', {
|
||||
fontFamily: '"Malgun Gothic", "Noto Sans KR", sans-serif',
|
||||
fontSize: '14px',
|
||||
color: selected ? '#f2e3bf' : '#d4dce6',
|
||||
fontStyle: '700'
|
||||
}));
|
||||
this.trackSideObject(this.add.text(left + 14, noticeTop + 30, this.deploymentNotice, {
|
||||
this.trackSideObject(this.add.text(left + 14, noticeTop + 27, this.deploymentNotice, {
|
||||
fontFamily: '"Malgun Gothic", "Noto Sans KR", sans-serif',
|
||||
fontSize: '12px',
|
||||
fontSize: '11px',
|
||||
color: '#9fb0bf',
|
||||
fixedWidth: width - 28
|
||||
}));
|
||||
|
||||
const roleTop = noticeTop + 72;
|
||||
this.deploymentRoleSummaries().forEach((summary, index) => {
|
||||
const rowTop = roleTop + index * 72;
|
||||
const roleTop = noticeTop + 60;
|
||||
const roleSummaries = this.deploymentRoleSummaries();
|
||||
const rowHeight = 48;
|
||||
const buttonTop = panelY + panelHeight - 116;
|
||||
const roleStep = roleSummaries.length > 1
|
||||
? Phaser.Math.Clamp(Math.floor((buttonTop - roleTop - rowHeight - 8) / (roleSummaries.length - 1)), rowHeight + 4, 62)
|
||||
: rowHeight + 4;
|
||||
roleSummaries.forEach((summary, index) => {
|
||||
const rowTop = roleTop + index * roleStep;
|
||||
const active = selected?.id === summary.unitId;
|
||||
const row = this.trackSideObject(this.add.rectangle(left, rowTop, width, 62, active ? 0x21364a : 0x101820, active ? 0.98 : 0.92));
|
||||
const row = this.trackSideObject(this.add.rectangle(left, rowTop, width, rowHeight, active ? 0x21364a : 0x101820, active ? 0.98 : 0.92));
|
||||
row.setOrigin(0);
|
||||
row.setStrokeStyle(1, active ? summary.tone : 0x53606c, active ? 0.86 : 0.52);
|
||||
row.setInteractive({ useHandCursor: true });
|
||||
@@ -5313,19 +5319,19 @@ export class BattleScene extends Phaser.Scene {
|
||||
this.handleDeploymentUnitClick(unit);
|
||||
}
|
||||
});
|
||||
const icon = this.trackSideIcon(left + 31, rowTop + 31, summary.icon, 42);
|
||||
const icon = this.trackSideIcon(left + 29, rowTop + 24, summary.icon, 38);
|
||||
icon.setDepth(34);
|
||||
this.trackSideObject(this.add.text(left + 58, rowTop + 9, `${summary.name} · ${summary.role}`, {
|
||||
this.trackSideObject(this.add.text(left + 54, rowTop + 6, `${summary.name} · ${summary.role}`, {
|
||||
fontFamily: '"Malgun Gothic", "Noto Sans KR", sans-serif',
|
||||
fontSize: '15px',
|
||||
color: active ? '#f4dfad' : '#e7edf7',
|
||||
fontStyle: '700'
|
||||
}));
|
||||
this.trackSideObject(this.add.text(left + 58, rowTop + 32, summary.text, {
|
||||
this.trackSideObject(this.add.text(left + 54, rowTop + 28, summary.text, {
|
||||
fontFamily: '"Malgun Gothic", "Noto Sans KR", sans-serif',
|
||||
fontSize: '12px',
|
||||
fontSize: '11px',
|
||||
color: '#aeb7c2',
|
||||
fixedWidth: width - 70
|
||||
fixedWidth: width - 64
|
||||
}));
|
||||
});
|
||||
|
||||
@@ -5535,7 +5541,7 @@ export class BattleScene extends Phaser.Scene {
|
||||
this.pendingMove = undefined;
|
||||
this.phase = 'idle';
|
||||
this.refreshUnitLegibilityStyles();
|
||||
this.renderRosterPanel('ally', '전열 배치가 끝났습니다. 선택한 시작 위치에서 전투를 시작합니다.');
|
||||
this.renderRosterPanel('ally', '출전 위치 확정. 행동할 장수를 선택하세요.');
|
||||
this.showOpeningBattleEvent();
|
||||
soundDirector.playSelect();
|
||||
}
|
||||
@@ -15711,8 +15717,19 @@ export class BattleScene extends Phaser.Scene {
|
||||
return { icon: 'success', tone: 0x9fb0bf };
|
||||
}
|
||||
|
||||
private sideHeaderBottom() {
|
||||
const fallbackBottom = this.layout.panelY + 144;
|
||||
const objectiveBottom = this.objectiveTrackerText?.visible
|
||||
? this.objectiveTrackerText.y + this.objectiveTrackerText.height
|
||||
: fallbackBottom;
|
||||
const objectiveSubBottom = this.objectiveTrackerSubText?.visible
|
||||
? this.objectiveTrackerSubText.y + this.objectiveTrackerSubText.height
|
||||
: fallbackBottom;
|
||||
return Math.max(fallbackBottom, objectiveBottom, objectiveSubBottom);
|
||||
}
|
||||
|
||||
private sideContentTop() {
|
||||
return this.layout.panelY + 152;
|
||||
return this.sideHeaderBottom() + 20;
|
||||
}
|
||||
|
||||
private sideContentBottom(padding = 16) {
|
||||
|
||||
Reference in New Issue
Block a user