Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Fix text horizontal and vertical alignment error #772

Merged
merged 9 commits into from
Jun 2, 2022
3 changes: 1 addition & 2 deletions packages/core/src/2d/sprite/Sprite.ts
Original file line number Diff line number Diff line change
Expand Up @@ -112,8 +112,7 @@ export class Sprite extends RefObject {

set pivot(value: Vector2) {
const pivot = this._pivot;
const x = MathUtil.clamp(value.x, 0, 1);
const y = MathUtil.clamp(value.y, 0, 1);
const { x, y } = value;
if (pivot === value || pivot.x !== x || pivot.y !== y) {
pivot.setValue(x, y);
this._setDirtyFlagTrue(DirtyFlag.positions);
Expand Down
46 changes: 33 additions & 13 deletions packages/core/src/2d/text/TextRenderer.ts
Original file line number Diff line number Diff line change
Expand Up @@ -329,19 +329,12 @@ export class TextRenderer extends Renderer {
* @override
*/
protected _updateBounds(worldBounds: BoundingBox): void {
const sprite = this._sprite;
if (sprite && sprite.texture) {
if (this._customLocalBounds && this._customRootEntity) {
const worldMatrix = this._customRootEntity.transform.worldMatrix;
BoundingBox.transform(this._customLocalBounds, worldMatrix, worldBounds);
} else {
const localBounds = sprite.bounds;
const worldMatrix = this._entity.transform.worldMatrix;
BoundingBox.transform(localBounds, worldMatrix, worldBounds);
}
if (this._customLocalBounds && this._customRootEntity) {
const worldMatrix = this._customRootEntity.transform.worldMatrix;
BoundingBox.transform(this._customLocalBounds, worldMatrix, worldBounds);
} else {
worldBounds.min.setValue(0, 0, 0);
worldBounds.max.setValue(0, 0, 0);
const worldMatrix = this._entity.transform.worldMatrix;
BoundingBox.transform(this._sprite.bounds, worldMatrix, worldBounds);
}
}

Expand Down Expand Up @@ -378,7 +371,34 @@ export class TextRenderer extends Renderer {
const { width, height } = trimData;
const canvas = TextUtils.updateCanvas(width, height, trimData.data);
this._clearTexture();
const { _sprite: sprite } = this;
const { _sprite: sprite, horizontalAlignment, verticalAlignment } = this;

// Handle the case that width or height of text is larger than real width or height.
const { pixelsPerUnit, pivot } = sprite;
switch (horizontalAlignment) {
case TextHorizontalAlignment.Left:
pivot.x = (this.width * pixelsPerUnit) / width * 0.5;
break;
case TextHorizontalAlignment.Right:
pivot.x = 1 - (this.width * pixelsPerUnit) / width * 0.5;
break;
case TextHorizontalAlignment.Center:
pivot.x = 0.5;
break;
}
switch (verticalAlignment) {
case TextVerticalAlignment.Top:
pivot.y = 1 - (this.height * pixelsPerUnit) / height * 0.5;
break;
case TextVerticalAlignment.Bottom:
pivot.y = (this.height * pixelsPerUnit) / height * 0.5;
break;
case TextVerticalAlignment.Center:
pivot.y = 0.5;
break;
}
sprite.pivot = pivot;

// If add fail, set texture for sprite.
cptbtptpbcptdtptp marked this conversation as resolved.
Show resolved Hide resolved
if (!this.engine._dynamicTextAtlasManager.addSprite(sprite, canvas)) {
const texture = new Texture2D(this.engine, width, height);
Expand Down