Unit-IV
description
Transcript of Unit-IV
![Page 1: Unit-IV](https://reader036.fdocuments.us/reader036/viewer/2022070412/56814931550346895db673a5/html5/thumbnails/1.jpg)
Unit-IV
- Flash Player - Flex framework
- MXML introduction - Action script introduction
- Working with Action script - Flex data binding
- Common UI components using Data grids - Tree controls
- Pop-up controls
Building RIA
![Page 2: Unit-IV](https://reader036.fdocuments.us/reader036/viewer/2022070412/56814931550346895db673a5/html5/thumbnails/2.jpg)
![Page 3: Unit-IV](https://reader036.fdocuments.us/reader036/viewer/2022070412/56814931550346895db673a5/html5/thumbnails/3.jpg)
![Page 4: Unit-IV](https://reader036.fdocuments.us/reader036/viewer/2022070412/56814931550346895db673a5/html5/thumbnails/4.jpg)
![Page 5: Unit-IV](https://reader036.fdocuments.us/reader036/viewer/2022070412/56814931550346895db673a5/html5/thumbnails/5.jpg)
![Page 6: Unit-IV](https://reader036.fdocuments.us/reader036/viewer/2022070412/56814931550346895db673a5/html5/thumbnails/6.jpg)
![Page 7: Unit-IV](https://reader036.fdocuments.us/reader036/viewer/2022070412/56814931550346895db673a5/html5/thumbnails/7.jpg)
![Page 8: Unit-IV](https://reader036.fdocuments.us/reader036/viewer/2022070412/56814931550346895db673a5/html5/thumbnails/8.jpg)
![Page 9: Unit-IV](https://reader036.fdocuments.us/reader036/viewer/2022070412/56814931550346895db673a5/html5/thumbnails/9.jpg)
![Page 10: Unit-IV](https://reader036.fdocuments.us/reader036/viewer/2022070412/56814931550346895db673a5/html5/thumbnails/10.jpg)
![Page 11: Unit-IV](https://reader036.fdocuments.us/reader036/viewer/2022070412/56814931550346895db673a5/html5/thumbnails/11.jpg)
• Supports ActionScript 3.0
■ Object-oriented scripting programming language■ Compliant with ECMAScript standard– In 2005 Macromedia chaired the ECMAScript committeeand Adobe continues to drive evolution of ECMAScript
Flash Player 9
![Page 12: Unit-IV](https://reader036.fdocuments.us/reader036/viewer/2022070412/56814931550346895db673a5/html5/thumbnails/12.jpg)
• Includes new, optimized ActionScript Virtual Machine (AVM) to execute the ActionScript code
■ Built from the ground up to work with ActionScript 3.0
■ Significantly faster than earlier versions
■ Full runtime error reporting
– In earlier versions many runtime errors would fail in agraceful, but silent fashion■ Industry standard debugging■ Stronger compile-time type checking
![Page 13: Unit-IV](https://reader036.fdocuments.us/reader036/viewer/2022070412/56814931550346895db673a5/html5/thumbnails/13.jpg)
• New language elements added
■ E4X (ECMAScript for XML), which adds XML as a native dataType
■ Regular expressions
■ Implements event handling based on W3C DOM Events standard
![Page 14: Unit-IV](https://reader036.fdocuments.us/reader036/viewer/2022070412/56814931550346895db673a5/html5/thumbnails/14.jpg)
![Page 15: Unit-IV](https://reader036.fdocuments.us/reader036/viewer/2022070412/56814931550346895db673a5/html5/thumbnails/15.jpg)
TOOLS USED-> Flex Builder 2
-> Flex Builder 3
-> Flex Builder 4 ((code named Gumbo) will be released in 2009 )
![Page 16: Unit-IV](https://reader036.fdocuments.us/reader036/viewer/2022070412/56814931550346895db673a5/html5/thumbnails/16.jpg)
![Page 17: Unit-IV](https://reader036.fdocuments.us/reader036/viewer/2022070412/56814931550346895db673a5/html5/thumbnails/17.jpg)
![Page 18: Unit-IV](https://reader036.fdocuments.us/reader036/viewer/2022070412/56814931550346895db673a5/html5/thumbnails/18.jpg)
![Page 19: Unit-IV](https://reader036.fdocuments.us/reader036/viewer/2022070412/56814931550346895db673a5/html5/thumbnails/19.jpg)
![Page 20: Unit-IV](https://reader036.fdocuments.us/reader036/viewer/2022070412/56814931550346895db673a5/html5/thumbnails/20.jpg)
![Page 21: Unit-IV](https://reader036.fdocuments.us/reader036/viewer/2022070412/56814931550346895db673a5/html5/thumbnails/21.jpg)
File Format: Shockwave Flash
![Page 22: Unit-IV](https://reader036.fdocuments.us/reader036/viewer/2022070412/56814931550346895db673a5/html5/thumbnails/22.jpg)
![Page 23: Unit-IV](https://reader036.fdocuments.us/reader036/viewer/2022070412/56814931550346895db673a5/html5/thumbnails/23.jpg)
![Page 24: Unit-IV](https://reader036.fdocuments.us/reader036/viewer/2022070412/56814931550346895db673a5/html5/thumbnails/24.jpg)
![Page 25: Unit-IV](https://reader036.fdocuments.us/reader036/viewer/2022070412/56814931550346895db673a5/html5/thumbnails/25.jpg)
Benefits of using Flex-> Enhanced user experience
-> A complete environment
-> Common deployment environment
-> Enterprise-class features
-> Eliminate page loads
-> Standards-based architecture-> Cross- browser Compatibility
![Page 26: Unit-IV](https://reader036.fdocuments.us/reader036/viewer/2022070412/56814931550346895db673a5/html5/thumbnails/26.jpg)
List of RIA Platforms/Approaches
-> Adobe Flash, Adobe Flex and Adobe AIR-> Backbase-> Curl-> Google's GWT framework-> Java applets-> Java applications-> JavaFX-> JavaScript / Ajax-> Microsoft ActiveX controls-> Microsoft Silverlight-> Mozilla Prism-> OpenLaszlo-> REBOL 2.6 and Seaside for Smalltalk
![Page 27: Unit-IV](https://reader036.fdocuments.us/reader036/viewer/2022070412/56814931550346895db673a5/html5/thumbnails/27.jpg)
![Page 28: Unit-IV](https://reader036.fdocuments.us/reader036/viewer/2022070412/56814931550346895db673a5/html5/thumbnails/28.jpg)
Comparison between AJAX and Flex
![Page 29: Unit-IV](https://reader036.fdocuments.us/reader036/viewer/2022070412/56814931550346895db673a5/html5/thumbnails/29.jpg)
When a project is created, a number of files and folders are automatically created
■ bin-debug folder: Where your compiled application resides
■ html-template folder: Where the html wrapper page resides
■ .settings folder: Where some project configuration files reside
■ .actionScriptPoperties, .flexProperties and .project files: Project configuration files
■ src folder: Where MXML files and other asset folders reside
■ libs folder: Where custom class files can reside
■ A main application file
![Page 30: Unit-IV](https://reader036.fdocuments.us/reader036/viewer/2022070412/56814931550346895db673a5/html5/thumbnails/30.jpg)
Creating data bindings between components
• Data binding is the process of binding the data of one object to another object
• Two ways to perform a binding:
■ Curly braces syntax ( { } )■ <mx:Binding> tag
Assigning instance names:
• Most MXML tags refer to classes■ When you use the tag, you create an instance of the class
• Use the id property to assign an instance name■ Allows you to refer to the object created
![Page 31: Unit-IV](https://reader036.fdocuments.us/reader036/viewer/2022070412/56814931550346895db673a5/html5/thumbnails/31.jpg)
Creating data bindings
• Using the curly braces syntax
■ Assigns a property a dynamic instead of literal value■ Uses a broadcast/listener method
<mx:Label id="labelOne" text="hello"/><mx:Label text="{labelOne.text}"/>
• Using the <mx:Binding> tag
■ Specify the source and destination property values
<mx:Label id="labelTwo" text="hello"/><mx:Label id="labelThree"/><mx:Binding source="labelTwo.text"destination="labelThree.text"/>