how to specify height and width of flex alert box in css? - apache-flex

Question

In my Flex 4 app I would like all my alert boxes to be a specific width and height, how do I specify that in the CSS? I want to avoid having to specify the width and height every time I want to show an alert, that's why I'd like to set it in the CSS, but does not look like there's a way to..
Something like this does not work:
mx|Alert
{
height: 100;
width: 300;
}

Answer 1

You can do it Using Style + Code like this
Define Style Properties as
Alert {
height:300;
weight:300;
}
Note: height and weight are not default style of Alert
Using them in Code as
var alert:Alert = Alert.show("Hello World");
alert.explicitHeight = Number(alert.getStyle("height"));
alert.explicitWidth = Number(alert.getStyle("weight"));
Working example of Flex3 is
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute"
creationComplete="{show()}">
<mx:Style>
Alert {
height:300;
weight:300;
}
</mx:Style>
<mx:Script>
<![CDATA[
import mx.controls.Alert;
private function show():void
{
var alert:Alert = Alert.show("Hello World");
alert.explicitHeight = Number(alert.getStyle("height"));
alert.explicitWidth = Number(alert.getStyle("weight"));
}
]]>
</mx:Script>
</mx:Application>
Explanation
Since Alert Control by default not support height and weight style, so example used them just for holding user defined values as variable.
In routine to display Alert/Popup on screen Static method show of class Alert is used, which returns the instance/object of created/active Alert/Popup, using this refrence its properties can be manipulated at runtime as done in above example i.e. explicitHeight and explicitWidth.
Hopes that Help

Answer 2

CSS can only be used to set Style properties of components. There are no dimension based style properties for the mx:Alert as you can see here - although there is one to adjust the height of the header named 'headerHeight'.
You could try extending the mx:Alert class and giving it new style properties that would allow you to change the dimensions via CSS. Or you could extend the class and give it default dimensions in its constructor.

Answer 3

You can't do it out of the box, but you could do it by extending your Alert and adding your own logic in the updateDisplayList to check for the style and change the property appropriately.
Generally not recommended however. Just use the properties given to you instead.