CODEWITHSUNDEEP
javascriptpixi.js
Unde Clash
Unde Clash

Reputation: 13

pixijs text is cutted

I'm trying to draw text in pixijs app stage and the text is cut off a bit. See the screenshot below.

"NAGITTO" stylized text, cut off at the start and end

I've tried to put it inside container but I can't fix it.

const style = new PIXI.TextStyle({
    fontFamily: 'Bangers',
    fontSize: 256,
    fontWeight: 'bold',
    fill: ['#ffa512', '#ff9e00'], // gradient
    stroke: '#fff',
    strokeThickness: 5,
    dropShadow: true,
    dropShadowColor: '#000000',
    dropShadowBlur: 4,
    dropShadowAngle: Math.PI / 6,
    dropShadowDistance: 2,
});

const richText = new PIXI.Text('Nagitto', style);
richText.x = 50;
richText.y = 250;

app.stage.addChild(richText);

No exceptions. I'm using a font from google fonts.

Upvotes: 0

Views: 1352

Answers (2)

Vishnu Hari
Vishnu Hari

Reputation: 169

Use padding property inside style.

padding: 5,

I suggest you can use https://pixijs.io/pixi-text-style/# to dynamically create text with a preview.

Upvotes: 3

Ivan Dzhurov
Ivan Dzhurov

Reputation: 197

The text is hardly cut from the code you wrote to create it. In my experience, this is only happening when there is a mask on the stage. Please show the code for your container where you add the text in.

Upvotes: 0

Related Questions