Two colors in one text field using Actionscript 2

Question

I'm trying to get realtime rainbow text in a single word and reset to red when I space to the next word to create another rainbow word.

For instance, if I want to type the string, "his forgiveness", I want "h" to be red, "i" to be orange, "s" to be yellow, "f" to be red, "o" to be orange, "r" to be yellow, "g" to be green, "i" to be blue, "v" to be indigo, "e" to be violet. The remaining, "ness" can all be violet, I don't care. I just need the original concept down. So far, I'm only able to change the color of the whole text area on a keypress(s) and not a single string character.

To fast forward to where I am, follow this quick 4 point process:

(1/4)Paste the following code on the stage.

counter = -1;
var key:Object = {onKeyDown:function () {
counter = counter+1;
if (counter == 1) {
    inp.textColor = 0xFF0000;
}
if (counter == 2) {
    inp.textColor = 0xFF9900;
}
if (counter == 3) {
    inp.textColor = 0xFFFF00;
}
}};
Key.addListener(key);

(2/4)Make an input box with the instance name, "inp"

(3/4)Test the movie.

(4/4)Select the textbox and start typing in it.

I only have it changing the whole text box from your default color to red then orange than yellow. Getting a true rainbow code will be what I've long waited for if you can help.

Answer 1

In order to implement different colors on a single textfield you must use this properties on your textfield:

myTextField.html = true
myTextField.htmlText = 'bli bli bli<font color="#0000FF">bla bla bla/font>'

or you can use the TextFormat class to do so.

Here is how you can do.

tField.text = "bli bli bli";
var tFormat:TextFormat = new TextFormat();
tFormat.color = 0xff0000;
tField.setTextFormat(0,5,tFormat);

tFormat.color = 0x33cc33;
tField.setTextFormat(5,9,tFormat);

and in order to get the colors as you type use this class:

package  {

import flash.text.TextField;
import flash.text.TextFieldType;
import flash.text.TextFormat;
import flash.events.KeyboardEvent;
import flash.events.Event;

public class ColorTextField extends TextField{

    var tf:TextFormat = new TextFormat();
    var ar:Array = new Array(0xFF0000,0x00FF00,0x0000FF,0x123456);

    public function ColorTextField() {
        // constructor code
        this.type = TextFieldType.INPUT;

        tf.size = 33;
        this.defaultTextFormat = tf;


        this.addEventListener(KeyboardEvent.KEY_UP,onKeyUp);
    }


    private function onKeyUp(event:KeyboardEvent):void{

        var index:int = 0;
        var colorIndex:int = 0;

        while (index < this.text.length){

            var char:String = this.text.substr(index,1);
            if(char == " "){
                colorIndex = 0;
            }else{
                tf.color = ar[colorIndex];
                trace(index + "-" +ar[colorIndex]);
                this.setTextFormat(tf,index,index+1);

                colorIndex++;

                if(colorIndex > ar.length-1){
                    colorIndex = ar.length-1;
                }
            }

            index++;
        }
    }

}

}

this how you implement it.Create a new AS3 Fla and assign this as base class:

package  {

import flash.display.MovieClip;
import flash.text.TextField;
import flash.text.TextFieldType;


public class MyClass extends MovieClip {

    var tf:ColorTextField = new ColorTextField();

    public function MyClass() {
        // constructor code
        tf.width = 500;
        tf.text = "12345";

        this.addChild(tf);
    }
}

}

does not matter where you input the new text