🐛 fix stockpile opacity, popText overlap, ESC menu padding (Issue #20)
- Stockpile panel: use uiOpacity instead of hardcoded 0.72 - updateStaticPanelOpacity() replaces updateDebugPanelBackground() and also updates stockpilePanel.setAlpha() when opacity changes in Settings - Stockpile panel height 187→210; popText y 167→192 (8px gap after carrot row) - ESC menu menuH formula: 16+…+8 → 32+…+8 so last button has 16px bottom padding instead of 0px Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -127,14 +127,16 @@ export class UIScene extends Phaser.Scene {
|
||||
/** Creates the stockpile panel in the top-right corner with item rows and population count. */
|
||||
private createStockpilePanel(): void {
|
||||
const x = this.scale.width - 178, y = 10
|
||||
this.stockpilePanel = this.add.rectangle(x, y, 168, 187, 0x000000, 0.72).setOrigin(0, 0).setScrollFactor(0).setDepth(100)
|
||||
// 7 items × 22px + 26px header + 12px gap + 18px popText row + 10px bottom = 210px
|
||||
this.stockpilePanel = this.add.rectangle(x, y, 168, 210, 0x000000, this.uiOpacity).setOrigin(0, 0).setScrollFactor(0).setDepth(100)
|
||||
this.stockpileTitleText = this.add.text(x + 10, y + 7, '⚡ STOCKPILE', { fontSize: '11px', color: '#aaaaaa', fontFamily: 'monospace' }).setScrollFactor(0).setDepth(101)
|
||||
const items = ['wood','stone','wheat_seed','carrot_seed','tree_seed','wheat','carrot'] as const
|
||||
items.forEach((item, i) => {
|
||||
const t = this.add.text(x + 10, y + 26 + i * 22, `${ITEM_ICONS[item]} ${item}: 0`, { fontSize: '13px', color: '#88dd88', fontFamily: 'monospace' }).setScrollFactor(0).setDepth(101)
|
||||
this.stockpileTexts.set(item, t)
|
||||
})
|
||||
this.popText = this.add.text(x + 10, y + 167, '👥 Nisse: 0 / 0', { fontSize: '11px', color: '#aaaaaa', fontFamily: 'monospace' }).setScrollFactor(0).setDepth(101)
|
||||
// last item (i=6) bottom edge ≈ y+190 → popText starts at y+192 with 8px gap
|
||||
this.popText = this.add.text(x + 10, y + 192, '👥 Nisse: 0 / 0', { fontSize: '11px', color: '#aaaaaa', fontFamily: 'monospace' }).setScrollFactor(0).setDepth(101)
|
||||
}
|
||||
|
||||
/** Refreshes all item quantities and colors in the stockpile panel. */
|
||||
@@ -570,7 +572,8 @@ export class UIScene extends Phaser.Scene {
|
||||
{ label: '⚙️ Settings', action: () => this.doSettings() },
|
||||
{ label: '🆕 New Game', action: () => this.doNewGame() },
|
||||
]
|
||||
const menuH = 16 + entries.length * (btnH + 8) + 8
|
||||
// 32px header + entries × (btnH + 8px gap) + 8px bottom padding
|
||||
const menuH = 32 + entries.length * (btnH + 8) + 8
|
||||
const mx = this.scale.width / 2 - menuW / 2
|
||||
const my = this.scale.height / 2 - menuH / 2
|
||||
|
||||
@@ -677,7 +680,7 @@ export class UIScene extends Phaser.Scene {
|
||||
minusBtn.on('pointerdown', () => {
|
||||
this.uiOpacity = Math.max(0.4, Math.round((this.uiOpacity - 0.1) * 10) / 10)
|
||||
this.saveUISettings()
|
||||
this.updateDebugPanelBackground()
|
||||
this.updateStaticPanelOpacity()
|
||||
this.buildSettings()
|
||||
})
|
||||
this.settingsGroup.add(minusBtn)
|
||||
@@ -702,7 +705,7 @@ export class UIScene extends Phaser.Scene {
|
||||
plusBtn.on('pointerdown', () => {
|
||||
this.uiOpacity = Math.min(1.0, Math.round((this.uiOpacity + 0.1) * 10) / 10)
|
||||
this.saveUISettings()
|
||||
this.updateDebugPanelBackground()
|
||||
this.updateStaticPanelOpacity()
|
||||
this.buildSettings()
|
||||
})
|
||||
this.settingsGroup.add(plusBtn)
|
||||
@@ -753,10 +756,12 @@ export class UIScene extends Phaser.Scene {
|
||||
}
|
||||
|
||||
/**
|
||||
* Applies the current uiOpacity to the debug panel text background.
|
||||
* Called whenever uiOpacity changes so the debug panel stays in sync.
|
||||
* Applies the current uiOpacity to all static UI elements that are not
|
||||
* rebuilt on open (stockpile panel, debug panel background).
|
||||
* Called whenever uiOpacity changes.
|
||||
*/
|
||||
private updateDebugPanelBackground(): void {
|
||||
private updateStaticPanelOpacity(): void {
|
||||
this.stockpilePanel.setAlpha(this.uiOpacity)
|
||||
const hexAlpha = Math.round(this.uiOpacity * 255).toString(16).padStart(2, '0')
|
||||
this.debugPanelText.setStyle({ backgroundColor: `#000000${hexAlpha}` })
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user