diff --git a/CHANGELOG.md b/CHANGELOG.md
index 4eff4a35e..05fdd443b 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -7,7 +7,7 @@ This project adheres to [Semantic Versioning](http://semver.org/).
### Breaking Changes
-- `ex.Action` now requires a unique `id` property
+-
### Deprecated
@@ -18,14 +18,12 @@ This project adheres to [Semantic Versioning](http://semver.org/).
### Added
- `actor.oldGlobalPos` returns the globalPosition from the previous frame
-- Built in actions now have a unique `id` property
- create development builds of excalibur that bundlers can use in dev mode
- show warning in development when Entity hasn't been added to a scene after a few seconds
### Fixed
-- Fixed animation glitch caused by uninitialized state in `ImageRenderer`
-- Fixed issue where `ex.Loader.suppressPlayButton = true` did not work. Only using the `ex.Engine({suppressPlayButton: true})` worked
+- Fixed issue where `ex.SpriteFont` did not respect scale when measuring text
### Updates
@@ -33,12 +31,36 @@ This project adheres to [Semantic Versioning](http://semver.org/).
### Changed
-- `ex.Vector.toAngle()` now returns angles from [0 - 2 PI)
+## [v0.29.3]
+
+### Breaking Changes
+
+- `ex.Action` now requires a unique `id` property
+
+### Deprecated
+
+### Added
+
+- Built in actions now have a unique `id` property
+
+### Fixed
+
+- Fixed animation glitch caused by uninitialized state in `ImageRenderer`
+- Fixed issue where `ex.Loader.suppressPlayButton = true` did not work. Only using the `ex.Engine({suppressPlayButton: true})` worked
+
+### Updates
+
+-
+
+### Changed
+
+- `ex.Vector.toAngle()` now returns angles from `[0 - 2 PI)`
+
## [v0.29.2]
### Breaking Changes
diff --git a/sandbox/tests/spritefont-measuring/font.png b/sandbox/tests/spritefont-measuring/font.png
new file mode 100644
index 000000000..46fded31d
Binary files /dev/null and b/sandbox/tests/spritefont-measuring/font.png differ
diff --git a/sandbox/tests/spritefont-measuring/index.html b/sandbox/tests/spritefont-measuring/index.html
new file mode 100644
index 000000000..a661e254a
--- /dev/null
+++ b/sandbox/tests/spritefont-measuring/index.html
@@ -0,0 +1,13 @@
+
+
+
+
+
+
+ Sprite Font Rendering
+
+
+
+
+
+
diff --git a/sandbox/tests/spritefont-measuring/index.ts b/sandbox/tests/spritefont-measuring/index.ts
new file mode 100644
index 000000000..70e000c05
--- /dev/null
+++ b/sandbox/tests/spritefont-measuring/index.ts
@@ -0,0 +1,46 @@
+class TestFontMeasuringScene extends ex.Scene {
+ font1: ex.SpriteFont;
+ font2: ex.SpriteFont;
+ async onInitialize(game: ex.Engine) {
+ super.onInitialize(game);
+ let loader = new ex.DefaultLoader();
+ let fontImage = new ex.ImageSource('font.png');
+ loader.addResource(fontImage);
+ await game.start(loader);
+
+ let fontSpriteSheet = ex.SpriteSheet.fromImageSource({
+ image: fontImage,
+ grid: { columns: 1, rows: 45, spriteWidth: 10, spriteHeight: 10 }
+ });
+
+ this.font1 = this.createFont(fontSpriteSheet);
+ this.font2 = this.createFont(fontSpriteSheet);
+ this.font2.scale = ex.vec(2, 2);
+ }
+
+ createFont(spriteSheet: ex.SpriteSheet) {
+ return new ex.SpriteFont({
+ alphabet: '01234567890.- ©][ABCDEFGHIJKLMNOPQRSTUVWXYZ|/',
+ caseInsensitive: true,
+ spriteSheet
+ });
+ }
+ onActivate(ctx: ex.SceneActivationContext) {
+ const text = 'brown fox jumps over the lazy dog';
+ let m1 = this.font1.measureText(text);
+ console.log('font 1', m1.dimensions); //330,10, OK
+ let m2 = this.font2.measureText(text);
+ console.log('font 2', m2.dimensions); //330,10, should be 660,20
+ }
+}
+
+var engineSpriteFont = new ex.Engine({
+ width: 600,
+ height: 600,
+ pixelArt: true,
+ scenes: {
+ start: TestFontMeasuringScene
+ }
+});
+
+engineSpriteFont.start('start');
diff --git a/sandbox/tests/spritefont-rendering/font.png b/sandbox/tests/spritefont-rendering/font.png
new file mode 100644
index 000000000..46fded31d
Binary files /dev/null and b/sandbox/tests/spritefont-rendering/font.png differ
diff --git a/sandbox/tests/spritefont-rendering/index.html b/sandbox/tests/spritefont-rendering/index.html
new file mode 100644
index 000000000..a661e254a
--- /dev/null
+++ b/sandbox/tests/spritefont-rendering/index.html
@@ -0,0 +1,13 @@
+
+
+
+
+
+
+ Sprite Font Rendering
+
+
+
+
+
+
diff --git a/sandbox/tests/spritefont-rendering/index.ts b/sandbox/tests/spritefont-rendering/index.ts
new file mode 100644
index 000000000..4f4e7dc05
--- /dev/null
+++ b/sandbox/tests/spritefont-rendering/index.ts
@@ -0,0 +1,37 @@
+class TestFontScene extends ex.Scene {
+ async onInitialize(game: ex.Engine) {
+ super.onInitialize(game);
+ let loader = new ex.DefaultLoader();
+ let fontImage = new ex.ImageSource('./font.png');
+ loader.addResource(fontImage);
+ await game.start(loader);
+ let fontSpriteSheet = ex.SpriteSheet.fromImageSource({
+ image: fontImage,
+ grid: { columns: 1, rows: 45, spriteWidth: 10, spriteHeight: 10 }
+ });
+ let font = new ex.SpriteFont({
+ alphabet: '01234567890.- ©][ABCDEFGHIJKLMNOPQRSTUVWXYZ|/',
+ caseInsensitive: true,
+ spriteSheet: fontSpriteSheet,
+ scale: ex.vec(4, 4)
+ });
+ let lbl = new ex.Label({
+ pos: ex.vec(10, 10),
+ anchor: ex.vec(0, 0),
+ text: '-brown fox jumps \nover the lazy dog',
+ spriteFont: font
+ });
+ this.add(lbl);
+ }
+}
+
+var engineSpriteFont = new ex.Engine({
+ width: 600,
+ height: 600,
+ pixelArt: true,
+ scenes: {
+ start: TestFontScene
+ }
+});
+
+engineSpriteFont.start('start');
diff --git a/src/engine/Graphics/SpriteFont.ts b/src/engine/Graphics/SpriteFont.ts
index 1189a7cc6..bd99d6a8b 100644
--- a/src/engine/Graphics/SpriteFont.ts
+++ b/src/engine/Graphics/SpriteFont.ts
@@ -99,7 +99,7 @@ export class SpriteFont extends Graphic implements FontRenderer {
width += sprite.width + this.spacing;
height = Math.max(height, sprite.height);
}
- return BoundingBox.fromDimension(width, height * lines.length, Vector.Zero);
+ return BoundingBox.fromDimension(width * this.scale.x, height * lines.length * this.scale.y, Vector.Zero);
}
protected _drawImage(ex: ExcaliburGraphicsContext, x: number, y: number, maxWidth?: number): void {
diff --git a/src/spec/TextSpec.ts b/src/spec/TextSpec.ts
index 3b28f07df..4389e21d6 100644
--- a/src/spec/TextSpec.ts
+++ b/src/spec/TextSpec.ts
@@ -921,6 +921,45 @@ describe('A Text Graphic', () => {
await expectAsync(canvasElement).toEqualImage('src/spec/images/GraphicsTextSpec/spritefont-text.png');
});
+ it('can scale a spritefont', async () => {
+ const spriteFontImage = new ex.ImageSource('src/spec/images/GraphicsTextSpec/spritefont.png');
+
+ await spriteFontImage.load();
+
+ const spriteFontSheet = ex.SpriteSheet.fromImageSource({
+ image: spriteFontImage,
+ grid: {
+ rows: 3,
+ columns: 16,
+ spriteWidth: 16,
+ spriteHeight: 16
+ }
+ });
+
+ const spriteFont = new ex.SpriteFont({
+ alphabet: '0123456789abcdefghijklmnopqrstuvwxyz,!\'&."?- ',
+ caseInsensitive: true,
+ spacing: -5,
+ spriteSheet: spriteFontSheet,
+ scale: ex.vec(3, 3)
+ });
+
+ const sut = new ex.Text({
+ text: 'Some Sprite Text!?',
+ font: spriteFont
+ });
+
+ const canvasElement = document.createElement('canvas');
+ canvasElement.width = 200;
+ canvasElement.height = 100;
+ const ctx = new ex.ExcaliburGraphicsContext2DCanvas({ canvasElement });
+
+ ctx.clear();
+ sut.draw(ctx, 0, 50);
+ expect(spriteFont.measureText('some test')).toEqual(ex.BoundingBox.fromDimension((16 - 5) * 9 * 3, 16 * 3, ex.vec(0, 0)));
+ await expectAsync(canvasElement).toEqualImage('src/spec/images/GraphicsTextSpec/spritefont-scaled.png');
+ });
+
it('can have a custom lineHeight', async () => {
const spriteFontImage = new ex.ImageSource('src/spec/images/GraphicsTextSpec/spritefont.png');
diff --git a/src/spec/images/GraphicsTextSpec/spritefont-scaled.png b/src/spec/images/GraphicsTextSpec/spritefont-scaled.png
new file mode 100644
index 000000000..9a24b23fc
Binary files /dev/null and b/src/spec/images/GraphicsTextSpec/spritefont-scaled.png differ