In order to have a clean main application file in Flex 4 we can define a custom application skin and remove contentGroup from it. This way there is no way to add any mxml elements inside of the main application file. Even if you do, they wont show up. Main application file in this way has only the script block and maybe metadata and other similar blocks if you declare them. At the end you will have almost perfectly clean main application file. Here is the example.
// Application File.
<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx"
skinClass="com.gnstudio.skins.MyApplicationSkin"
preinitialize="onPreinitialize(event)"
minWidth="700" minHeight="440">
<fx:Metadata>
[ResourceBundle("IB_Main")]
</fx:Metadata>
<fx:Style source="../css/main.css"/>
<fx:Style source="../css/fonts.css"/>
<fx:Script>
<![CDATA[
private function onPreinitialize(event:FlexEvent):void {
// Initialize your application here.
}
private function myMethod():void {
// My method stup. All components are in MyApplicationSkin.
}
]]>
</fx:Script>
</s:Application>
// Application Skin.
<?xml version="1.0" encoding="utf-8"?>
<s:Skin xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:fb="http://ns.adobe.com/flashbuilder/2009"
alpha.disabled="0.5">
<fx:Metadata>[HostComponent("MyApplication")]</fx:Metadata>
<s:states>
<s:State name="normal"/>
<s:State name="disabled"/>
</s:states>
<!-- application background -->
<s:Rect left="0" right="0" top="0" bottom="0">
<s:fill>
<s:SolidColor color="#FFFFFF"/>
</s:fill>
</s:Rect>
<s:Group left="0" right="0" top="0" bottom="0">
<my:Component1 id="component1"/>
<my:Component2 id="component2"/>
</s:Group>
</s:Skin>