Go Premium for a chance to win a PS4. Enter to Win

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 981
  • Last Modified:

Black Text Input needs opposite color highlight

I have an input box that has white text set within flash with a black box layered behind it.
Is there a way to modify the highlight and font color of the input text when selected with white bkgd/ black text  instead of the default black bkgd /white text?

I have show border unselected so I can show the black box from behind.
0
pixystk
Asked:
pixystk
  • 9
  • 8
  • 2
1 Solution
 
ChristoferDutzCommented:
0
 
dgofmanCommented:
I can suggest advanced solution.
You can get full control on your TextInput component by implementing custom skin.

For example this code will remove borders and background color

<mx:TextInput borderSkin="{null}" text="Hello"/>

By default TextInput borderSkin is "mx.skins.halo.HaloBorder"

You can create your custom class and extends from HaloBorder and override updateDisplayList(w:Number, h:Number):void function.
0
 
ChristoferDutzCommented:
Well I agree @dgofman but as far as I understood the question, the author doesn't use Flex but native Flash.
0
Industry Leaders: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 
pixystkAuthor Commented:
Yep, I'm strictly using flash/actionscript 3, so I'm still playing with the solution suggested first.
Unfortunately it doesn't look like there's an "easy" fix for this. This suggestion tho works for regular text and not necessarily input text.

Just for confirmation, I need to create a /com folder and inside it a /digitalflipbook folder then a /text folder and that will be where the .as file resides? Once it's actually there, do I need to modify the path within the .as file that references com.digitalflipbook.text and just call the class??

Thanks
0
 
dgofmanCommented:
Are you using ActionScript codding or TextInput from "Component" libraries?
0
 
pixystkAuthor Commented:
I'm not using components. I've added a textInput to the stage and gave it an instance name and I'm calling it in AS.
0
 
dgofmanCommented:
Last question, are you using Adobe Flash CS3/4 Professional or Eclipse ActionScript Project?
0
 
pixystkAuthor Commented:
Flash CS4 Pro
0
 
dgofmanCommented:
In this case you can use TextInput from fl library

import fl.controls.TextInput;

var textFmt:TextFormat = new TextFormat();
textFmt.color = 0xFFFFFF;
textFmt.font = "Arial"
textFmt.size = 12;

var myTextInput:TextInput = new TextInput();
myTextInput.text = "HELLO WORLD";
myTextInput.textField.background = true;
myTextInput.textField.backgroundColor = 0x000000;
myTextInput.setStyle("textFormat", textFmt);
myTextInput.move(10, 10);
addChild(myTextInput);
0
 
pixystkAuthor Commented:
I'm getting errors on fl.controls.TextInput

1172: Definition fl.controls:TextInput could not be found.

is there a library I need to update?
0
 
dgofmanCommented:
FL library by default exisits in your Flash Player project.
Click File->Publish Settings..
Click Flash Tab
Click on Settings... button
Pick "Library Path" tab
You should add line

$(AppConfig)/ActionScript 3.0/libs
0
 
pixystkAuthor Commented:
that's in there already... any other suggestions?
0
 
pixystkAuthor Commented:
ah!! I got it... I added a textInput component to the stage and deleted it so it's now in my library. Voila, no errors.

So would I then create an if statement that checks to see if the text is selected then change the backgroundcolor and text color???
0
 
dgofmanCommented:
Add Classpath manually point to

C:\Program Files (x86)\Adobe\Adobe Flash CS4\Common\Configuration\Component Source\ActionScript 3.0\User Interface
0
 
dgofmanCommented:
What do you mean?

So would I then create an if statement that checks to see if the text is selected then change the backgroundcolor and text color???
0
 
pixystkAuthor Commented:
Wow I really fooked my initial question. I was actually trying to ask this:
( i mistook highlight for selection color)

How do I get the background and text to change to it's opposite when you select the input text if it's on a black background.

( black bkgd w/ white text... selected is white bkgd with black text.)

Sorry for the confusion.

Moderators... please let me know if I should start over.
0
 
dgofmanCommented:
In this case you should invert colors

import fl.controls.TextInput;
import flash.geom.ColorTransform;

var color:Number = 0xFFFFFF;
var backgroundColor:Number = 0x000000;

var myTextInput:TextInput = new TextInput();
myTextInput.text = "HELLO WORLD";
myTextInput.textField.background = true; 
myTextInput.textField.backgroundColor = invert(backgroundColor);
myTextInput.move(10, 10);
addChild(myTextInput);

var colorTrans:ColorTransform = new ColorTransform();
colorTrans.color = color;
colorTrans.redMultiplier = -1;
colorTrans.greenMultiplier = -1;
colorTrans.blueMultiplier = -1;
myTextInput.textField.transform.colorTransform = colorTrans;

var textFmt:TextFormat = new TextFormat();
textFmt.color = invert(color);
textFmt.font = "Arial"
textFmt.size = 12;
myTextInput.setStyle("textFormat", textFmt);

function invert(color:uint):uint
{
	var colorTrans:ColorTransform = new ColorTransform();
	colorTrans.color = color;
	return invertColorTransform(colorTrans).color;
}

function invertColorTransform(colorTrans:ColorTransform):ColorTransform
{
	with(colorTrans)
	{
		redMultiplier = -redMultiplier;
		greenMultiplier = -greenMultiplier;
		blueMultiplier = -blueMultiplier;
		redOffset = 255 - redOffset;
		greenOffset = 255 - greenOffset;
		blueOffset = 255 - blueOffset;
	}
	
	return colorTrans;
}

Open in new window

0
 
pixystkAuthor Commented:
YES! Sorry it took so long to explain. I was thinking "highlight:" as in hightlighter pen.

Where is the button to give extra points for patience and understanding?!

Thanks so much!
0
 
dgofmanCommented:
I only can suggest to open a new ticket and give points to ChristoferDutz.
He first submitted an answer about ColorTransform / invert. :)
0

Featured Post

Free Tool: Port Scanner

Check which ports are open to the outside world. Helps make sure that your firewall rules are working as intended.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

  • 9
  • 8
  • 2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now