Para diseñar la interfaz usuario del applet tenemos dos soluciones. Podemos utilizar una biblioteca de componentes gráficos (awt o swing) y utilizar sus componentes para definir el aspecto visual del applet. Esta solución presenta la ventaja de ser rápida a la hora de ponerla en marcha y de ser conveniente para la mayoría de los casos. El único reproche que se le puede hacer es justamente el hecho de utilizar componentes clásicos para la visualización y de no permitir presentaciones específicas. Sin embargo, la mejora y la evolución de las bibliotecas gráficas proporciona cada vez más posibilidades. Si, sin embargo, no encuentra el componente correspondiente a sus necesidades, podrá asumir completamente la representación gráfica del applet al sobrecargar su método paint. En una primera fase, vamos a utilizar esta solución intentando eliminar los problemas encontrados durante nuestra experimentación anterior. Tenemos que tener cuidado en no dibujar más allá de los limites del applet. Para ello, vamos a adoptar el proceso siguiente:
int anchura; int altura;
anchura=getWidth(); altura=getHeight();
Obtener las dimensiones de la zona reservada al applet,
Dibujar los caracteres uno tras otro verificando cada vez que el espacio disponible es suficiente,
Si el espacio no es suficiente en la línea actual, debemos gestionar el cambio de línea. Vamos a intentar resolver los problemas por etapas.
a. Creación de una fuente de caracteres
Una fuente de caracteres se define por su nombre y su tamaño. Existe una multitud de fuentes de caracteres y nada nos garantiza que la fuente que vamos a elegir esté disponible en el ordenador en el cual se va ejecutar nuestro applet. Para paliar este problema, Java propone fuentes lógicas que se convierten en el momento de la ejecución en fuentes disponibles en el puesto cliente. Las siguientes fuentes lógicas están disponibles:
SansSerif Serif
Monospaced Dialog DialogInput
La fuente real utilizada se determinará en el momento de la ejecución en función de las disponibilidades. Por ejemplo, la fuente lógica SansSerif se convertirá en fuente Arial en un sistema Windows.
La creación de la fuente se efectúa al llamar al constructor de la clase Font y pasarle como parámetros el nombre de la fuente, el estilo de la fuente (negrita, cursiva…), el tamaño de la fuente.
Font fuente=null;
fuente =new Font("SansSerif",Font.PLAIN,14);
b. Obtener las dimensiones del applet
Las dimensiones del applet pueden ser fijadas por el navegador o por el diseñador de la página html cuando éste inserta el applet en la página. Se pueden obtener estas dimensiones en el momento de la ejecución al utilizar los métodos getHeight y getWidth.
c. Dibujar los caracteres
El método drawString de la clase Graphics permite la visualización de una cadena de caracteres con la fuente determinada previamente por el método setFont. El método drawString espera los parámetros siguientes:
la cadena de caracteres;
la posición horizontal donde se efectúa la visualización; la posición vertical donde se efectúa la visualización.
http://www.eni-training.com/client_net/mediabook.aspx?idR=65890 6/20
import java.awt.Font;
import java.awt.FontMetrics; import java.awt.Graphics; import javax.swing.JApplet;
public class TestApplet2 extends JApplet {
private String mensaje=""; public void destroy() {
mensaje=mensaje + "método destroy \r\n"; }
public void init() {
mensaje=mensaje + "método init \r\n"; }
public void start() {
mensaje=mensaje + "método start \r\n"; }
public void stop() {
mensaje=mensaje + "método stop \r\n"; }
public void paint(Graphics g) {
// creación de la fuente de caracteres Font =null;
Este método no tiene noción de cursor, y nos corresponde por lo tanto la obligación de proporcionar a cada llamada una posición correcta para la visualización.
g.drawString(texto,posicionX,posicionY);
d. Determinar las dimensiones de una cadena
Para poder gestionar correctamente la visualización, debemos comprobar que queda bastante espacio disponible para la cadena que se quiere mostrar. Por supuesto este espacio depende del número de caracteres de la cadena y también de la fuente utilizada. Además, algunas fuentes al tener un espaciado proporcional, necesitan más espacio para mostrar el carácter W que para mostrar el carácter i. No es posible, por lo tanto, basarse en una anchura constante para cada carácter. La clase FontMetrics nos aporta una ayuda notable para resolver este problema. Un objeto de FontMetrics se puede obtener al utilizar el método getFontMetrics del contexto gráfico del applet. Este método espera como parámetro la fuente de caracteres con la que va a efectuar sus cálculos. La anchura necesaria para mostrar una cadena de caracteres dada se obtiene luego llamando al método stringWidth al cual se debe proporcionar la cadena de caracteres a "medir". En cuanto a la altura se obtiene con el método getHeight. La altura, al estar relacionada únicamente con la fuente de caracteres, no exige proporcionar la cadena de caracteres para obtener esta información.
Ahora que tenemos todos los elementos útiles, presentamos a continuación la manera de utilizarlos para resolver nuestro problema.
fuente =new Font("SansSerif",Font.PLAIN,14); // asignación de la fuente al contexto gráfico
g.setFont(fuente);
// determinación de la anchura y altura del applet int anchuraApplet;
int alturaApplet;
anchuraApplet=getWidth(); alturaApplet=getHeight();
// creación de un objeto FontMetrics para obtener informaciones // relativas al tamaño de los caracteres
FontMetrics fm;
fm=g.getFontMetrics(fuente); int alturaFuente;
int anchuraCaracter;
alturaFuente=fm.getHeight();
// declaración de las variables para gestionar la posición // de la visualización
int cursorX; int cursorY; cursorX=0;
cursorY=alturaFuente;
mensaje=mensaje + "método paint \r\n";
// bucle de tratamiento de los caracteres uno por uno for (int i=0;i<mensaje.length();i++)
{
// recuperación del carácter a tratar y de su anchura String caracterActual;
caracterActual=mensaje.substring(i,i+1);
anchuraCaracter=fm.stringWidth(caracterActual); // verificación de si queda espacio en la línea if (cursorX+anchuraCaracter>anchuraApplet) {
// paso al principio de la línea siguiente cursorY=cursorY+alturaFuente;
cursorX=0; }
// visualización del carácter a la posición actual g.drawString(caracterActual,cursorX,cursorY); // actualización de la posición del cursor
cursorX=cursorX+anchuraCaracter; }
} }
Al comprobar el funcionamiento del applet, constatamos que hay una clara mejora en comparación con la versión anterior.
http://www.eni-training.com/client_net/mediabook.aspx?idR=65890 8/20
import java.applet.Applet; import java.awt.Graphics; import java.awt.ScrollPane; import java.awt.TextArea;
public class TestApplet3 extends Applet {
ScrollPane desplazamiento; TextArea txt;
private String mensaje="";
public void destroy() {
mensaje=mensaje + "método destroy \r\n";
Sigue habiendo mejoras que aportar, en particular en lo referente a la gestión del desplazamiento vertical pero vamos a probar otra solución y confiar el aspecto gráfico del applet a componentes especializados. La visualización con desplazamiento de texto es una funcionalidad corriente que debe ofrecer una aplicación y por supuesto los diseñadores de bibliotecas gráficas de Java han diseñado componentes adaptados a estas necesidades. Las clases TextArea y ScrollPane nos van a permitir resolver nuestro problema. Su puesta en marcha es muy sencilla porque basta con crear una instancia de la clase TextArea indicando en la llamada del constructor las dimensiones deseadas. Luego se debe confiar esta instancia al componente ScrollPane quien va a encargarse del desplazamiento del texto. Luego el conjunto se añade al applet. Añadir texto es una tarea que se lleva a cabo de una forma muy sencilla llamando al método append de la claseTextArea. Por lo tanto, nuestra nueva versión de applet tiene la forma siguiente.
}
public void init() { txt=new TextArea(50,50); desplazamiento=new ScrollPane(); desplazamiento.add(txt); add(desplazamiento); txt.append("método init \r\n"); }
public void start() {
txt.append("método start \r\n"); }
public void stop() {
txt.append("método stop \r\n"); }
public void paint(Graphics g) {
txt.append("método paint \r\n"); }
}
El código es mucho más sencillo que el de la versión anterior y sin embargo el resultado es mucho más profesional.
http://www.eni-training.com/client_net/mediabook.aspx?idR=65890 10/20
private Imagen img;
img=getImage(new URL("http://www.eni-ecole.fr/imágenes/escuela.jpg")); private Imagen img;
img=getImage(new URL("http://www.eni-ecole.fr/"),"imágenes/ escuela.jpg");