text color and other stylings?

[blurymind]

What is the recommended way of styling npc text in kaboomjs? I am asking because Iam thinking of creating a bondagejs plugin.

The idea is to be able to use yarn editor to create npc dialogue and use it in kaboomjs games https://github.com/YarnSpinnerTool/YarnEditor

online editor demo https://yarnspinnertool.github.io/YarnEditor/

Yarn can do both bbcode and xml style syntax for styling chunks of text

so I need two elements:

• scrolling text
• multistyle text via tags (bbcode or xml)

Kaboom appears to be able to load fonts, but I couldnt find anything about styling them - color, boldness, etc.

Should a multistyle text be created via many different text objects? Should such thing be done outside of kaboom?

[slmjkdbtl]

You can use color() component with text() component to create colored text. Kaboom uses bitmap font so it's harder to have built-in bold / italic support, the only way right now is if you provide the bitmap for those styles and change create text() with those font or assign the .font property. (bold and italic can be simulated with a shader tho I think)

There's no easy way to have multiple styles in a piece of text yet, it'll be very tough to use multiple text objects that can't get formatted as a whole. Some kind of chunked text even formatting syntax support, and it should be done inside kaboom.

And yeah I'm interested in doing yarn integration. I'll look into bondagejs and yarn's format to see if it can inspired some features here.

[blurymind]

I guess for bondagejs, it is not an absolute requirement to have text styling - since that is an extra feature.

As I see it these are separate features that compliment each other very well

• parsing yarn files via bondagejs to easily create rich and nonlinear dialogue in games (bondagejs also handles the story variables, you can read and write to its store for game load/save)
• scrolling text (some engines like godot let you clip text content directly by passing a parameter to the text object) https://docs.godotengine.org/en/stable/classes/class_label.html
• text multistyling (i think godot does something with shaders to style their bitmap text and even animate parts of it)

So there is a case to be made that each is non blocking and can be added independently as plugins or to the core

The yarn editor has a wrapper for bondagejs already that can be used for inspiration, but a better and more battle tested one is the one that gdevelop is using https://github.com/4ian/GDevelop/blob/master/Extensions/DialogueTree/dialoguetools.ts

Thank you for looking into this btw. I believe that being able to easily create story rich games is really empowering to have in an engine. This is why renpy and rpg maker engines are so popular nowadays. Alot of developers are really storytellers.

Whats cool about yarn is that you can set/get variables using the yarn syntax when you write dialogue and you can even set it to trigger engine logic using <<command param param>> the gdevelop extension exposes all of those features http://wiki.compilgames.net/doku.php/gdevelop5/all-features/dialogue-tree

[slmjkdbtl]

Related: #431

[i42lorua]

And how can you load a font in kaboom? Because I'm trying to load eldelfontmed but I don't know how to do it. I have the .tts of this font but I don't know how to use it in kaboom. And how can I make kaboom to show the ñ or letters with "á"?

[dbarnett]

@i42lorua You probably want to ask those as new questions (or see if someone already asked them), but the short answer is: load a font with loadFont(), and the fonts currently don't seem to have any kind of support for special characters (at least for bitmap fonts they don't seem to?). So you'd probably need to hack it to draw your own diacritics over the letters.