Custom Font and Style

[Jimmeh]

Hey there. The default Minecraft font is too small for what I'm wanting to use it for, and trying to do:

MatrixStack#scale

before my:

Minecraft.font#draw

call doesn't work to actually scale the font itself (at least, it's not working for me).

So my next idea was to simply take the default font and scale it by 1.5x in Photoshop. So now I have my minecraft_1-5x.png file in the directory "assets/mod-id/font/minecraft_1-5x.png". I'm creating the ResourceLocation and Style to use that like so:

private static final ResourceLocation BIGGER_FONT = new ResourceLocation(TestMod.MOD_ID, "font/minecraft_1-5x.png");
private static final Style STYLE = Style.EMPTY.withFont(BIGGER_FONT);

...
minecraft.font.draw(pMatrixStack,
                    new StringTextComponent("Test String").withStyle(STYLE),
                    x,
                    y,
                    HexColors.WHITE
);

In game, this is now rendered as squares: https://gyazo.com/5e21ed018a839d9c928289776a2c0b17

I'm not really too sure what I'm doing wrong here; perhaps it's an incorrect folder structure. Thanks for any help!

[matthew123]

the scaling should work. Could you show the previous scaling code?

[Jimmeh]

Sure thing @matthew123. So I'm making a custom inventory screen and I'm wanting the text to be bigger because it's awfully small compared to everything else (as you'll see below). Here's the code for trying to scale the text:

            float x = pLeft;

            float y = pTop;

            pMatrixStack.scale(1.2f, 1.2f, 1.2f);

            minecraft.font.draw(pMatrixStack,
                    new StringTextComponent("Amethyst Crystal"),
                    x,
                    y,
                    HexColors.WHITE
            );

Here's the output without the MatrixStack#scale call: https://gyazo.com/ff4ab50a400feca55d72546b3e3b26f3

Now the display when calling scale(): https://gyazo.com/4638f6b1360a40bd19f78cab44926249

It's basically like a translation rather than a scale, so it's very confusing. I also tried making my own MatrixStack and applying the scale() call once at instantiation to avoid the compounding translation, but of course, that didn't scale anything - just translated it.

[matthew123]

7 minutes ago, Jimmeh said:

Sure thing @matthew123. So I'm making a custom inventory screen and I'm wanting the text to be bigger because it's awfully small compared to everything else (as you'll see below). Here's the code for trying to scale the text:

            float x = pLeft;

            float y = pTop;

            pMatrixStack.scale(1.2f, 1.2f, 1.2f);

            minecraft.font.draw(pMatrixStack,
                    new StringTextComponent("Amethyst Crystal"),
                    x,
                    y,
                    HexColors.WHITE
            );

Here's the output without the MatrixStack#scale call: https://gyazo.com/ff4ab50a400feca55d72546b3e3b26f3

Now the display when calling scale(): https://gyazo.com/4638f6b1360a40bd19f78cab44926249

It's basically like a translation rather than a scale, so it's very confusing. I also tried making my own MatrixStack and applying the scale() call once at instantiation to avoid the compounding translation, but of course, that didn't scale anything - just translated it.

you pretty much destroyed the matrix stack by scaling there. do a matrixStack.pushPose() then scale and draw, then popPose(). Additionally, you might want to translate it after scaling. You might need to offset the text based on the way scaling works.

[matthew123]

try learning how these work. I recommend learnopengl.com. Stop at the advanced section, you probably won't need it.

A little basic math might also help (see matrices).

[Jimmeh]

I appreciate the help and recommendation @matthew123. Thanks!

So trying it like you described, it's not doing an infinite amount of translations, which is nice. But it is still just translating instead of scaling. Any further ideas?

https://gyazo.com/f63f8b98f48c53e0ce28e946657031bb

 

pMatrixStack.pushPose();
pMatrixStack.scale(1.2f, 1.2f, 1.2f);

minecraft.font.draw(pMatrixStack,
                    new StringTextComponent("Amethyst Crystal"),
                    x,
                    y,
                    HexColors.WHITE
);
pMatrixStack.popPose();

 

Edited March 18, 2022 by Jimmeh
Grammar

[matthew123]

13 hours ago, Jimmeh said:

I appreciate the help and recommendation @matthew123. Thanks!

So trying it like you described, it's not doing an infinite amount of translations, which is nice. But it is still just translating instead of scaling. Any further ideas?

https://gyazo.com/f63f8b98f48c53e0ce28e946657031bb

 

pMatrixStack.pushPose();
pMatrixStack.scale(1.2f, 1.2f, 1.2f);

minecraft.font.draw(pMatrixStack,
                    new StringTextComponent("Amethyst Crystal"),
                    x,
                    y,
                    HexColors.WHITE
);
pMatrixStack.popPose();

 

Are you sure? Try scaling it more (e.g 5 times). Also, scale the coordinates as well, so it does not translate. 

[Jimmeh]

10 minutes ago, matthew123 said:

Also, scale the coordinates as well, so it does not translate.

I don't know why I didn't think of doing that. Thank you, it's fixed!