MXML Vs Action Script

MXML vs ActionScript 3.0 Flex components can be added to an application using MXML or ActionScript 3.0. Both code examples below display the same results.

MXML Components are implicitly initialized when the user runs the application. The Application class is a container Components are added to an application as children objects. MXML is compiled to ActionScript 3.0 <?xml version="1.0" encoding="utf-8"?> <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" backgroundColor="#FFFFFF" backgroundAlpha="0"> <mx:Image source="assets/animals03.jpg" /> <mx:Label text="Photography" /> </mx:Application> ActionScript 3.0 Components are created and added to the display though an explicit call to the addControls() function when the user runs the application. You need to add an initialize listener to the application object to call the function that adds the components (initialize="addControls()"). You need to explicitly attach the components to application object (this.addChild(photo)) <?xml version="1.0" encoding="utf-8"?> <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" backgroundColor="#FFFFFF" backgroundAlpha="0" initialize="addControls()"> <mx:Script> <![CDATA[ import mx.controls.Image; import mx.controls.Label; private function addControls():void { createImage(); createPhotographer(); } private function createImage():void { var photo:Image = new Image(); photo.source = "assets/animals03.jpg"; this.addChild(photo); } private function createPhotographer():void { var photographer:Label = new Label(); photographer.text = "Photography"; this.addChild(photographer); } ]]> </mx:Script> </mx:Application>    Rendered Samples Both applications render the same even though one adds components using MXML and the other using ActionScript 3.0 code. MXML   ActionScript 3.0