Introduction To Echo
Quick Introduction To Echo
A Java Thin Client Framework
Note: The material here was used in a presentation about Echo for the Cincinnati Java User Group on 2005.05.16.
Echo For Managers
A Java framework for creating web-based applications.
Works with browsers supporting JavaScript >= 1.3, e.g. IE, FireFox, Netscape, ...
No client side binaries, ActiveX, Plugins, ...
No server side special server. A program is deployed as a servlet to a servlet container e.g. Tomcat.
Open source with LGPL and Mozilla Public License. Support available for $.
Released in 2003.
Currently on version 1.1.4, with version 2.0 in Alpha.
Echo For Geeks
The front end is written completely in Java; as a programmer you do not write HTML, JavaScript, JSP, XML, XSL, CRAP, ...
Echo provides a component library similar to Swing for writing the front end.
At run-time, the components generate the appropriate HTML and JavaScript for the browser.
An Eclipse plugin is available for GUI design but it costs $350/License.
You need to import and deploy two jar files with total size about 360KB.
Works with JDK 1.2 and higher, Servlet Specs 2.2 or higher.
Main developer Tod Liebeck.
If you are familiar with Swing, you need 10 to 20 hours to become productive.
Good introduction tutorial and JavaDocs, but no good documents on how to write big apps. However, it is not hard to figure out.
Version 2 will use AJAX (Asynchronous JavaScript and XML). Updating a component on the page instead of whole page. Google map and GMail use AJAX.
An example application (written with Echo 1.1.4) source and binaries are here. (7.15 MB)
Links
Distributed by www.nextapp.com
Main Page: www.nextapp.com/products/echo
EchoPoint, a library of Echo web components: echopoint.sourceforge.net
Test Code
package com.tek271.test;
import nextapp.echo.*;
import nextapp.echo.event.*;
import nextapp.echoservlet.EchoServer;
public class HelloServlet extends EchoServer {
// EchoServer extends javax.servlet.http.HttpServlet
public EchoInstance newInstance() {
//return new HelloWorld();
//***** Demo step 5: buttons and handlers
return new ButtonsTest();
}
class HelloWorld extends EchoInstance {
// Declare the init() method which is abstract in EchoInstance
public Window init() {
Window w= new Window("Hello World title");
ContentPane contentPane= new ContentPane();
w.setContent(contentPane);
Label lbl= new Label("Hello World");
contentPane.add(lbl);
// ***** Demo step 1: font and color
lbl.setFont( new Font(Font.VERDANA, Font.BOLD, 16) );
lbl.setForeground(Color.BLUE);
// ***** Demo step 2: image
HttpImageReference img= new HttpImageReference("file://C:/util/graphics/animated/horse.gif");
lbl.setIcon(img);
// ***** Demo step 3: text field
contentPane.add( Filler.createVerticalStrut(20) ); // make vertical space
TextField tf= new TextField("default value");
contentPane.add(tf);
// ***** Demo step 4: style
Style style= new Style();
style.setAttribute(TextField.STYLE_BACKGROUND, Color.YELLOW);
style.setAttribute(TextField.STYLE_FOREGROUND, Color.BLUE );
style.setAttribute(TextField.STYLE_FONT, new Font(Font.ARIAL, Font.BOLD, 14) );
style.setAttribute(TextField.STYLE_BORDER_SIZE, 4);
style.setAttribute(TextField.STYLE_BORDER_COLOR, Color.RED);
style.setImmutable(); // throw exception if style changed
tf.applyStyle(style); // apply style on text field
return w;
}
} // class HelloWorld
class ButtonsTest extends EchoInstance implements ActionListener {
private Button pRed, pGreen, pBlue, pWhite;
private ContentPane pContent;
public void actionPerformed(ActionEvent e) {
Object src= e.getSource();
if (src == pRed) pContent.setBackground(Color.RED);
else if (src == pGreen) pContent.setBackground(Color.GREEN);
else if (src == pBlue) pContent.setBackground(Color.BLUE);
else if (src == pWhite) pContent.setBackground(Color.WHITE);
} // actoinPerformed();
public Window init() {
Window window=new Window("Button Demo");
pContent=new ContentPane();
window.setContent(pContent);
Label label=new Label("Click on a button to change the background:");
pContent.add(label);
pRed= createButton("Red", Color.RED);
pGreen= createButton("Green", Color.GREEN);
pBlue= createButton("Blue", Color.BLUE);
pWhite= createButton("White", Color.WHITE);
return window;
}
private Button createButton(String aCaption, Color aBackground) {
Button r= new Button(aCaption);
r.setBackground(aBackground);
r.addActionListener(ButtonsTest.this);
r.setToolTipText("Change the background color to " + aCaption);
pContent.add(r);
return r;
}
} // class ButtonsTest
} // class HelloServlet