Java (TM) Applet User Interface Depends on the Browser
A Java applet user interface may look different on each browser that
displays it, even on the same operating system. The various window
components such as buttons, text areas, selection lists and drop down
boxes have different sizes and colors. This is important for Web
developers and Java programmers to know in order to accomodate the
display characteristics of Java in multiple environments.
Our demonstration applet called showIt.class will exemplify that Java
screen components have different sizes and default colors under
different browsers. The differences are slight in this example but
when multiple components are used within the same applet alignment
problems become obvious.
How was the applet written and compiled?
The showIt.class applet was developed and compiled using Microsoft
Visual J++ version 1.0 which uses Java version 1.0.2. It was also
compiled with JavaSoft's JDK 1.0.2 and yielded the same results. We
conclude the differences in the applets display properties result
from the Java virtual machine in each of the browser/viewers.
Where was the applet executed?
The applet was executed under 6 different browsers/viewers on two
different computers running the Windows 95 operating system. We
tested two versions of Microsoft Internet Explorer, two versions of
Netscape Navigator and two versions of JavaSoft's appletviewer
delivered in the Java development kit.
In our lab, when we installed Microsoft Internet Explorer 4.0 on
one machine it removed Microsoft Internet Explorer 3.0 and disabled
the Java Virtual machine that Netscape 4.03 was using on that
machine. So a different Windows 95 computer is used to test the
applet running under NN4.03 and MSIE 3.01.
What does the applet do?
The showIt.class applet creates a button, selection list, drop
down box and a text area on the screen. The user presses the
button and the text area is populated with the Java vendor url
and the VM it executes and the properties of each window component.
- The Java vendor url
- The Java VM version running in the browser or appletviewer
(JavaSoft's applet test software)
- The button properties
- The list component properties
- The drop down box properties
- The text area properties
Try the applet for yourself
showIt.class applet
Results Summary
Take a quick visual look at the
screen shots and you
will notice that the height, width and color of the components differ
in each screen shot. The Java applet program executed is exactly the
same in each case.
- The button component has a width and height of 90x21, 90x23 and 102x23.
- The list component has a width and height of 110x60, 110x68, 110x56,
124x64 and by default the color is the background color grey instead
of white.
- The drop down box (choice component) has a width and height of 82x24,
82x26, 82x19, and 90x21, its background color differs too.
- The text area width and height varies from 560x111, 560x125, 564x115,
and 650x125. The scroll bars show up differently, where some have
none, one or both
This HTML calls the showIt.class Java applet
<html><body><applet code=showIt width=600 height=180></applet>
</body></html>
Here is the showIt.class applet program
Here is the source code for the showIt.class applet
import java.awt.*;
import java.applet.*;
public class showIt extends Applet {
TextArea showArea;
Button showButton;
Choice showDropDown;
List showList;
public void init(){
showButton = new Button("Click this Button");
showDropDown= new Choice();
showList = new List();
showArea = new TextArea(7,90);
showList.addItem("List Item");
showDropDown.addItem("Drop Down");
add(showButton);
add(showList);
add(showDropDown);
add(showArea);
}
public boolean action(Event evt, Object obj){
if (evt.target instanceof Button) {
showArea.setText(
"Java vendor url = " +
System.getProperty("java.vendor.url") + "\n" +
"Java version = " +
System.getProperty("java.version") + "\n" +
showButton.toString() + "\n" +
showList.toString() + "\n" +
showDropDown.toString() + "\n" +
showArea.toString());
}
return true;}
}
Conclusion
The differences reported here are indisputable and easy to reproduce.
These differences become problematic for graphical user interfaces
where the position and component placement are important for proper
presentation. The variance in height and width becomes obvious when
you try to align two components horizontally side by side. For
example, a button and a drop down box have different heights so
there alignment is not precise. There are additional window
components like checkboxes and text fields that were not covered in
this article for purposes of brevity. Java (TM) is a great new
language, however it does require platform testing and program
revision to assure the desired results are achieved.
Resources
"SunTest's "100% Pure Java Cookbook"
"How to avoid potential pitfalls of Microsoft's non-standard SDK for
Java"
|
