Archive for February, 2010
Flex tip: Show hand cursor on TitleWindow close button
The Flex TitleWindow component is a great start for making dialog panels, because it has a close button in the title bar. By clicking the button this component automatically dispatches a CloseEvent. Nice, but… this button doesn’t show the hand cursor on roll over.
Personally I find it very annoying one has to set the buttonMode to true for each and every component. In some of the default Flex components this can be a real pain. Here’s how one can set the buttonMode for the close button of the TitleWindow component:
1 2 3 4 5 6 7 8 9 10 11 | <?xml version="1.0" encoding="utf-8"?> <mx:TitleWindow showCloseButton="true" creationComplete="init()" xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" width="400" height="100" title="My title window"> <mx:Script> <![CDATA[ private function init():void{ if(mx_internal::closeButton!=null) mx_internal::closeButton.buttonMode = true; } ]]> </mx:Script> </mx:TitleWindow> |
I’m using Flex 3.2, so it’s possible this no longer works in newer versions.
Flex tip: Alert improvements
Today, I started working on a new internet application in Flex… and I ran into some of the same annoying default Flex component behaviors I usually change or work around. These are small details, but the application will look so much more polished and professional when they are implemented.
Alert.show() for example creates an alert dialog, but the text inside the dialog is selectable and the buttons don’t show a hand cursor on rollover. One could argue that the alert message should be selectable so people can copy it. But personally I don’t like this behavior.
To make the text unselectable, you can do the following (I’m using Flex 3.2, so it’s possible this will no longer work in new versions):
1 2 | var a:Alert=Alert.show("This is an alert", "Alert", Alert.OK | Alert.CANCEL,this); a.mx_internal::alertForm.mx_internal::textField.selectable = false; |
And to show a hand cursor for the buttons, all one has to do is this:
1 | a.buttonMode=true; |
