beta
Click here to ask Question Now
Its free No registration required. Flash, Flex, Flash
Media Server, ActionScript,Adobe Air. Most questions receive a response in an hour.
Answered
5/12/2010 11:59:00 PM
Title: Itemrenderer's TextInput/TextArea focus problem on keyboard "Tab" key
Hello Members,
I am using TileList with custom itemrenderer. Custom itemrenderer creates form controls according to available items in Array Collection.
I am facing problem in textinput / textarea focus on keyboard "Tab" key.
Is there any way to get focus on next fields through keyboard "Tab" key?
Here is sample code of my example -
/* test.mxml */
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" initialize="init()" layout="vertical">
<mx:Script>
<![CDATA[
import myItemRenderer;
private var tempSelArray:Array=[
{label: "I am CommonText", inputType:"CommonText"}, {label: "I am InputText 01", inputType:"CommonText"},
{label: "I am TextArea 01", inputType:"AreaText"}, {label: "I am InputText 02", inputType:"CommonText"},
{label: "I am TextArea 02", inputType:"AreaText"}, {label: "I am TextArea 03", inputType:"AreaText"},
{label: "I am InputText 03", inputType:"CommonText"},{label: "I am InputText 04", inputType:"CommonText"}
];
private function init():void{
addedFields.dataProvider = tempSelArray;
addedFields.itemRenderer = new ClassFactory(myItemRenderer);
}
]]>
</mx:Script>
<mx:VBox width="100%" height="100%" >
<mx:TileList id="addedFields" height="400" verticalScrollPolicy="off"
rollOverColor="0xffffff" selectionColor="0xffffff"
columnCount="1" columnWidth="{this.width-100}" rowHeight="50" width="100%" />
</mx:VBox>
</mx:Application>
/* myItemRenderer.mxml */
<?xml version="1.0" encoding="utf-8"?>
<mx:Canvas xmlns:mx="http://www.adobe.com/2006/mxml" implements="mx.managers.IFocusManagerComponent" width="100%">
<mx:Script>
<![CDATA[
import mx.containers.HBox;
import mx.controls.Label;
import mx.controls.TextArea;
import mx.controls.TextInput;
private var textField:TextInput = new TextInput();
private var textArea:TextArea = new TextArea();
private var textLabel:Label = new Label();
private var hb:HBox = new HBox();
override public function set data(value:Object):void
{
if(value != null)
{
super.data = value;
textLabel.setStyle("color","0x000000");
textField.setStyle("color","0x000000");
textArea.setStyle("color","0x000000");
switch(data.inputType){
case("CommonText"):{
textLabel.text = data.label + " :";
// Create inputtextField and add to this
hb.addChild(textLabel);
hb.addChild(textField);
this.addChild(hb);
}
break;
case("AreaText"):{
textLabel.text = data.label + " :";
// Create inputtextArea and add to this
hb.addChild(textLabel);
hb.addChild(textArea);
this.addChild(hb);
}
break;
}
}
}
]]>
</mx:Script>
</mx:Canvas>
1
2
yes I have tried with tabIndex property but it wont works :(
3
4
Hi , Nilesh I am trying to fix it, Will get back to you as soon as get some positive result
5
Accepted Answer
fixed it
to enable tabbing in the textfields inside your TileList component in flex. Set the property tabChildren="true" in mxml and extend the TileList component and use that component.
//MyTileList.as class extending the TileList compoenent, this class will enable tabEnabled property for children depending upon what you set in MXML.
to enable tabbing in the textfields inside your TileList component in flex. Set the property tabChildren="true" in mxml and extend the TileList component and use that component.
//MyTileList.as class extending the TileList compoenent, this class will enable tabEnabled property for children depending upon what you set in MXML.
package
{
import mx.controls.TileList;
public class MyTileList extends TileList
{
override protected function createChildren():void {
super.createChildren();
this.listContent.tabChildren = this.tabChildren
this.listContent.tabEnabled = this.tabEnabled
}
}
}
6
great, Thanks a lot Inder for your help!! :-) AskMeFlash Rockssssss
7
I would say on your reply..... It's "Simply Amazing" doesn't have any other words!!
- Nilesh
- Nilesh
8
9
Hi...
I am getting error for the same code on the following lines:
this.listContent.tabChildren = this.tabChildren
this.listContent.tabEnabled = this.tabEnabled
I am extending List....
Also I am using flex 4....I think these are the differences.
Any solution???
I am getting error for the same code on the following lines:
this.listContent.tabChildren = this.tabChildren
this.listContent.tabEnabled = this.tabEnabled
I am extending List....
Also I am using flex 4....I think these are the differences.
Any solution???
10
Accepted Answer
use
hasFocusableChildren= true for spark List component in List tag .
hasFocusableChildren= true for spark List component in List tag .
11
great work Inder.
hasFocusableChildren= true helped me a lot.
hasFocusableChildren= true helped me a lot.
12
Hi,
I need your help.
I want to enable tab functionality in my item renderer.
My requirement is different. My item renderer extends UIComponent and create the textInput in create child.
I tried the above method for enabling the tab functionality, but it does not work.
Please help
I need your help.
I want to enable tab functionality in my item renderer.
My requirement is different. My item renderer extends UIComponent and create the textInput in create child.
I tried the above method for enabling the tab functionality, but it does not work.
Please help
13
I extended TileList and have overridden the createChildren method. My renderer is a VBOX with 4 textInputs. Focus works but gives an error each time I tab
TypeError: Error #1034: Type Coercion failed: cannot convert mx.controls.listClasses::ListBaseContentHolder@3f205c1 to mx.managers.IFocusManagerComponent.
at mx.managers::FocusManager/sortFocusableObjectsTabIndex()[E:\dev\3.0.x\frameworks\projects\framework\src\mx\managers\FocusManager.as:646]
at mx.managers::FocusManager/sortFocusableObjects()[E:\dev\3.0.x\frameworks\projects\framework\src\mx\managers\FocusManager.as:729]
at mx.managers::FocusManager/keyDownHandler()[E:\dev\3.0.x\frameworks\projects\framework\src\mx\managers\FocusManager.as:1296]
TypeError: Error #1034: Type Coercion failed: cannot convert mx.controls.listClasses::ListBaseContentHolder@3f205c1 to mx.managers.IFocusManagerComponent.
at mx.managers::FocusManager/sortFocusableObjectsTabIndex()[E:\dev\3.0.x\frameworks\projects\framework\src\mx\managers\FocusManager.as:646]
at mx.managers::FocusManager/sortFocusableObjects()[E:\dev\3.0.x\frameworks\projects\framework\src\mx\managers\FocusManager.as:729]
at mx.managers::FocusManager/keyDownHandler()[E:\dev\3.0.x\frameworks\projects\framework\src\mx\managers\FocusManager.as:1296]
14
15
Post your Reply