Determining if a Flex application has focus using the activate and deactivate events
The following example shows how you can determine if a Flex application has focus or not by listening for the activate and deactivate events on the <mx:Application /> container.
Full code after the jump.
<?xml version="1.0" encoding="utf-8"?>
<!-- http://blog.flexexamples.com/2008/02/29/determining-if-a-flex-application-has-focus-using-the-activate-and-deactivate-events/ -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
layout="vertical"
verticalAlign="middle"
backgroundColor="white"
activate="application_activate(event);"
deactivate="application_activate(event);">
<mx:Script>
<![CDATA[
import mx.controls.dataGridClasses.DataGridColumn;
private function application_activate(evt:Event):void {
arrColl.addItemAt({type:evt.type, time:getTimer()}, 0);
}
private function time_labelFunc(item:Object, col:DataGridColumn):String {
return numberFormatter.format(item[col.dataField]);
}
]]>
</mx:Script>
<mx:ArrayCollection id="arrColl" />
<mx:NumberFormatter id="numberFormatter"
useThousandsSeparator="true" />
<mx:DataGrid id="dataGrid"
dataProvider="{arrColl}"
width="320"
rowCount="8"
verticalScrollPolicy="on">
<mx:columns>
<mx:DataGridColumn dataField="type" />
<mx:DataGridColumn dataField="time"
headerText="time (ms)"
labelFunction="time_labelFunc" />
</mx:columns>
</mx:DataGrid>
</mx:Application>
View source is enabled in the following example.
To test the previous example, try clicking within the Flex application and then click on the surrounding HTML, you should see the “activate” and “deactivate” events get dispatched and create new items in the DataGrid control.
Peter deHaan
Peter deHaan currently works for Adobe on the Flex SDK QA team. While not working on Flex, Flash, and ColdFusion applications, Peter enjoys making up bios and writing in 3rd person. Peter's rarely updated blog can be found at blogs.adobe.com/pdehaan/, actionscriptexamples.com, airexamples.com, and coldfusionexamples.com.
-
Add Widgets (Content Sidebar)
This is your Content Sidebar. Edit this content that appears here in the widgets panel by adding or removing widgets in the Content Sidebar area.
10 Responses to Determining if a Flex application has focus using the activate and deactivate events
Leave a Reply Cancel reply
-
Categories
- Accordion
- AccordionHeader
- ActionScript
- AddChild
- AdvancedDataGrid
- Alert
- alpha
- Animate
- AnimateProperties
- Application
- Application (Spark)
- ArrayCollection
- BarChart
- baseColor
- beta
- beta1
- beta2
- Bitmap
- Bitmap/BitmapData
- BitmapData
- BitmapFill
- BitmapFill (Spark)
- BitmapGraphic
- BitmapImage
- BitmapImage (Spark)
- BitmapImageResizeMode
- Border (Spark)
- BorderContainer (Spark)
- Box
- BuildInfo
- Button
- Button (Spark)
- ButtonBar
- ButtonBar (Spark)
- ByteArray
- Camera
- Charting
- CheckBox
- CheckBox (Spark)
- ClassFactory
- CollectionEvent
- Color
- ColorPicker
- ColorUtil
- ComboBox
- ComboBoxArrowSkin
- Compiler
- Component
- Component (Spark)
- Configuration
- Container
- ContextMenu
- ContextMenuEvent
- ContextMenuItem
- CSSCondition
- CSSSelector
- CSSStyleDeclaration
- CurrencyFormatter
- CursorManager
- Data Binding
- DataGrid
- DataGrid (Spark)
- DataGridColumn
- Date
- DateBase
- DateChooser
- DateField
- DateFormatter
- Debugging
- DefaultComplexItemRenderer
- DefaultTileListEffect
- DropDownList
- DropDownList (Spark)
- DropDownListButtonSkin
- DropDownListSkin
- DropShadowFilter
- E4X
- Effects
- Ellipse
- EmailValidator
- Embed
- Event
- Fade
- FileFilter
- FileReference
- fill
- Filters
- Flash
- Flash Integration
- FlashVars
- Flex 3 SDK
- Flex Builder
- Flex Builder 3
- Flex SDK
- Flex4
- FLVPlayback
- FocusManager
- FontLookup
- Fonts
- Form
- Form (Spark)
- FormHeading (Spark)
- FormItem
- FormItem (Spark)
- Forms
- FTETextField (Spark)
- FullScreen
- FullScreenEvent
- FxAnimateColor
- FxButtonBar
- FxCheckBox
- FXG
- FxHScrollBar
- FxHSlider
- FxList
- FxNumericStepper
- FxRadioButton
- FxRotate3D
- FxScroller
- FxTextArea
- FxTextInput
- FxToggleButton
- FxVScrollBar
- FxVSlider
- getStyleDeclaration()
- GradientEntry
- Graphic (Spark)
- HBox
- HDividedBox
- HGroup (Spark)
- HorizontalLayout
- HorizontalList
- HSBColor (Spark)
- HScrollBar (Spark)
- HSlider
- HSlider (Spark)
- HTML template
- ID3Info
- Image
- Image (Spark)
- ImageSnapshot
- itemRenderer
- JointStyle
- Label
- Label (Spark)
- Legend
- LegendItem
- LigatureLevel
- Line
- LinearGradientStroke
- LineScaleMode
- LinkBar
- LinkButton
- List
- List (Spark)
- Menu
- MenuBar
- Metadata
- MetadataEvent
- Model
- Mouse
- MouseCursor
- MouseEvent
- Move
- Namespace
- NavigatorContent (Spark)
- needsSWF
- NetConnection
- NetStream
- Nightly Builds
- NumberBaseRoundType
- NumberFormatter
- NumberValidator
- NumericCompare
- NumericStepper
- NumericStepper (Spark)
- ObjectProxy
- ObjectUtil
- paddingLeft
- paddingRight
- Panel
- Panel (Spark)
- Parallel
- Path
- PieChart
- PieSeries
- PieSeriesItem
- PopUpAnchor (Spark)
- PopUpButton
- PopUpManager
- ProgrammaticSkin
- ProgressBar
- PropertyChangeEvent
- QName
- RadialGradient
- RadioButton
- RadioButton (Spark)
- RadioButtonGroup
- RadioButtonGroup (Spark)
- Rect
- RegExp
- Regular Expressions
- Repeater
- RichEditableText
- RichText
- RichText (Spark)
- RichTextEditor
- Rotate
- Rotate3D (Spark)
- Scroller (Spark)
- Sequence
- setStyle()
- SimpleText
- SimpleText (Spark)
- skinClass
- Slider
- SliderEvent
- SolidColor
- SolidColorStroke
- Sort
- SortField
- Sound
- SoundEffect
- Spinner (Spark)
- SpriteVisualElement (Spark)
- StageDisplayState
- States
- StringUtil
- StringValidator
- StyleManager
- Styles
- SWFLoader
- SWFObject
- System
- SystemManager
- TabBar
- TabBar (Spark)
- TabNavigator
- TabStopFormat
- Text
- Text Layout Framework (TLF)
- TextArea
- TextArea (Spark)
- TextBox
- TextConverter
- TextEvent
- TextFlow
- TextFlowUtil
- TextFormat
- TextGraphic
- TextInput
- TextInput (Spark)
- TextLayoutFormat
- TextView
- Themes
- TileLayout
- TileList
- TileOrientation
- Timer
- TitleWindow
- TitleWindow (Spark)
- TLF
- ToggleButton (Spark)
- ToggleButtonBar
- ToolTip
- Transition
- Tree
- TruncationOptions
- UIComponent
- UIFTETextField
- Updater
- URLLoader
- URLRequest
- URLUtil
- URLVariables
- ValidationResultEvent
- Validator
- Validators
- VBox
- VDividedBox
- Vector
- VerticalLayout
- VerticalLayout (Spark)
- VGroup (Spark)
- Video
- VideoDisplay
- VideoElement
- VideoElement (Spark)
- VideoEvent
- VideoPlayer (Spark)
- VideoPlayerScrubBar
- ViewStack
- VScrollBar (Spark)
- VSlider
- VSlider (Spark)
- XML
- XMLList
- XMLListCollection
- ZipCodeValidator
- ZipCodeValidatorDomainType
- Zoom
-
Articles
- December 2010
- November 2010
- October 2010
- September 2010
- August 2010
- July 2010
- June 2010
- May 2010
- April 2010
- March 2010
- February 2010
- January 2010
- December 2009
- November 2009
- October 2009
- September 2009
- August 2009
- July 2009
- June 2009
- May 2009
- April 2009
- March 2009
- February 2009
- January 2009
- December 2008
- November 2008
- October 2008
- September 2008
- August 2008
- July 2008
- June 2008
- May 2008
- April 2008
- March 2008
- February 2008
- January 2008
- December 2007
- November 2007
- October 2007
- September 2007
- August 2007
- July 2007
-
Meta


