display a string with different character color

Getting Started Newbie Questions
#1

Hi, my name is yohan and I’m just starting to code using corona.

For my first apps, I want to build a function that allowed me to display a string but with a different color for each character.
The objective for this function is to be used for coloring a character one by one using a color defined before. So, at first the string will be colored white, then the user can choose a color then click on the desired character to change its color.

I’m very much appreciate for any help I could get :slight_smile:

help me please,
Yohan [import]uid: 124207 topic_id: 24703 reply_id: 324703[/import]

#2

You would have to draw each letter independently then use :setFillColor() to change the color of each letter. [import]uid: 19626 topic_id: 24703 reply_id: 100119[/import]

#3

Hi Robmiracle, first of all thank you for the reply.
There are plenty of awesome fonts in the net and I would like to just use them. I’m afraid if I draw each fonts the result would not be that good.
I have a thought:

  1. put the string in a variable
  2. and put the color code in somekind of array with the same sequence as the string character.
  3. substring each character one by one from the string variable and also fetch the related color code from the array.
  4. display the first char
  5. calculate the next x position of the new char
  6. display the next char
  7. loop until all the character in the string variable displayed.

have not tried the code yet coz my thought are based on logic only.
Could I do those things above in corona ?

Regards,
Yohan [import]uid: 124207 topic_id: 24703 reply_id: 100226[/import]

#4

Really basic but hopefully helpful as a starting point;

[lua]local myArray = {
“T”,
“E”,
“S”,
“T”,
“I”,
“N”,
“G”
}

local letter = {}

for i = 1, #myArray do
letter[i] = display.newText(myArray[i], 0, 10, “Arial-Black”, 24)
letter[i].x = i*20
letter[i]:setTextColor(math.random(1,255), math.random(1,255), math.random(1,255))
end[/lua]

Try running that :slight_smile: [import]uid: 52491 topic_id: 24703 reply_id: 100278[/import]

#5

wow thanks peach :slight_smile: it works. just a basic for you but its like a breaching light to me :slight_smile:

now I just need to change the color as requested by the user, I think I can use the same method for that right ?

btw, I noticed the letter spacing between N and G is a bit tight. Is it related to the width of the letter I ? I think so right? :slight_smile:

Regards,
Yohan [import]uid: 124207 topic_id: 24703 reply_id: 100298[/import]

#6

No worries Yohan.

Add this line in BEFORE you set the x, should help that out;
[lua]letter[i]:setReferencePoint(display.CenterReferencePoint)[/lua]
(Yes, it was related to width of I combined with a left reference point.)

You should be able to modify this code to do that, yes. Right now it just makes them all random but it should give you something to go on.

Peach :slight_smile: [import]uid: 52491 topic_id: 24703 reply_id: 100382[/import]

#7

Hi Peach,

thanks for the respond :slight_smile:
been doing some modification and I think I’m getting there :slight_smile: slow but sure… with your help naturally :slight_smile:

peach, not to add more trouble for you, but I could use some enlightment here also :slight_smile:

links: need some help

Regards,
Yohan
[import]uid: 124207 topic_id: 24703 reply_id: 101784[/import]

#8

My word that’s long! I will see if I can take a look at it later tonight or in the AM, time permitting.

Glad to hear you are getting there with your text :slight_smile:

Peach [import]uid: 52491 topic_id: 24703 reply_id: 101811[/import]