I’ve seen this come up a few times in various lists, and figured maybe somebody out there may find this useful.
The following example shows how you can prevent user input in a Flex application by setting the enabled property to false in the <mx:Application /> tag, or by setting the Application.application.enabled property.
Any suggestions? Leave them in the comments!
Full code after the jump.
<?xml version="1.0" encoding="utf-8"?>
<!-- http://blog.flexexamples.com/2008/02/20/disabling-user-input-in-a-flex-application/ -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
layout="vertical"
verticalAlign="middle"
backgroundColor="white">
<mx:Script>
<![CDATA[
private function disableApplication():void {
Application.application.enabled = false;
btn.enabled = false;
setTimeout(enableApplication, 3000);
}
private function enableApplication():void {
btn.enabled = true;
Application.application.enabled = true;
}
]]>
</mx:Script>
<mx:Array id="arr">
<mx:Object product="Flex" version="3" />
<mx:Object product="Flash" version="CS3" />
<mx:Object product="Dreamweaver" version="CS3" />
<mx:Object product="Fireworks" version="CS3" />
<mx:Object product="Photoshop" version="CS3" />
<mx:Object product="Illustrator" version="CS3" />
</mx:Array>
<mx:ApplicationControlBar dock="true">
<mx:Button id="btn"
label="Disable Application (3 seconds)"
emphasized="true"
click="disableApplication();" />
</mx:ApplicationControlBar>
<mx:DataGrid id="dataGrid" dataProvider="{arr}">
<mx:columns>
<mx:DataGridColumn dataField="product"
headerText="Product:" />
<mx:DataGridColumn dataField="version"
headerText="Version:" />
</mx:columns>
</mx:DataGrid>
</mx:Application>
View source is enabled in the following example.
{ 6 comments… read them below or add one }
Can the disabled state be styled?
That was my question too, can it be styled?
can the disabled application’s transparency be changed?
Sure,
You could do something like the following to set the disabled background color and alpha of the disabled state:
<mx:Style> Application { backgroundDisabledColor: black; disabledOverlayAlpha: 0.9; } </mx:Style>Peter
A fantastic site, and brilliant effort. A great piece of work.,
I’ve tried this, but it does not work if a popup is opened.
The background view is correctly disabled but the user can still interact with the popup.
Any solution for this?
Thanx ;)