Change Flex Default Grey Background Setting

The Adobe Flex Appllication background color setting defaults to a light grey(#869ca7). I wanted it to be white.

I initially tried to set the background color in the application tag in the mxml file which did not work.

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
 xmlns:views="views.*"
 xmlns:components="com.pfp.components.*"
 backgroundGradientColors="&#91;#ffffff,#ffffff&#93;"
 backgroundColor="#ffffff"
 initialize="onInitialize()"
 layout="absolute">

I then looked in the html file which was generated in the bin-debug directory and I found the generated default background color value(#869ca7). I then looked at the index.template.html file in the html-template folder which is used to generate the bin-debug version of the html generated file. The javascript code embedded in the html below gave me an inkling that it was being dynamically set but obviously not from the mxml file(which sort of makes sense since the html is generated when the flex swf is generated and does not know anything about the application background setting yet. When the application swf is loaded in the html, the background color has already been set).


AC_FL_RunContent(
		"src", "playerProductInstall",
		"FlashVars", "MMredirectURL="+MMredirectURL+'&MMplayerType='+MMPlayerType+'&MMdoctitle='+MMdoctitle+"",
		"width", "${width}",
		"height", "${height}",
		"align", "middle",
		"id", "${application}",
		"quality", "high",
		"bgcolor", "${bgcolor}",
		"name", "${application}",
		"allowScriptAccess","sameDomain",
		"type", "application/x-shockwave-flash",
		"pluginspage", "http://www.adobe.com/go/getflashplayer"
	);

I did a quick google and located the following link:

Editing Flex application settings

which clarified that a compiler setting had to be used to change the default background color.

The following steps change the background color of the generated flex content to white:

  • Right-click on your project folder to bring up the project menu. Select Properties.
  • Select Flex Compiler
  • In the Additional compiler arguments field append the following: -default-background-color #FFFFFF

Voila – you are done.

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: