HTMLpointHTMLpoint HTMLpoint.com


 Visualización de las imágenes



Empezamos viendo los métodos drawImage de la clase Graphics con los que es posible visualizar unas imágenes guardadas con formato gif o jpg.
En la clase Graphics hay varios mátodos drawImage que son:

abstract boolean drawImage(Image img, int x, int y, Color bgcolor, ImageObserver observer) abstract boolean drawImage(Image img, int x, int y, ImageObserver observer)
abstract boolean drawImage(Image img, int x, int y, int width, int height, Color bgcolor, ImageObserver observer)
abstract boolean drawImage(Image img, int x, int y, int width, int height, ImageObserver observer)
abstract boolean drawImage(Image img, int dx1, int dy1, int dx2, int dy2, int sx1, int sy1, int sx2, int sy2, Color bgcolor, ImageObserver observer)
abstract boolean drawImage(Image img, int dx1, int dy1, int dx2, int dy2, int sx1, int sy1, int sx2, int sy2, ImageObserver observer)

Todos los métodos requieren dos parámetros Image y ImageObserver.
Image rapresenta la imagen que hay que visualizar. Es una clase abstracta que permite un acceso independiente del formato de imágenes gráficas. Los objetos de esta clase se crean utilizando los métodos de otras clases que crean imágenes, según el contexto en el que se quieran utilizar.
Por ejemplo, si quiero dibujar una imagen en un componente Gui, puedo usar el método createImage() de la clase Component.
En cambio, si quiero dibujar una imagen en un aplique, es posible usar el método getImage() de la clase Applet.
La clase Toolkit tiene tanto createImage() como getImage().
El otro parámetro que necesitan las drawImage() es un objeto que implementa la interfaz ImageObserver, y en la práctica representa el objeto gráfico sobre el que se visualizará la imagen.
Component implementa la interfaz ImageObserver y, consecuentemente, la implementan todas sus extensiones:

  • Todos los GUI
  • Los Apliques
  • Todas las ventanas (incluso los Frames)

    Los demás parámetros son:

  • la posición x en la que se visualizará la imagen en el componente
  • la posición y en la que se visualizará la imagen en el componente el color del fondo

    Vamos a poner un ejemplo de visualización de una imagen. En primer lugar creamos una imagen como la siguiente:


    y la guardamos en formato gif usando un editor cualquiera de imágenes llamándola, por ejemplo, pietro.jpg.
    Ahora creamos el siguiente aplique:

    import java.awt.*; // Para la clase Graphics
    import java.applet.*; // Para la clase Applet
    import java.net.*; // Para las URL
    /*
    Como hemos tenido ya la ocasión de decir, los archivos para los apliques no son otra cosa que unas URL
    */

    public class VisualizaImagen extends Applet
    {
    Image ImagenPietro;

    public void init()
    {

    setBackground(Color.white);

    ImagenPietro=getImage(getDocumentBase(),"pietro.jpg");

    }

    public void paint(Graphics g)
    {

    g.drawImage(ImagenPietro,0,0,this);
    getAppletContext().showStatus("Visualizo la imagen pietro.jpg, Applet creada por Pietro Castellucci");

    }

    }

    La ponemos en un archivo llamado VisualizaImagen.java y la invocamos usando el documento html siguiente (Imagen.html):

    <html>
    <head>
    <title>
    Applet VisualizaImagen, visualiza la imagen pietro.jpg
    </title>
    </head>
    <body>
    <APPLET code="VisualizaImagen.class" width=385 height=100>
    </APPLET>
    <BR>
    La de arriba es un aplique, sin embargo la de abajo no lo es.
    <BR>
    <IMG SRC="pietro.jpg">
    </body>
    </html>

    Si ponemos en marcha el aplique nos damos cuenta de que no hay ninguna diferencia entre la imagen cargada en el aplique y la que hemos cargado usando el tag IMG SRC del html, sino el mensaje que aparece cuando pasamos por encima el ratón. Os podría parecer incluso un trabajo inútil para vuestras páginas html.
    Esto es absolutamente falso porque la imagen cargada en el aplique pertenece a un programa que puede hacer incluso cosas complejas. Por ejemplo, es posible añadir otros componentes GUI al aplique, o elaborar las imágenes mismas, como se ve en el ejemplo sucesivo (VisualizaImagen2.java):

    import java.awt.*; // Para la clase Graphics
    import java.applet.*; // Para la clase Applet
    import java.net.*; // Para las URL
    import java.awt.event.*; // Para los sucesos

    /*
    Como ya hemos dicho, los archivos para los apliques no son otra cosa que unas URL
    */

    public class VisualizaImagen2 extends Applet
    {
    Image ImagenPietro;

    CheckboxGroup gruppo=new CheckboxGroup();

    Checkbox b1=new Checkbox("Parar",grupo,true);

    Checkbox b2=new Checkbox("Animada",grupo,false);

    Panel p=new Panel(new GridLayout(1,3));

    public void init()
    {

    setBackground(Color.white);
    setLayout(new BorderLayout());
    ImagenPietro=getImage(getDocumentBase(),"pietro.jpg");

    p.add(new Label());
    p.add(b1);
    p.add(b2);

    b1.addItemListener(new IL());
    b2.addItemListener(new IL());

    add(p,BorderLayout.SOUTH);

    }

    boolean MOVIMIENTO=false;

    ent número=0;

    ent inc=1;

    public void paint(Graphics g)
    {

    if (!MOVIMIENTO)
    {
    g.drawImage(ImagenPietro,0,0,this);

    getAppletContext().showStatus("Visualizo la imagen pietro.jpg, Imagen inmóvil, Applet creada Pietro Castellucci");

    número=0;

    }
    else
    {

    g.setPaintMode();
    g.drawImage(Elabora(ImagenPietro,número),0,0,this);

    for (int k=0;k<=99;k++) getAppletContext().showStatus("Visualizo la imagen pietro.jpg, Frame "+número+", Applet creada por Pietro Castellucci");

    getAppletContext().showStatus("Visualizo la imagen pietro.jpg, Frame "+número+", Applet creada por Pietro Castellucci");

    if (número>=10) inc=-1;

    if (número<=0) inc=1;

    número+=inc;

    }

    repaint();

    }


    Image Elabora (Image img, int frm)
    {

    return img.getScaledInstance(324-(frm*20), 85-(frm*4),img.SCALE_FAST);

    }


    public class IL implements ItemListener
    {
    public void itemStateChanged(ItemEvent e)
    {

    if (b1.getState()) MOVIMIENTO=false;
    else MOVIMIENTO=true;
    repaint();
    }

    }
    }

    Cargada por el archivo html siguiente:

    <html>
    <head>
    <title>
    Applet VisualizaImagen, visualiza la imagen pietro.jpg
    </title>
    </head>
    <body>
    <APPLET code="VisualizaImagen2.class" width=385 height=100>
    </APPLET>
    <BR>
    La de arriba es un aplique, sin embargo la de abajo no lo es
    <BR>
    <IMG SRC="pietro.jpg">
    </body>
    </html>

    La nueva clase Graphics2D pone a disposición otros métodos drawImage, entre los que hay algunos que tienen un parámetro de tipo AffineTransform que, como dice el nombre, es una transformación parecida a la de la imagen, una rotación o una translación, o una combinación de todas.

    Para tener una versión sin revoloteo basta con añadir la función:

    public void update(Graphics g)
    {
    paint(g);
    }



  •   Volver al inicio de la página