RAD (Rapid Application Development) tools like Visual Studio, animation studios like Macromedia Flash, HTML editors like Macromedia Dreamweaver, all help in developing a rich user interface. All these IDEs (Integrated Development Environment) allow us to come up with magnificent interfaces by dragging and dropping components and controls onto a frame, stage or a window. On the flip side, changing the user interface of your program developed using these IDE's would usually mean opening up your program code again in the respective IDEs, making changes, recompiling and redeploying. Also a programmer will need to spend significant time in understanding these IDE.
|
Considering the above mentioned points, it seems now everyone is shifting towards markup languages like XML to develop user interfaces-for desktop as well as for Web. This shift is primarily because of the ease of using a markup to maintain user interfaces wherein the markup is defined in an external (to the application) file, which can be changed on the fly without recompiling.
For example, the new user interface system for Windows Vista called Windows Presentation Foundation (formerly called Avalon) is based on XAML markup language. There are packages like SwingML and SwiXml which allow you to generate Java Swing using XML markup. And for Web there are solutions like OpenLaszlo which allows us to create Flashy sites using only XML without ever touching the Macromedia Flash IDE.
OpenLaszlo, based on Java, is a set of Java Servlets which compiles the user interface markup defined in XML files to a Flash-based interface. This means, OpenLaszlo must be deployed on a Java application server. Let us now install and deploy OpenLaszlo on Tomcat application server running on PCQLinux 2005 (a Linux distribution given out by PCQuest with the March 2005 issue). Subsequently we will code simple but flashy applications using it.
The setup
Before installing Tomcat you will need to install JDK (Java Development Kit). For this install the RPM named pcqlinux-j2se-installer-1-0.i386.rpm found on PCQLinux CD 3. This will produce a directory named pcqlinux-j2se-installer in /opt. Change to this directory and issue the following.
./jdk-1_5_0_01-linux-i586-rpm.bin
|
Type in 'yes' for the license agreement, which will then install JDK in the directory /usr/java/jdk1.5.0_01. Next, to install Tomcat, install the RPM named tomcat-5.5-4.i386.rpm found on PCQLinux CD 3. This will install Tomcat in the directory /opt/tomcat. Next issue the following.
export JAVA_HOME=/usr/java/jdk1.5.0_01
Append the above line to the file named bashrc found in /etc directory to make this setting persistent across reboots.
To download the latest version of OpenLaszlo (version 3.0.2 as of this writing) browse to the URL
www.openlaszlo.org. Under Download click on Binaries. Scroll down and click on the 'Get It' link for Linux/Unix. On the subsequent page, select 'Development kit of any OS' and click on download file. You should be able to download an archive named openlaszlo-3.0.2.war. Create a directory named openlaszlo under /opt/tomcat/webapps. Copy openlaszlo-3.0.2.war to this directory and extract it as:
jar -xvf openlaszlo-3.0.2.war
Next, start Tomcat by issuing the following.
/opt/tomcat/bin/catalina.sh start
To view an OpenLaszlo application in your Web browser, you must have Macromedia Flash plugin 6 or above installed. To access the pre-written demos, key in this URL in your flash-enabled Web browser:
http://
Click on 'Dashboard' under 'Demos' and then click on the 'Launch Demo' button. Upon login, you will be greeted by a stunning interface of a website portal, written using
OpenLaszlo.
Write your own application
Create a directory named myapp under/opt/tomcat/webapplications. Create a subdirectory named WEB-INF within it. Copy the directories named lib and lps found in /opt/tomcat/webapps/openlaszlo/WEB-INF directory to myapp/WEB-INF directory. Also copy the file named web.xml found in /opt/tomcat/webapps/openlaszlo/WEB-INF directory to myapp/WEB-INF. Copy the directory named lps found in /opt/tomcat/webapps/openlaszlo to myapp directory. Below is the code for an application which displays 'My Laszlo App is Working' in a window.
Let's go through the above lines of markup. All the OpenLaszlo components like windows, buttons, form, views and datepicker lie within a canvas. Assume the
/opt/tomcat/bin/catalina.sh stop
/opt/tomcat/bin/catalina.sh start
Go to http://
defaultRequestType=app_console
to
defaultRequestType=html
Save the file and restart Tomcat. Subsequent access to the OpenLaszlo application will not show the debug panel.
A glimpse to events
In this part we'll tell you how to use Javascript for event handling. Note that when you click on the close button of the window, the window disappears without any way of bringing it back. We add a button called show which when clicked, will display the window again.
We have given an 'id' named win to the
Shekhar Govindarajan, IT4enterprise