Browse Source

fix: Update Panel.ts to properly handle background color and alpha

1. Added private _backgroundColor and _alpha instance properties
2. Updated resize() method to preserve backgroundColor and alpha instead of hardcoding
3. Fixed setBackgroundColor() to properly redraw background with new color instead of using tint
4. Initialized properties in constructor with default values

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
master
npmrun 3 weeks ago
parent
commit
b2f9260e6f
  1. 14
      src/components/Panel.ts

14
src/components/Panel.ts

@ -10,10 +10,14 @@ export interface PanelOptions extends ContainerOptions {
export class Panel extends Container { export class Panel extends Container {
private bg: Graphics; private bg: Graphics;
private _backgroundColor: number;
private _alpha: number;
constructor(opts: PanelOptions) { constructor(opts: PanelOptions) {
super(opts); super(opts);
this.bg = new Graphics(); this.bg = new Graphics();
this._backgroundColor = opts.backgroundColor ?? 0x000000;
this._alpha = opts.alpha ?? 0.8;
this.drawBackground(opts); this.drawBackground(opts);
this.addChild(this.bg); this.addChild(this.bg);
} }
@ -21,18 +25,20 @@ export class Panel extends Container {
private drawBackground(opts: PanelOptions): void { private drawBackground(opts: PanelOptions): void {
this.bg.clear(); this.bg.clear();
this.bg.roundRect(0, 0, opts.width, opts.height, 8); this.bg.roundRect(0, 0, opts.width, opts.height, 8);
this.bg.fill(opts.backgroundColor ?? 0x000000); this.bg.fill(this._backgroundColor);
this.bg.alpha = opts.alpha ?? 0.8; this.bg.alpha = this._alpha;
} }
resize(width: number, height: number): void { resize(width: number, height: number): void {
this.bg.clear(); this.bg.clear();
this.bg.roundRect(0, 0, width, height, 8); this.bg.roundRect(0, 0, width, height, 8);
this.bg.fill(0x000000); this.bg.fill(this._backgroundColor);
this.bg.alpha = this._alpha;
} }
setBackgroundColor(color: number): void { setBackgroundColor(color: number): void {
this.bg.tint = color; this._backgroundColor = color;
this.resize(this.width, this.height);
} }
} }

Loading…
Cancel
Save