Flex cookbook beta

Building an HTML, CSS, AJAX capable AIR Browser (Standalone Application)

Problem Summary

This is a simple recipe to illustrate how powerful the core HTML functionality is in AIR. You will see how to build a simple web browser in 5 lines of code.

Solution Summary

The Adobe Integrated Runtime (AIR) uses the Webkit HTML engine. As such, most of the complexity of using HTML in your applications is hidden. This simple demo loads up a webpage that has CSS and AJAX to demonstrate the capabilities. Also load up a foreign page like http://www.yahoo.jp to see how Kanji characters are handled.

Explanation

Source Code:

<?xml version="1.0" encoding="utf-8"?>
<mx:WindowedApplication xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical">
    <mx:Label text="Please enter your URL and hit &quot;enter&quot;"/>
    <mx:TextInput id="URLtext" width="100%" enter="HTML.location=URLtext.text"/>
    <mx:HTML id="HTML" location="http://www.google.com/ig" width="100%" />   
</mx:WindowedApplication>

Yep - that's really it ;-)

I have attached a project with the source and also added some extra stub code in case you want to experiment around with building a home, history and back functionality into your browser project.

Related files for download

HTML Browser, built for Flex Builder 3, beta 3
AIR3_Browser.zip

Picture 21.jpg

---