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;
Related
This is the code I have for creating a text box when clicking a button:
TextBoxButton.addEventListener(MouseEvent.CLICK, addTextBox);
function addTextBox(e:MouseEvent):void
{
myFont = new Font2();
typeText:TextField = new TextField();
typeText.defaultTextFormat = myFormat;
ttypeTextext.x = 540;
typeTexteText.width = 175;
ttypeTextText.type = TextFieldType.INPUT;
typeTexteText.text = "Your text here";
//Adding to the stage.
newLayer.addChild(typeableText);
}
My question is: how do I modify this code so that the user can drag and drop the text to wherever he/she wants on the stage using the mouse?
EDIT: Some further code:
TextBoxButton.addEventListener(MouseEvent.CLICK, addTextBox);
function addTextBox(e:MouseEvent):void
{
var myFont = new Font2();
var typeableText:TextField = new TextField();
typeableText.defaultTextFormat = myFormat;
typeableText.antiAliasType = AntiAliasType.ADVANCED;
typeableText.embedFonts = true;
typeableText.x = 540;
typeableText.y = 400;
typeableText.width = 175;
typeableText.height = 200;
typeableText.wordWrap = true;
typeableText.type = TextFieldType.INPUT;
typeableText.text = "Your text here";
interfaceLayer.buttonMode = true;
//Adding to the stage.
appLayer.addChild(typeableText);
if (typeableText.stage)
{
SideBarText.removeChild(TextBoxButton);
}
}
appLayer.addEventListener(MouseEvent.MOUSE_DOWN, dragText);
appLayer.addEventListener(MouseEvent.MOUSE_UP, stopDragText);
function dragText(e:MouseEvent):void
{
appLayer.startDrag();
}
function stopDragText(e:MouseEvent):void
{
appLayer.stopDrag();
}
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;
...
}
private var previousClick = null;
public static var floor1:Array = new Array();
floor1[0] = [2,1,1,1,1,1,2];
floor1[1] = [1,1,1,1,1,1,1];
floor1[2] = [1,1,1,2,1,1,1];
floor1[3] = [1,1,1,1,1,1,1];
floor1[4] = [1,1,1,2,1,1,1];
floor1[5] = [1,1,1,1,1,1,1];
floor1[6] = [2,1,1,1,1,1,2];
public function Main()
{
var tilew:int = 60;
var tileh:int = 60;
for (var i:int=0; i<floor1.length; i++)
{
for (var u:int=0; u<floor1[i].length; u++)
{
var cell:MovieClip = new Tile();
cell.gotoAndStop(floor1[i][u]);
cell.x = ((u-i)*tileh)+365;
cell.y = ((u+i)*tileh/2)+70;
addChild(cell);
cell.addEventListener(MouseEvent.CLICK, mouseclick);
}
}
function mouseclick(event:MouseEvent)
{
(event.currentTarget as Tile).outline.gotoAndStop("active");
event.currentTarget.cellSelected = true;
event.currentTarget.removeEventListener(MouseEvent.CLICK,mouseclick);
if (previousClick !== null){
(previousClick as Tile).outline.gotoAndStop(1);
event.currentTarget.cellSelected = false;
previousClick.addEventListener(MouseEvent.CLICK,mouseclick);
trace(previousClick);
}
previousClick = event.currentTarget;
previousClick.cellSelected = true;
}
So I have tiles called cells lined up to each other to make a floor. When you click a cell, the outline of that tile glows, indicating that it is currently selected. I have also created a boolean that checks if the current tile is selected. The problem is, the boolean is returning true to a tile that I clicked that isn't the currently selected one, especially the first tile I click when the game starts.
So my question is, how can I get a tile that I clicked that isnt currently selected to not equal true?
I think it caused by overlap.
you may try cell.y = ((u+i)*tileh)+70;
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;
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.