textfield with preset label
Ab und an möchte man in Formularen Platz sparen und das label direkt in das inputfield schreiben. Wer sich nicht die komplette Mühe machen möchte, kann sich gern hier inspirieren lassen.
[code lang="as3"]
<?xml version="1.0" encoding="utf-8"?>
<!--
@author Christian Mueller
@date 9/02/2009
-->
<mx:TextInput xmlns:components="components.*" xmlns:mx="http://www.adobe.com/2006/mxml" text="{label}" focusIn="onFocusIn(event)" focusOut="onFocusOut(event)" styleName="LabelInactive">
<mx:Style>
.LabelInactive
{
color: #8B8B8B;
}
.LabelActive
{
color: #000000;
}
</mx:Style>
<mx:Script>
<![CDATA[
[Bindable]
public var label : String = "";
private function onFocusIn( event:FocusEvent ):void {
if ( super.text == label ) {
super.text = "";
styleName = "LabelActive";
}
}
private function onFocusOut( event:FocusEvent ):void {
if ( super.text == "" ) {
super.text = label;
styleName = "LabelInactive";
} else {
styleName = "LabelActive";
}
}
override public function set text(value:String):void {
if ( value == null ) {
value = "";
}
if ( value.split(" ").join("") != "" && value != label ) {
super.text = value;
styleName = "LabelActive";
} else {
super.text = label;
styleName = "LabelInactive";
}
}
[Bindable]
override public function get text():String {
if ( super.text == label ) {
return "";
}
return super.text;
}
]]>
</mx:Script>
</mx:TextInput>
[/code]