[flexcoders] Re: Keyboard navigating through List's item renderers

2008-08-04 Thread mydarkspoon
Hi Alex, sorry for the long delay...

The item renderer in fact implements the IFocusManagerComponent, 
however, there are other issues, 
consider an item renderer with 2 TextInputs, it should allow the user
to tab along the TexInputs with the Tab or the Shift+Tab key.

That would require these event handlers:
1.  The renderer itself 
By overriding the setFocus() function teh following behavior can be
achieved:
a. Tab - Pass the focus to its first TextInput, 
b. Shift+Tab - Another item renderer or the upper left component
should receive the focus as determined by the default screen order.

2.  The first input field
What's tricky here is that we only want to know when the focus is
about to be changed through keyboard interaction, not mouse, the
FocusEvent.KEY_FOCUS_CHANGE whose target is the the currently focused
InteractiveObject should be used.
So for the FocusEvent.KEY_FOCUS_CHANGE:
a. Tab - pass the focus to the next input field
b. Shift+Tab - behave like the renderer itself when focused using
shift tab (it should behave just like the renderer instead of passing
the focus to the renderer and let it handle the rest, because use the
same behavior instead of

3.  The 2nd input field
Here the FocusEvent.KEY_FOCUS_CHANGE is useful too because the focus
should move backward to the first input field when using Shift+Tab and
and the default behavior would handle Tab and pass the focus to the
next element


And this is the renderer code that tries (and somewhat fails) to
implement the above behavior:
http://paste.bradleygill.com/index.php?paste_id=2273

The main problem is the Shift+Tag when trying moving from renderer to
renderer, which is when the List hijacks the focus..:|
Another issue is undesirable behavior when using both mouse and keyboard.

I know noticed that there is a very similar thread going on here:
http://tech.groups.yahoo.com/group/flexcoders/message/121233

Also, I used the search but didn't find any solution yet.

Thanks again,
Almog Kurtser
http://www.mostlyflex.com

--- In flexcoders@yahoogroups.com, Alex Harui [EMAIL PROTECTED] wrote:

 You're headed in the right direction.  I think you have to implement
 IFocusManagerComponent on the renderer, and handle KEY_FOCUS_CHANGE.
 FWIW, I wouldn't use a Form since it is pretty heavy.
 
  
 
 
 
 From: flexcoders@yahoogroups.com [mailto:[EMAIL PROTECTED] On
 Behalf Of mydarkspoon
 Sent: Thursday, July 31, 2008 7:31 AM
 To: flexcoders@yahoogroups.com
 Subject: [flexcoders] Keyboard navigating through List's item renderers
 
  
 
 Hi,
 I have a list that renders meta data about images (title  tags).
 This list uses a Form with 2 TextInput controls as an item renderer.
 
 The user should be able to navigate through the input fields using
 either the mouse or the tab key.
 
 The List default behavior when editable=true is to set the focus to
 the renderers themselves, but not to their sub components, so the Form
 itself will have a focus rectangle but not the TextInput controls.
 
 What I tried to do is to override the setFocus() on the Form
 subcomponent and move the focus to the first TextInput and on that
 TextInput focusOut set its focus to the 2nd TextInput.
 That didn't work as expected, and even if it did, I'm sure the is a
 better way to achieve this behavior.
 
 Thank you,
 Almog Kurtser
 http://www.mostlyflex.com http://www.mostlyflex.com





RE: [flexcoders] Re: Keyboard navigating through List's item renderers

2008-08-04 Thread Alex Harui
I posted a quick example of trying to get something like this working in
a DataGrid.
 
http://blogs.adobe.com/aharui/2008/08/datagrid_itemeditor_with_two_i.htm
l



From: flexcoders@yahoogroups.com [mailto:[EMAIL PROTECTED] On
Behalf Of mydarkspoon
Sent: Monday, August 04, 2008 4:04 AM
To: flexcoders@yahoogroups.com
Subject: [flexcoders] Re: Keyboard navigating through List's item
renderers



Hi Alex, sorry for the long delay...

The item renderer in fact implements the IFocusManagerComponent, 
however, there are other issues, 
consider an item renderer with 2 TextInputs, it should allow the user
to tab along the TexInputs with the Tab or the Shift+Tab key.

That would require these event handlers:
1. The renderer itself 
By overriding the setFocus() function teh following behavior can be
achieved:
a. Tab - Pass the focus to its first TextInput, 
b. Shift+Tab - Another item renderer or the upper left component
should receive the focus as determined by the default screen order.

2. The first input field
What's tricky here is that we only want to know when the focus is
about to be changed through keyboard interaction, not mouse, the
FocusEvent.KEY_FOCUS_CHANGE whose target is the the currently focused
InteractiveObject should be used.
So for the FocusEvent.KEY_FOCUS_CHANGE:
a. Tab - pass the focus to the next input field
b. Shift+Tab - behave like the renderer itself when focused using
shift tab (it should behave just like the renderer instead of passing
the focus to the renderer and let it handle the rest, because use the
same behavior instead of

3. The 2nd input field
Here the FocusEvent.KEY_FOCUS_CHANGE is useful too because the focus
should move backward to the first input field when using Shift+Tab and
and the default behavior would handle Tab and pass the focus to the
next element


And this is the renderer code that tries (and somewhat fails) to
implement the above behavior:
http://paste.bradleygill.com/index.php?paste_id=2273
http://paste.bradleygill.com/index.php?paste_id=2273 

The main problem is the Shift+Tag when trying moving from renderer to
renderer, which is when the List hijacks the focus..:|
Another issue is undesirable behavior when using both mouse and
keyboard.

I know noticed that there is a very similar thread going on here:
http://tech.groups.yahoo.com/group/flexcoders/message/121233
http://tech.groups.yahoo.com/group/flexcoders/message/121233 

Also, I used the search but didn't find any solution yet.

Thanks again,
Almog Kurtser
http://www.mostlyflex.com http://www.mostlyflex.com 

--- In flexcoders@yahoogroups.com mailto:flexcoders%40yahoogroups.com
, Alex Harui [EMAIL PROTECTED] wrote:

 You're headed in the right direction. I think you have to implement
 IFocusManagerComponent on the renderer, and handle KEY_FOCUS_CHANGE.
 FWIW, I wouldn't use a Form since it is pretty heavy.
 
 
 
 
 
 From: flexcoders@yahoogroups.com mailto:flexcoders%40yahoogroups.com
[mailto:flexcoders@yahoogroups.com mailto:flexcoders%40yahoogroups.com
] On
 Behalf Of mydarkspoon
 Sent: Thursday, July 31, 2008 7:31 AM
 To: flexcoders@yahoogroups.com mailto:flexcoders%40yahoogroups.com 
 Subject: [flexcoders] Keyboard navigating through List's item
renderers
 
 
 
 Hi,
 I have a list that renders meta data about images (title  tags).
 This list uses a Form with 2 TextInput controls as an item renderer.
 
 The user should be able to navigate through the input fields using
 either the mouse or the tab key.
 
 The List default behavior when editable=true is to set the focus to
 the renderers themselves, but not to their sub components, so the Form
 itself will have a focus rectangle but not the TextInput controls.
 
 What I tried to do is to override the setFocus() on the Form
 subcomponent and move the focus to the first TextInput and on that
 TextInput focusOut set its focus to the 2nd TextInput.
 That didn't work as expected, and even if it did, I'm sure the is a
 better way to achieve this behavior.
 
 Thank you,
 Almog Kurtser
 http://www.mostlyflex.com http://www.mostlyflex.com
http://www.mostlyflex.com http://www.mostlyflex.com