From 45052e29c4bf58043a9972142b5750c9c722d53c Mon Sep 17 00:00:00 2001
From: Aysen69 <76961750+Aysen69@users.noreply.github.com>
Date: Mon, 23 May 2022 17:55:03 +0300
Subject: [PATCH] Adds resolution property in BitmapText (#8357)

---
 packages/text-bitmap/src/BitmapText.ts        | 45 ++++++++++++++++-
 packages/text-bitmap/test/BitmapText.tests.ts | 50 ++++++++++++++++++-
 2 files changed, 93 insertions(+), 2 deletions(-)

diff --git a/packages/text-bitmap/src/BitmapText.ts b/packages/text-bitmap/src/BitmapText.ts
index 61a1580e6b..ac4ded84f1 100644
--- a/packages/text-bitmap/src/BitmapText.ts
+++ b/packages/text-bitmap/src/BitmapText.ts
@@ -81,6 +81,16 @@ export class BitmapText extends Container
     /** Set to `true` if the BitmapText needs to be redrawn. */
     public dirty: boolean;
 
+    /**
+     * The resolution / device pixel ratio of the canvas.
+     *
+     * This is set to automatically match the renderer resolution by default, but can be overridden by setting manually.
+     *
+     * @default PIXI.settings.RESOLUTION
+     */
+    _resolution: number;
+    _autoResolution: boolean;
+
     /**
      * Private tracker for the width of the overall text.
      *
@@ -215,6 +225,8 @@ export class BitmapText extends Container
         this._anchor = new ObservablePoint((): void => { this.dirty = true; }, this, 0, 0);
         this._roundPixels = settings.ROUND_PIXELS;
         this.dirty = true;
+        this._resolution = settings.RESOLUTION;
+        this._autoResolution = true;
         this._textureCache = {};
     }
 
@@ -608,6 +620,12 @@ export class BitmapText extends Container
 
     _render(renderer: Renderer): void
     {
+        if (this._autoResolution && this._resolution !== renderer.resolution)
+        {
+            this._resolution = renderer.resolution;
+            this.dirty = true;
+        }
+
         // Update the uniform
         const { distanceFieldRange, distanceFieldType, size } = BitmapFont.available[this._fontName];
 
@@ -624,7 +642,7 @@ export class BitmapText extends Container
 
             for (const mesh of this._activePagesMeshData)
             {
-                mesh.mesh.shader.uniforms.uFWidth = worldScale * distanceFieldRange * fontScale * renderer.resolution;
+                mesh.mesh.shader.uniforms.uFWidth = worldScale * distanceFieldRange * fontScale * this._resolution;
             }
         }
 
@@ -874,6 +892,31 @@ export class BitmapText extends Container
         return this._textHeight;
     }
 
+    /**
+     * The resolution / device pixel ratio of the canvas.
+     *
+     * This is set to automatically match the renderer resolution by default, but can be overridden by setting manually.
+     *
+     * @default 1
+     */
+    get resolution(): number
+    {
+        return this._resolution;
+    }
+
+    set resolution(value: number)
+    {
+        this._autoResolution = false;
+
+        if (this._resolution === value)
+        {
+            return;
+        }
+
+        this._resolution = value;
+        this.dirty = true;
+    }
+
     destroy(options?: boolean | IDestroyOptions): void
     {
         const { _textureCache } = this;
diff --git a/packages/text-bitmap/test/BitmapText.tests.ts b/packages/text-bitmap/test/BitmapText.tests.ts
index 14721dc640..24094c60cf 100644
--- a/packages/text-bitmap/test/BitmapText.tests.ts
+++ b/packages/text-bitmap/test/BitmapText.tests.ts
@@ -1,7 +1,8 @@
 import path from 'path';
 import fs from 'fs';
 import { BitmapText, BitmapFont } from '@pixi/text-bitmap';
-import { Texture } from '@pixi/core';
+import { settings } from '@pixi/settings';
+import { Texture, Renderer } from '@pixi/core';
 import sinon from 'sinon';
 import { expect } from 'chai';
 
@@ -185,4 +186,51 @@ describe('BitmapText', function ()
 
         expect(() => text.updateText()).to.not.throw();
     });
+
+    it('should set the text resolution to match the resolution setting when constructed time', function ()
+    {
+        const text = new BitmapText('foo', {
+            fontName: this.font.font,
+        });
+
+        expect(text.resolution).to.equal(settings.RESOLUTION);
+    });
+
+    it('should update the text resolution to match the renderer resolution when being rendered to screen', function ()
+    {
+        const text = new BitmapText('foo', {
+            fontName: this.font.font,
+        });
+
+        expect(text.resolution).to.equal(settings.RESOLUTION);
+
+        const renderer = new Renderer({ resolution: 2 });
+
+        expect(renderer.resolution).to.equal(2);
+
+        renderer.render(text);
+
+        expect(text.resolution).to.equal(renderer.resolution);
+
+        renderer.destroy();
+    });
+
+    it('should use any manually set text resolution over the renderer resolution', function ()
+    {
+        const text = new BitmapText('foo', {
+            fontName: this.font.font,
+        });
+
+        text.resolution = 3;
+
+        expect(text.resolution).to.equal(3);
+
+        const renderer = new Renderer({ resolution: 2 });
+
+        renderer.render(text);
+
+        expect(text.resolution).to.equal(3);
+
+        renderer.destroy();
+    });
 });