[UI] Adding container to set transparency of optionSelectText (#5396)

This commit is contained in:
Wlowscha 2025-02-23 00:38:11 +01:00 committed by GitHub
parent b1b71dbd6d
commit bd288ad862
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 12 additions and 8 deletions

View File

@ -35,6 +35,7 @@ const scrollDownLabel = "↓";
export default abstract class AbstractOptionSelectUiHandler extends UiHandler {
protected optionSelectContainer: Phaser.GameObjects.Container;
protected optionSelectTextContainer: Phaser.GameObjects.Container;
protected optionSelectBg: Phaser.GameObjects.NineSlice;
protected optionSelectText: BBCodeText;
protected optionSelectIcons: Phaser.GameObjects.Sprite[];
@ -53,6 +54,7 @@ export default abstract class AbstractOptionSelectUiHandler extends UiHandler {
protected unskippedIndices: number[] = [];
protected defaultTextStyle: TextStyle = TextStyle.WINDOW;
protected textContent: string;
constructor(mode: Mode | null) {
@ -78,6 +80,9 @@ export default abstract class AbstractOptionSelectUiHandler extends UiHandler {
this.optionSelectBg.setOrigin(1, 1);
this.optionSelectContainer.add(this.optionSelectBg);
this.optionSelectTextContainer = globalScene.add.container(0, 0);
this.optionSelectContainer.add(this.optionSelectTextContainer);
this.optionSelectIcons = [];
this.scale = getTextStyleOptions(TextStyle.WINDOW, globalScene.uiTheme).scale;
@ -123,19 +128,18 @@ export default abstract class AbstractOptionSelectUiHandler extends UiHandler {
);
this.optionSelectText.setOrigin(0, 0);
this.optionSelectText.setName("text-option-select");
this.optionSelectContainer.add(this.optionSelectText);
this.optionSelectTextContainer.add(this.optionSelectText);
this.optionSelectContainer.setPosition((globalScene.game.canvas.width / 6) - 1 - (this.config?.xOffset || 0), -48 + (this.config?.yOffset || 0));
this.optionSelectBg.width = Math.max(this.optionSelectText.displayWidth + 24, this.getWindowWidth());
this.optionSelectBg.height = this.getWindowHeight();
this.optionSelectText.setPosition(this.optionSelectBg.x - this.optionSelectBg.width + 12 + 24 * this.scale, this.optionSelectBg.y - this.optionSelectBg.height + 2 + 42 * this.scale);
this.optionSelectTextContainer.setPosition(this.optionSelectBg.x - this.optionSelectBg.width + 12 + 24 * this.scale, this.optionSelectBg.y - this.optionSelectBg.height + 2 + 42 * this.scale);
// Now that the container and background widths are established, we can set up the proper text restricted to visible options
this.optionSelectText.setText(optionsWithScroll.map(o => o.item
this.textContent = optionsWithScroll.map(o => o.item
? `[shadow=${getTextColor(o.style ?? this.defaultTextStyle, true, globalScene.uiTheme)}][color=${getTextColor(o.style ?? TextStyle.WINDOW, false, globalScene.uiTheme)}] ${o.label}[/color][/shadow]`
: `[shadow=${getTextColor(o.style ?? this.defaultTextStyle, true, globalScene.uiTheme)}][color=${getTextColor(o.style ?? TextStyle.WINDOW, false, globalScene.uiTheme)}]${o.label}[/color][/shadow]`
).join("\n")
);
).join("\n");
this.optionSelectText.setText(this.textContent);
options.forEach((option: OptionSelectItem, i: number) => {
if (option.item) {
@ -184,7 +188,7 @@ export default abstract class AbstractOptionSelectUiHandler extends UiHandler {
if (this.config.delay) {
this.blockInput = true;
this.optionSelectText.setAlpha(0.5);
this.optionSelectTextContainer.setAlpha(0.5);
this.cursorObj?.setAlpha(0.8);
globalScene.time.delayedCall(Utils.fixedInt(this.config.delay), () => this.unblockInput());
}
@ -278,7 +282,7 @@ export default abstract class AbstractOptionSelectUiHandler extends UiHandler {
}
this.blockInput = false;
this.optionSelectText.setAlpha(1);
this.optionSelectTextContainer.setAlpha(1);
this.cursorObj?.setAlpha(1);
}