Sign in to follow this  

Multi-Style text

Recommended Posts



For a specific project, I needed to create a lot of multi-style text. And to be honest, it's just painful to do it manually every time. So I decided to create an object to do it for me, because I don't want to do it manually anymore :) This one calculates the position of each group of text automatically and will save me a lot of dev time now.


I called it "MultiStyleText" and the source code is available on github if you want:


I'm pretty sure there are a few bugs in there, especially with styles using different font-size. But this is a start :)

I've released it as 0.1.0 because I'm not sure yet of the way to create it, with the 2 "styles" object. Feel free to suggest improvements on that!


I put an example using the same that Mat created for Pixi.Text and here is the result:



Let me know what you think.

Share this post

Link to post
Share on other sites

I am getting PIXI undefined in pixi-multistyle-text.m.js. I am developing in react.


←→1 of 2 errors on the page
Unhandled Rejection (ReferenceError): PIXI is not defined
how to add PIXI reference in the library ?
Edited by Nagaraju

Share this post

Link to post
Share on other sites

If you use it through npm - then you have to do the same thing as for other pixiJS plugins:

import * as PIXI from "pixi.js";
window.PIXI = PIXI;
const { MultiStyleText } = require("pixi-multistyle-text");

The problem is that PixiJS is referenced globally in plugins and we really can't make it work through `import`s and at the same time generate typescript bindings and allow vanilla <script> usage. ES6 imports are hell for library+plugins architectures.

Share this post

Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Sign in to follow this  

  • Recently Browsing   0 members

    No registered users viewing this page.