2 Replies Latest reply on Mar 26, 2008 8:26 PM by Isaac Fung

    Customising the Alert popup

    Isaac Fung
      Hi Flexers

      The following works in changing some of the properties of the Alert

      <mx:Style>

      Alert {
      backgroundColor: yellow;
      color: blue;
      cornerRadius: 10;
      headerHeight: 30;
      shadowDistance: 5;
      highlightAlphas: 0,0;
      headerColors: white, red;
      fontSize: 13;
      fontFamily: Georgia;
      }

      </mx:Style>

      Please advise on the following:

      1) fontFamily: Comic Sans MS; didn't give me the font I expected. Does flex support this?
      2) the yellow background colour looks good but I couldn't get rid of the default greyish border. How can I turn the whole backgroud into the colour I want?
      3) Can I increase the margin between the button and the border? The default margin was too narrow.

      Looking forward to hear from you. I Fung
        • 1. Re: Customising the Alert popup
          chris.huston.t10 Level 3
          Try this:

          Alert {
          backgroundColor: yellow;
          color: blue;
          cornerRadius: 10;
          headerHeight: 30;
          shadowDistance: 5;
          highlightAlphas: 0,0;
          headerColors: white, red;
          fontSize: 13;
          fontFamily: Georgia;
          message-style-name:"messageStyle";
          border-thickness:0;
          padding-bottom:10;
          }

          .messageStyle {
          fontFamily:"Comic Sans MS";
          }

          The message-style-name allows you to set text properties for the message of your Alert. You can set the fontFamily, fontSize, color etc.

          The border-thickness set to 0 will remove the default grey border. Or you can set the border-color, to change the color to something that matches your yellow background.

          The padding-bottom property will increase the margin between the Alert butons and the bottom of the container. Likewise, padding-top will increase the margin above the Alert text.

          I hope this helps.

          Vygo
          • 2. Re: Customising the Alert popup
            Isaac Fung Level 1
            Hi Vygo, "border-thinkness" didn't work but "border-color: yellow;" done the job. The font thing was also working. Cheers Isaac.