Aprende Java Aprende Php Aprende C++ Aprende HTML 5 Aprende JavaScript Aprende JSON Aprende MySQL Aprende SQLServer Aprende Visual Basic 6 Aprende PostgreSQL Aprende SQLite Aprende Redis Aprende Kotlin Aprende XML Aprende Linux VSC Aprende Wordpress Aprende Laravel Aprende VueJS Aprende JQuery Aprende Bootstrap Aprende Netbeans Aprende Android
Sigueme en Facebook Sigueme en Twitter Sigueme en Instagram Sigueme en Youtube Sigueme en TikTok Sigueme en Whatsapp
Home / Proyectos / Galeria de imagenes en java

Galeria de imagenes en java

Por jc mouse viernes, agosto 26, 2011

En este tutorial crearemos una Galeria de Imagenes al estilo de javascript o flash con Java y el IDE Netbeans 6.9.

1. Crear un nuevo proyecto en Netbeans (nombre: jcGaleria)

2. añadir un JFrame que sera nuestra interfaz (nombre: interfaz.java)

3. Añadir una clase, la clase controlara la galeria de imagenes (nombre: Galeria.java)

4 Con el proyecto seleccionado crea nuevo paquete (nombre: fotos), añade algunas imagenes

5. En el paquete jcGaleria, añade una imagen, esta imagen nos servira para mostrala cuando no existan imagenes en la galeria.

debes tener algo como la imagen de abajo:

y la imagen «nofoto.gif» es:

4. En la clase interfaz.java, colocaremos algunos jpanel y jbutton, utilizaremos layout (GridBagLayout) para ordenar los objetos que colocaremos dentro de la interfaz. En la imagen siguiente se resalta con rojo los nombres de los objetos con los que interactuaremos ademas de su tamaño, que para este proyecto es importante

debemos tener algo como esto, (clic para ampliar):

5. Si llegaste hasta aqui, vamos por buen camino, ahora nos toca escribir el código para interactuar con las imagenes, empezaremos con el codigo de la clase Galeria.java. es el siguiente:

package jcgaleria;

import java.awt.Dimension;
import java.awt.Image;
import java.util.ArrayList;
import javax.swing.Icon;
import javax.swing.ImageIcon;
/**
* @web https://www.jc-mouse.net/
 * @author Mouse
 */
public class Galeria {
    //para almacenar las imagene
    private ArrayList<ImageIcon> fotos = new ArrayList<ImageIcon>();
    private ImageIcon nofoto;//el nombre lo dice todo

    public Galeria(){
        //se cargan las fotos
        nofoto = new javax.swing.ImageIcon(getClass().getResource("nofoto.gif"));
        fotos.add(new javax.swing.ImageIcon(getClass().getResource("/fotos/0.jpg")));
        fotos.add(new javax.swing.ImageIcon(getClass().getResource("/fotos/1.jpg")));
        fotos.add(new javax.swing.ImageIcon(getClass().getResource("/fotos/2.jpg")));
        fotos.add(new javax.swing.ImageIcon(getClass().getResource("/fotos/3.jpg")));
        fotos.add(new javax.swing.ImageIcon(getClass().getResource("/fotos/4.jpg")));
        fotos.add(new javax.swing.ImageIcon(getClass().getResource("/fotos/5.jpg")));
    }

    /* devuelve una imagen de tamaño 100x100 VISTA PREVIA */
    public Icon getPreview(int num){
        if( num>=0 & num<fotos.size() )
        {
            Image mini = fotos.get(num).getImage().getScaledInstance(100, 100, Image.SCALE_AREA_AVERAGING);
            return new ImageIcon(mini);
        }
        else
        {
            Image mini = nofoto.getImage().getScaledInstance(100, 100, Image.SCALE_AREA_AVERAGING);
            return new ImageIcon(mini);
        }
    }

   /* devuelve la foto original, pero si el tamaño es mayor al contenedor, lo redimensiona */
   public Icon getFoto(int num, Dimension d){
        if( num>=0 & num<fotos.size() )
        {
            //si la foto es mas grande que el contendor -> redimensionar
            if(fotos.get(num).getIconWidth()>d.getWidth()){
                float v = getValor(fotos.get(num).getIconWidth(),d.width);
                return Disminuir(fotos.get(num),v);
            }else if(fotos.get(num).getIconHeight()>d.getHeight()){
                float v = getValor(fotos.get(num).getIconHeight(),d.height);
                return Disminuir(fotos.get(num),v);
            }else{
                return fotos.get(num);
            }
        }
        else
        {
            Image mini = nofoto.getImage().getScaledInstance(400, 400, Image.SCALE_AREA_AVERAGING);
            return new ImageIcon(mini);
        }
    }

   /* redimensiona la imagen en para que ingrese al contendor pero manteniendo sus proporciones*/
    private ImageIcon Disminuir(ImageIcon i, float v){
        int valEscalaX = (int) (i.getIconWidth() * v );
        int valEscalaY = (int) (i.getIconHeight() * v );
        Image mini = i.getImage().getScaledInstance(valEscalaX, valEscalaY, Image.SCALE_AREA_AVERAGING);
        return new ImageIcon(mini);
     }

