I was helping a customer with an interesting question and it resulted in a nice little bit of code that I am demoing here.
The basic idea was to force the combobox to receive focus when it is moused over rather than when clicked. Also, it would be useful to have the combobox get focus only if the previously focused component was a particular component.
If you look at the docs:
http://livedocs.adobe.com/flex/3/langref/mx/managers/FocusManager.html
you will see that:
Each FocusManager instance is responsible for a set of components that comprise a “tab loop”. If you hit Tab enough times, focus traverses through a set of components and eventually get back to the first component that had focus. That is a “tab loop” and a FocusManager instance manages that loop.
You can use the focusManager.getFocus(); method to get the currently focussed item and you can also use focusManager. getNextFocusManagerComponent(backward:Boolean = false):IFocusManagerComponent to get you the next and previous items in the loop.
This movie requires Flash Player 9
The sample shows how to set the focus to the combobox when you hover over the combobox instead of setting focus only when you click on it(watch the blue focus ring), but only if the textInput whose id is “ti” first had focus. If the “ti2″ textinput had focus (or nothing had focus) before you hover over the combobox, then focus is not stolen.
Download a zipfile containing the source to this sample.
Browse the source of this example.
Or continue into the blog entry to see the source:
Read the rest of this post»
2 Comments »
I wrote a simple little extension to ComboBox to allow the dropdown to expand to the width of the widest entry and the ComboBox input to expand/contract to the width of the selected item. This is based on the simple ComboBox sample from the docs found here.
Here is the source code for the component:
< ?
xml version=
"1.0" encoding=
"utf-8"?>
<mx:combobox xmlns:mx=
"http://www.adobe.com/2006/mxml" creationComplete=
"init()" change=
"onChange(event);">
<mx:script>
< !
[CDATA
[
import mx.
controls.
ComboBase;
import mx.
core.
EdgeMetrics;
private function init
():
void{
this.
dropdownWidth=calculatePreferredSizeFromData
(this.
dataProvider.
length).
width;
}
private function onChange
(e:Event
):
void{
var txt:
String = itemToLabel
(selectedItem
);
if(measureText
(txt
).
width >
0){
var buttonWidth:
Number =
getStyle("arrowButtonWidth");
// Text fields have 4 pixels of white space added to each side
// by the player, so fudge this amount.
// If we don’t have any data, measure a single space char for defaults
var bm:EdgeMetrics = borderMetrics;
var textWidth:Number = measureText(txt).width + bm.left + bm.right + 8;
this.width = textWidth + buttonWidth;
}
else {
this.width=DEFAULT_MEASURED_MIN_WIDTH
}
}
]]>
</mx:script>
</mx:combobox>
Read the rest of this post»
No Comments »
I had a customer request some help in modifying the default Flex ComboBox behavior such that when the dropdown list was open and a user was scrolling the mousewheel with the mouse outside the dropdown list, the dropdown list would scroll. The default behavior is to close the dropdown list as soon as the user scrolls the mousewheel outside the dropdown list.
Read the rest of this post»
No Comments »
Recent Comments