linebender / linebender/parley

How to create rainbow text?

Open
#767 2 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

question
Dominant language
Rust
Stars
736
Forks
120
Avg merge
1d 3h
Merged PRs (30d)
53

Description

I've been playing with parley for a bit and have been trying to make rainbow text. In reality I'd like to animate each visual item to have it fade in or something, like how NPCs talk in a video game. If I add a color span for each letter I get something like this:

Rendered text in different colours

You can see it loops through white, blue, purple, yellow and repeats. This works for the most part but some colours seem to skip in places, especially with Devanagari script at the end.

More rendered text in different colours

If I colour it per-glyph I get less skipped colours but it doesn't really 'feel' like each colour is attached to a single 'character' of text. It's a vague, nebulous term, but I would say that for the purposes of this effect I'd like to split up the text horizontally in to pieces, but at the end you can see two glyphs are combining to make one vertical cluster. This would look a little strange to be animated in, I'd think.

More rendered text in different colours

Colouring it per-cluster seems to look the most 'reasonable' to me. A better example is Hebrew:

Hebrew text with each glyph coloured differently Hebrew text with each cluster coloured differently

Though one thing that is broken with this approach instead of giving each Unicode codepoint a span is that right to left text no longer gets coloured properly as iteration is done in visual order. Using spans of Unicode codepoints fixes this, maybe that's the better approach? But I would have to do breaking myself by grapheme cluster.

To me it seems like it would be a good idea to let glyph runs map to visual clusters somehow but maybe this is a design error? I feel a bit uncomfortable segmenting text with so many spans but maybe that's the correct approach?

Contributor guide

No contributing guide indexed for this repository

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start by reproducing the reported per-letter, per-glyph, and per-cluster coloring examples, including the Devanagari and Hebrew cases. Compare the behavior of Unicode-codepoint spans with visual-order iteration, then define what mapping or API should be considered done for RTL text and combined glyph clusters.

Written by the indexing model from the issue text.

Assessment

Tech stack
rust
Domain
computer-graphics, internationalization
Issue type
Feature
Difficulty
5/5
Estimated time
Over a week
Activity status
Active
Clarity
Needs clarification
Newbie friendliness
38/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.