    /* devuelve el valor de escala para redimensionar la imagen*/
    private float getValor(int a, int b){
        return Math.abs((a/new Float(b))-2f);
    }
}

Esta clase, al ser creada, inicializa un ArrayList con imagenes que son cargadas desde el paquete Fotos (que creamos en el paso 4), ademas de una variable «nofoto»con la imagen del paquete jcGaleria.

6. Para terminar debemos implementar esta clase en la clase interfaz.java, para ello necesitamos el siguiente codigo

package jcgaleria;
/**
* @web https://www.jc-mouse.net/
 * @author Mouse
 */
public class interfaz extends javax.swing.JFrame {
    Galeria Mi_Galeria = new Galeria();
    private int a = 0;
    private int b = 1;
    private int c = 2;
    private int d = 3;
    /** Creates new form interfaz */
    public interfaz() {
        initComponents();
        this.setTitle("Galeria de Imagenes Java - por Mouse");
        this.setLocationRelativeTo(null);
        //se elimina el texto
        FOTO_A.setText("");FOTO_B.setText("");FOTO_C.setText("");FOTO_D.setText("");FOTO_GRANDE.setText("");
        //se inici la vista previa
        FOTO_A.setIcon(Mi_Galeria.getPreview(0));
        FOTO_B.setIcon(Mi_Galeria.getPreview(1));
        FOTO_C.setIcon(Mi_Galeria.getPreview(2));
        FOTO_D.setIcon(Mi_Galeria.getPreview(3));
    }

/* demas codigo generado por netbeans 
 ...
 ...
*/

 private void FOTO_AMouseClicked(java.awt.event.MouseEvent evt) {
        FOTO_GRANDE.setIcon(Mi_Galeria.getFoto(a,FOTO_GRANDE.getSize()));
    }

    private void FOTO_BMouseClicked(java.awt.event.MouseEvent evt) {
        FOTO_GRANDE.setIcon(Mi_Galeria.getFoto(b,FOTO_GRANDE.getSize()));
    }

    private void FOTO_CMouseClicked(java.awt.event.MouseEvent evt) {
        FOTO_GRANDE.setIcon(Mi_Galeria.getFoto(c,FOTO_GRANDE.getSize()));
    }

    private void FOTO_DMouseClicked(java.awt.event.MouseEvent evt) {
        FOTO_GRANDE.setIcon(Mi_Galeria.getFoto(d,FOTO_GRANDE.getSize()));
    }

    private void CMD_NEXTActionPerformed(java.awt.event.ActionEvent evt) {
        a+=1;b+=1;c+=1;d+=1;
        FOTO_A.setIcon(Mi_Galeria.getPreview(a));
        FOTO_B.setIcon(Mi_Galeria.getPreview(b));
        FOTO_C.setIcon(Mi_Galeria.getPreview(c));
        FOTO_D.setIcon(Mi_Galeria.getPreview(d));
    }

    private void CMD_PREVIEWActionPerformed(java.awt.event.ActionEvent evt) {
        a-=1;b-=1;c-=1;d-=1;
        FOTO_A.setIcon(Mi_Galeria.getPreview(a));
        FOTO_B.setIcon(Mi_Galeria.getPreview(b));
        FOTO_C.setIcon(Mi_Galeria.getPreview(c));
        FOTO_D.setIcon(Mi_Galeria.getPreview(d));
    }

/* demas codigo generado por netbeans
 ...
 ...
 */

NOTA: No copies y pegues este codigo, recuerda que netbeans nos genera mucho código extra al crear el JFrame, seria muy largo colocarlo ese codigo aqui, ademas que innecesario, el codigo de arriba, solo representa a las partes que nosotros utilizamos al trabajar con el netbeans, los jbutton y jlabel en su mayoria, ademas de crear algunas variables e instanciar el objeto Galeria.

Finalmente compilamos y ejecutamos el proyecto, si todo salio bien, debes ver algo como esto:

Codigo fuente del proyecto

https://zion.jc-mouse.net/file/JCGALPIC76

Enjoy!!!

Tags

Artículos similares

Rompecabezas con forma irregular

En este post vemos una manera de como crear un juego de rompecabezas en java sin el uso de java2d, ademas, las piezas de[...]

Modificar las pestañas de JTabbedPane

En este tutorial veremos lo fácil que es personalizar las pestañas de un JTabbedPane con unas cuantas lineas de código y[...]

Criba de Eratóstenes animado

Eratóstenes era un matemático griego del siglo  III a.C. el cual ideó una manera rápida de obtener todos los números pri[...]

Desarrollo de juegos con Libgdx y Android Studio

De las pocas herramientas disponibles entre librerías, frameworks, engines, etc para el desarrollo de videojuegos en len[...]

Google Open Source: Código Abierto +2000 proyectos

Google abre las puertas de Google Open Source un nuevo sitio web que une todos sus proyectos de «Código Abierto» que ha[...]

Ciudadanía digital y seguridad en Internet

«Be Internet Awesome» (Se genial en Internet) es un recurso de Google para la enseñanza  de conceptos fundamentales sobr[...]