A framework is an established library of code designed to perform common tasks. Instead of having to write, test, and debug the code necessary to do a particular thing, you can save yourself a lot of time and hassle by using a framework.
- Yahoo! User Interface (YUI) Library (http://developer.yahoo.com/yui/)
- Dojo (www.dojotoolkit.org)
- Rico (www.openrico.org)
- qooxdoo (www.qooxdoo.org)
- Ext JS (www.extjs.com)
- mootools (www.mootools.net)
- script.aculo.us (http://script.aculo.us)
Most are free of charge (others require licenses for some uses). Which you use on any project is up to you. How you use each specific framework is far too complicated to discuss here, but I will demonstrate the basics of incorporating one into your AIR applications.
To use a framework:
Determine which framework you'd like to use and download it.
A second but still important consideration is the quantity and quality of documentation available for the framework (including tutorials or articles put together by third parties). The point of a framework is to save you time; spending hours figuring out how to use a framework defeats that purpose.
For these next steps, let's use the Yahoo! User Interface (YUI) Library, which was at version 2.4.1 at the time of this writing.
- Begin a new AIR project in your text editor or IDE.
Copy any required files to your project's directory.
This may be the hardest step because it requires a thorough understanding of how the framework will be used. For example, to use the YUI calendar widget (Figure 4.4), you need to copy three files from the downloaded code into the project folder (all are within the build directory found in the YUI download):
Figure 4.4 The YUI calendar widget creates a calendar you can use in your AIR applications (or Web pages, naturally). It's scrollable by month and allows the user to select any date.
Figure 4.5 All of the files and folders in this project, as shown in Aptana Studio's project window.
- Include the framework files in your HTML page (Script 4.1):
Script 4.1. By including and using the Yahoo! User Interface framework, a few lines of code can create a complete calendar (see Figure 4.4).
- Use the framework in your HTML page as needed:
These lines are all that's necessary to make the AIR application shown in Figure 4.4. Whenever you use a framework, most of the code in the HTML page will be derived from the framework's documentation, modified to suit your application. For this YUI calendar widget, a DIV is created, and then a new YAHOO.widget.Calendar object is created. Finally, the object's render() method is called to actually generate the calendar.
Be sure to include the framework files when building the application!
How you do this depends on what you're using to build the application. With Aptana Studio, all files listed in the project window (see Figure 4.5) will automatically be included. With Dreamweaver, you just need to make sure you add all the files in the AIR Application and Installer Settings window (see Figure 4.3 for the previous example). If you're using the command-line adt, all of the files and directories must be listed in the command (see Figure 4.2 for the previous example).