Change font-color of TextField inside MovieClip - actionscript-3

I've a problem to change the font-color of a TextField after it has been added as a child to a MovieClip.
My code:
var btn:MovieClip = new MovieClip();
// other code for button
var tf:TextFormat = new TextFormat();
tf.size = 12;
tf.bold = true;
tf.font = "Arial"
tf.color = 0x000000;
var capt:TextField = new TextField();
capt.defaultTextFormat = tf;
capt.width = 200;
capt.height = 50;
capt.text = "Test";
capt.y = 20;
capt.x = 20;
capt.border = false;
capt.selectable = false;
btn.addChild(capt);
// .....
How can I Change the font-color after the last line?

It sounds like you're looking for TextField.setTextFormat(). You can either adjust your original TextFormat or just make a whole new one.
tf.color = 0xFF0000;
capt.setTextFormat(tf);

Assuming the TextField falls out of scope after that last line (you don't show enough to know if it does or not), you'll need to loop through the button to get the TextField and do it from there.
var i:uint;
var l:uint = btn.numChildren; //numChildren and length are 'heavy' getters, never use them as restrictors in a loop
for ( i = 0; i < l; i++ ) {
var cur:DisplayObject = btn.getChildAt( i );
if ( cur is TextField ) {
( cur as TextField ).setTextFormat( /*set new TextFormat in here*/);
break;
}
}
That assumes there is only the single TextField, of course. If there are multiple, I would extend MovieClip and add a public property for the value you want to change.

You can also just use the textColor property of a textfield:
capt.textColor = 0xFF0000;

Related

TextField as3 getting the input

i have a problem witch i cant solve, and i wanted to ask what am i doing wrong. The idea should be that when i create the textfield i want to read from it, but it doesnt
function click2(e:MouseEvent):void{
e.currentTarget.removeEventListener(MouseEvent.CLICK, click2);
fx=e.target.x+400;
fy=e.target.y+300;
var i:int;
i=2;
trace(str);
trace(e.target.name);
var line:Shape = new Shape();
line.graphics.lineStyle(1,0xFF0000,2);
line.graphics.moveTo(sx,sy);
line.graphics.lineTo(fx,fy);
this.addChild(line);
var inputField:TextField = new TextField();
inputField.border = true;
inputField.type = TextFieldType.INPUT;
inputField.width = 23;
inputField.height = 18;
inputField.x = (sx+fx)/2;
inputField.y = (sy+fy)/2;
inputField.multiline = false;
inputField.maxChars = 3;
inputField.restrict = "0-9";
str=inputField.text;
addChild(inputField);
}
In this code i create a line, and near it appears a textfield , where you need to input the value of the line, but i can`t get it , when i want to trace the STR value, it is null,the text should be written by the user and i should read it ...
If you want to check the data the user added to the textinput you have to listen for the change-event. After that you can access the provided text.
function click2(e:MouseEvent):void{
...
inputfield.addEventListener(Event.CHANGE, checkInput);
}
function checkInput(e:Event):void {
//receive input value and validate it
var textfield:TextField = e.target as TextField;
var str:String = textfield.text;
...
}

Text Field in Actionscript3

I am trying to create a text field manually from actionscript alone. I got parts of it but now i don't know how to give the fonts size and different fonts can somebody tell me how to go about this?
for (var i:Number = 0; i < weekdaystringArray.length ; i++)
{
weekdaystring.text = weekdaystringArray [i];
weekdaystring.x = 150;
weekdaystring.y = 994;
addChild (weekdaystring);
weekdaystring.textColor = 0xFFFFFF;
}
This is what I have so far...
You need to apply a TextFormat to the TextField with the setTextFormat() method.
var format:TextFormat = new TextFormat();
format.font = "Courier";
format.size = 24;
// then inside your loop:
weekdaystring.setTextFormat(format);
it need to apply a TextFormat to the TextFiled
var format:TextFormat = weekdaystring.defaultTextFormat;
format.font = "courier";
format.size = 24
weekdaystring.defaultTextFormat = format;

AS3 removing dynamically created child movieclips

I'm fairly new to AS3. Anyways, I'm try to remove a dynamically created child movieclip when clicked on. When a dirt block is clicked on, which is a child movieclip of 'world' I want to remove it.
I've tried various ways of removing it using removeChild. I've also tried moving the function inside/outside of the for loop that creates the movieclips.
var blockCount:Number = 0;
var blockArray:Array = [];
var world:MovieClip = new World();
world.x = 50;
world.y = 50;
world.name = "world";
addChild(world);
for(var i:Number=1;i<=100;i++){
blockCount++;
var tempGrassBlock:MovieClip = new GrassBlock();
tempGrassBlock.x = i*16;
tempGrassBlock.y = 256;
tempGrassBlock.name = "b"+blockCount;
world.addChild(tempGrassBlock);
tempGrassBlock.addEventListener(MouseEvent.CLICK, removeBlock);
function removeBlock(event:Event){
world.removeChild(getChildByName(event.target.name));
}
}
Thanks for the help.
Try this
function removeBlock(event:Event){
world.removeChild(event.currentTarget as DisplayObject);
}
No function definition should be inside a for. I changed that in your code and rewrited a little below:
var blockCount:Number = 0;
var blockArray:Array = [];
var world:MovieClip = new World();
world.x = 50;
world.y = 50;
world.name = "world";
addChild(world);
for(var i:Number=1;i<=100;i++){
blockCount++;
var tempGrassBlock:MovieClip = new GrassBlock();
tempGrassBlock.x = i*16;
tempGrassBlock.y = 256;
tempGrassBlock.name = "b"+blockCount;
world.addChild(tempGrassBlock);
tempGrassBlock.addEventListener(MouseEvent.CLICK, removeBlock);
}
function removeBlock(event:MouseEvent){
trace("Is click really working? This target name is " + event.currentTarget.name);
world.removeChild(event.currentTarget));
}

AS3 Set Combobox background color?

I have the following code which styles my comboBox drop down, but I can't seem to get a background color to work. I've used // comments to show which lines it doesn't like:
var myTextFormat:TextFormat = new TextFormat();
myTextFormat.font = "Arial";
myTextFormat.color = 0xFFFFFF;
myTextFormat.size = 10;
myTextFormat.background = true; // Doesn't like this line
myTextFormat.backgroundColor = 0xFFFFFF; // Doesn't like this line
var m = 0;
function comboBoxChange(e:Event):void {
var scriptVars:URLVariables = new URLVariables();
trace("YOU CHANGED ME!!!");
//scriptVars["InstructorName" + [m]] = myXML.Instructors.InstructorName[m];
trace(e.target.selectedItem.label);
//Change the comboBox color if Instructor selected
// Go back to plain if no Instructor
if (e.target.selectedIndex == 0){
trace("EMPTY");
e.target.transform.colorTransform = new ColorTransform;
}
else
{
// Shade of black indicates slot allocated to Instructor
my_color.color = 0x002222;
//e.target.transform.colorTransform = my_color;
e.target.parent.alpha = 1;
e.target.textField.setStyle ("textFormat",myTextFormat);
}
}
Maybe what you're looking for is the contentBackgroundColor style of ComboBox?
s|ComboBox {
contentBackgroundColor: red;
}
or
combo.setStyle('contentBackgroundColor', 'red');
This seemed to work:
e.target.textField.textField.background = true; e.target.textField.textField.backgroundColor = 0x000000;

TextField breaking MOUSE_OVER after moving it

I'm having a really weird problem with the MOUSE_OVER event. I'm building dynamic tabs representing mp3 songs containing textfields with info and a dynamic image for the cover art. I am trying to get a simple MOUSE_OVER working over the whole tab, such that you can select the next song to play.
I am using a Sprite with alpha 0 that overlays my whole tab (incl. the textFields) as a Listener for MOUSE_OVER and _OUT... I've checked by setting the alpha to something visible and it indeed covers my tab and follows it around as I move it (just making sure I'm not moving the tab without moving the hotspot). Also, I only create it once my cover art is loaded, ensuring that it will cover that too.
Now, when the tab is in the top position, everything is dandy. As soon as I move the tab to make space for the next tab, the textFields break my roll behaviour... just like that noob mistake of overlaying a sprite over the one that you're listening for MouseEvents on. But... the roll area is still on top of the field, I've set selectable and mouseEnabled to false on the textFields... nothing.
It is as if the mere fact of moving the whole tab now puts the textField on top of everything in my tab (whereas visually, it's still in its expected layer).
I'm using pixel fonts but tried it with system fonts, same thing... at my wits end here.
public function Tab(tune:Tune) {
_tune = tune;
mainSprite = new Sprite();
addChild(mainSprite);
drawBorder();
createFormat();
placeArtist();
placeTitle();
placeAlbum();
coverArt();
}
private function placeButton():void {
_button = new Sprite();
_button.graphics.beginFill(0xFF000,0);
_button.graphics.drawRect(0,0,229,40);
_button.graphics.endFill();
_button.addEventListener(MouseEvent.MOUSE_OVER, mouseListener);
_button.addEventListener(MouseEvent.MOUSE_OUT, mouseListener);
_button.buttonMode = true;
mainSprite.addChild(_button);
}
private function mouseListener(event:MouseEvent):void {
switch(event.type){
case MouseEvent.MOUSE_OVER :
hilite(true);
break;
case MouseEvent.MOUSE_OUT :
hilite(false);
break;
}
}
private function createFormat():void {
_format = new TextFormat();
_format.font = "FFF Neostandard";
_format.size = 8;
_format.color = 0xFFFFFF;
}
private function placeArtist():void {
var artist : TextField = new TextField();
artist.selectable = false;
artist.defaultTextFormat = _format;
artist.x = 41;
artist.y = 3;
artist.width = 135;
artist.text = _tune.artist;
artist.mouseEnabled = false;
mainSprite.addChild(artist);
}
private function placeTitle():void {
var title : TextField = new TextField();
title.selectable = false;
title.defaultTextFormat = _format;
title.x = 41;
title.y = 14;
title.width = 135;
title.text = _tune.title;
title.mouseEnabled = false;
mainSprite.addChild(title);
}
private function placeAlbum():void {
var album : TextField = new TextField();
album.selectable = false;
album.defaultTextFormat = _format;
album.x = 41;
album.y = 25;
album.width = 135;
album.text = _tune.album;
album.mouseEnabled = false;
mainSprite.addChild(album);
}
private function drawBorder():void {
_border = new Sprite();
_border.graphics.lineStyle(1, 0x545454);
_border.graphics.drawRect (0,0,229,40);
mainSprite.addChild(_border);
}
private function coverArt():void {
_image = new Sprite();
var imageLoader : Loader = new Loader();
_loaderInfo = imageLoader.contentLoaderInfo;
_loaderInfo.addEventListener(Event.COMPLETE, coverLoaded)
var image:URLRequest = new URLRequest(_tune.coverArt);
imageLoader.load(image);
_image.x = 1.5;
_image.y = 2;
_image.addChild(imageLoader);
}
private function coverLoaded(event:Event):void {
_loaderInfo.removeEventListener(Event.COMPLETE, coverLoaded);
var scaling : Number = IMAGE_SIZE / _image.width;
_image.scaleX = scaling;
_image.scaleY = scaling;
mainSprite.addChild (_image);
placeButton();
}
public function hilite(state:Boolean):void{
var col : ColorTransform = new ColorTransform();
if(state){
col.color = 0xFFFFFF;
} else {
col.color = 0x545454;
}
_border.transform.colorTransform = col;
}
Fixed it. What was happening was that I didn't set the height of the textfield. That was overshooting the tab and hence lying over the previously instantiated tab, blocking MouseOver... don't even ask.