[Share] A plugin to use SDF-based rich-text in PixiJS
See original GitHub issueHi, I made a new plugin for PixiJS.
PIXI.Text is pretty good in most situation, but it has some problems to me:
- Stroke and shadow effects are not very good, especially for CJK (Chinese, Japanese, Korean) characters or in 1~2px thickness.
- No support for CJK layout
- No support for rich text (mix multiple style in a line)
- Costly in performance when you want to make a typewriter effect
That’s why I wrote pixi-richtext.
Link: https://github.com/avgjs/pixi-richtext
Any suggestion or contribution is welcomed! 🎉
Feature
- Runtime signed distance field algorithm, with LRU cache for 1024 characters
- Better rendering effect
- No font file required, while supporting custom font via
@font-face
- Full support for CJK languages
- Simple layout using huozi
- Rich-text support
Preview
Rich text parsing time: 2 ms
SDF texture generating time: 286 ms
Convert AST to plain array: 13 ms
layout time: 35 ms
Issue Analytics
- State:
- Created 6 years ago
- Reactions:4
- Comments:5 (2 by maintainers)
Top Results From Across the Web
[Share] A plugin to use SDF-based rich-text in PixiJS #4225
Hi, I made a new plugin for PixiJS. PIXI.Text is pretty good in most situation, but it has some problems to me: Stroke...
Read more >Text - PixiJS
In order to draw text to the screen, you use a Text object. ... This approach allows truly rich text display while keeping...
Read more >PixiJS: How to use its ResizePlugin - Stack Overflow
I'm using the latest PixiJS release (as of today). Is there something I need to do before calling the queueResize() function? javascript ·...
Read more >Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start FreeTop Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Top GitHub Comments
@ivanpopelyshev
Yeah, I did spend a lot of time reading and understanding PixiJS code. I know that sdf-text plugin, but it depends on pre-generated fnt file. A fnt format font of CJK characters is usually badly big. So I have to consider run-time generating. 😭
In addition, copying SpriteRenderer is not a good practice but it seems we have no choice? However, I noticed this proposal, which mentioned the problem, will it help solve it?
This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.