Flex Icons for Alert

The example uses the mx_internal namespace to access a couple of internal properties (descriptions taken from the documented source code):

alertForm — The internal AlertForm object that contains the text, icon, and buttons of the Alert control.
buttons — An Array that contains any Buttons appearing in the Alert control.

Since this example uses the mx_internal namespace, you can’t always depend on this behavior to work in future versions of the Flex SDK. Use at your own risk.


<?xml version="1.0" encoding="utf-8"?>

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"

layout="vertical"
verticalAlign="middle"
creationComplete="showAlert();"
backgroundColor="white" >

<mx:Script>
<![CDATA[

import mx.controls.Alert;
import mx.events.CloseEvent;

[Bindable]
[Embed(source='assets/error.png')]
private var Icon:Class;

[Bindable]

[Embed(source='assets/tick.png')]
private var TickIcon:Class;

[Bindable]
[Embed(source='assets/cross.png')]
private var CrossIcon:Class;


private var a:Alert;

private function showAlert():void {
/* Set button width so it is large enough to accomodate
an icon and default button labels. */

Alert.buttonWidth = 100;

var titleText:String = "WARNING";
var messageText:String = "Are you sure you would like to erase the Internet?\\n\\nPress OK to continue, or Cancel to abort.";

/* Display the Alert, show the OK and Cancel buttons,
and show an icon represented by the Icon binding. */
a = Alert.show(messageText, titleText, Alert.OK | Alert.CANCEL, null, doClose, Icon);


/* Get a reference to the Alert control's internal
buttons array. */
var buttonArray:Array = a.mx_internal::alertForm.mx_internal::buttons;

/* Set the first button to the TickIcon class, and the

second icon to the CrossIcon class. */
buttonArray[0].setStyle("icon", TickIcon);
buttonArray[1].setStyle("icon", CrossIcon);

progressBar.visible = false;

}

private function doClose(evt:CloseEvent):void {
if (evt.detail == Alert.OK) {
progressBar.visible = true;
} else if (evt.detail == Alert.CANCEL) {

// do nothing.
}
}
]]>
</mx:Script>

<mx:Button label="Launch Alert"
click="showAlert();" />


<mx:ProgressBar id="progressBar"
label="Deleting..."
indeterminate="true"
visible="false" />

</mx:Application>