This doesn’t work in safari 3 on a mac the way it’s supposed to. The browser doesn’t know when the OS regains focus. It works on Firefox on a mac though. So if you are going to have an important feature in your app. using this feature beware.
Glendon,
It seems to work on my Mac with the latest Safari.
What version of Flash Player are you using in Safari? http://blog.flexexamples.com/about-you/
Peter
Peter,
thanks for the previous reply.
I’ve tried the “about-you” and noticed the “hasScreenBroadcast”. (mine is set to false)
What is that? Can I broadcast my screen like using FMS without instaling a third-party program?
And I have an application that uses languages in an external .xml file.
How can I detect autmaticaly the language (like you did in the about-you) and load the respective .xml language file. (Now the users have to choose in each login using a ComboBox).
I think it would be something like: if language is pt, we load the portugues.xml and so on…
Thank you very much for your attention and this blog that I read every day,
Gustavo
Gustavo,
My
Capabilities.hasScreenBroadcastproperty is false also. According to the documentation (link), thehasScreenBroadcastproperty:As for the languages, the code in the About You page just uses the
Capabilities.languageproperty (which returns “en” on my system).I imagine it should be pretty easy to use a switch statement on the
Capabilities.languageproperty and load the appropriate language XML file (just make sure you set up a default block in case a user is using a language you don’t have an XML file for. For more information on the language property, see http://livedocs.adobe.com/flex/3/langref/flash/system/Capabilities.html#language.Peter
Thank you very very much.
I’m new to computer programming as my focus is design.
Thanks to you now I know how I can probably set the languages automatically.
The screen broadcast is very important to me.
Do you know how this can be set to true? (because I don’t want to install a program just to simulate a camera that broadcasts my screen).
And if it’s not asking too much: what would be the approach for using this with FMS.
You can forget about this one if you don’t know :)
Thanks again and hope helping you one day,
Gustavo
Great test. Do you know of any way to force the flex app to “activate” (so that this event will be fired and keyboard focus enabled) without the user having to click on the application?
looking for the same
Thanks, this seems to work great for me except for one case: in Internet Explorer 7, while in application, when pressing an ‘ALT’ button, the application seems to loose focus (the browser goes to its menu: File, Edit, View, etc.), but the Event.DEACTIVATE doesn’t fire, even though the application doesn’t respond to mouse events anymore.
Do you know of any solution that can solve this?
Hello,
Nice example, but it just doesn’t work anymore is Flex 3…
No response from activate and deactivate in the application header.
Upgraded flash yesterday and DEACTIVATE doesn’t work anymore in the same browser.
Guess what happends when you try to make a website,
You design it to work in 5 main browsers each having at least 5 versions. So thats at least 25 versions of your website.
Now guess what happends when you try to put flash into your website. Flash functionality breaks from one subversion to another.
So if we only think about flash player 9 and 10, each having like 10 subversions … thats like 2 * 10 * 25.
I know i exagerate when i say 500 versions (quirks) of your website because it means your flash movie would need all the functionality of as3. But still .. if from 20 subversions you would have 3 functions affected .. that will triple your problems. Thank you adobe for making a developers life more easy with your “displayed the same in all browsers” super feature.