Captura de pantalla 2013-02-10 a la(s) 11.45.33Si hay algo que me encanta es realizar graficos en Java, es entretenido y divertido, en lo personal claro, en esta ocasión quiero enseñarles algo muy sencillo de hacer, y es colocarle una imagen de fondo a un JPanel, o a un canvas (AWT), cada vez que se lo comento a algún amigo dice que se ve muy complicado, pero la verdad es muy sencillo de hacer.

Captura de pantalla 2013-02-10 a la(s) 11.23.51

Bien, para este ejercicio e realizado lo siguiente: 3 Paquetes, uno donde tengo la Gui, que en realidad es solo el JFrame, no contiene nada, uno donde tengo una clase llamada CustomPanel, y otro paquete donde coloqué la imagen, con esto, vamos a poder trabajar tranquilamente y sin ningún problema.

Lo primero que vamos a hacer, y en realidad lo único relevante, será redefinir el método paint de la clase JPanel, bueno, esto es sencillo, para esto hemos creado la clase CustomPanel, la clase CustomPanel es una clase que hace uso de la herencia para tomar todas las propiedades del JPanel original, o de unCanvas si asi se requiere, bueno, pero en este ejemplo vamos a trabajar con un JPanel para que no haya confusiones ni nada, bien, entonces, lo primero que haremos en la clase es agregarle el extends JPanel junto al nombre de la clase, esto hará que herede todo lo comentado anteriormente de la clase JPanel.

Bien, una vez hecho esto, lo que haremos será crear un objeto de tipo Image con nuestra imagen, la cual se encuentra alojada en un paquete dentro de nuestro proyecto, esto ya lo habíamos hecho con anterioridad en un post anterior, así que procederemos con el código, la unica diferencia es que en esta ocasión colocare el objeto Imagen como variable de alcance de clase. Como verán, ya tenemos el objeto image, el cual será el que dibujaremos como fondo en el JPanel, ahora solo nos queda redefinir el metodo paint del nuevo panel (CustomPanel), para esto creamos el metodo. Ahora bien, por ultimo, solo nos queda realizar el dibujo de la imagen, esto lo haremos con la instrucción g.drawImage que nos proporciona la libreria Graphics, ahora bien, el drawImage contiene varios constructores, el que nos interesa es el que recibe cinco parámetros, el primero, es el objeto image que va a dibujar, el segundo es la coordenada X de donde empezará el dibujo, recuerden que a la hora de hacer gráficos en java la coordenada Y esta invertida, es decir, si trazamos una línea de arriba abajo, Y en lugar de ir disminuyendo irá aumentando, el tercer argumento será el máximo de largo que tendra nuestra imagen, ahí como recomendación introduzcan getWidth(), que será el máximo del tamaño del panel, y en el cuarto será getHeight(), que representa el máximo de alto que tendra nuestro fondo, el ultimo parámetro representa el objeto sobre el cual se dibujará la imagen, es decir, nuestro CustomPanel(por eso el this), por ultimo, tenemos un setOpaque(False), este parametro es para que cuando nosotros coloquemos objetos sobre nuestro panel, este los muestre, si no colocamos la instrucción, nuestro panel siempre se verá por encima de los demas objetos, y por ultimo, tendremos que hablar al método de la super clase paint, para que en dado caso caso que agreguemos elementos a nuestro panel recuerde siempre pintarlos, ya que actualmente al estar reescribiendo el método no lo estamos haciendo. Y listo, técnicamente con esto, tenemos un nuevo Panel que tiene todas las propiedades de un JPanel común, pero con un fondo, bien, ahora solo nos queda una cosa,antes de probar la clase, tenemos que hacer dos cosas, primero que nada, hay que darle clic a nuestro proyecto y clickear en “limpiar y construir”, esto para que genere el jar necesario e introdusca la imagen, ahora, si posteriormente la cambian, tendran que volver a darle “limpiar y construir”, ahora, esto no es todo, daremos click derecho a la clase CustomPanel y seleccionaran “compilar”, despues de que compilen, jalen su clase hacia su JFrame como si fuera un componente de Swing y si todo sale bien verán como desde que el panel se posiciona en el JFrame, ya tieneel fondo que ustedes seleccionaron, solo ajustenlo a la ventana y listo. xD
Etiquetas:java
14

Quizá también te interese

Utilizando ES6 en tus aplicaciones Node
Creando dialogos personalizados en Java con JDIalog
Creando dialogos personalizados en Java con JDIalog
ECMAScript 6, lo nuevo.
Bower, un administrador de paquetes para la web
  • Giuseppe Vetri

    Seria genial si hubieses puesto como “Jalar la clase” hacia el jframe 🙁

    • atxy2k

      En realidad solo hacemos un drap and drop, despues de compilar nuestra clase, creamos una clase JFrameForm con netbeans, y le damos click derecho encima a nuestra clase, y sin soltar la arrastramos sobre el JFrameForm, y listo, si todo salio bien podremos ver nuestro panel pintado.

  • Jonathan Filgaira Cordón

    Oye, y si queremos hacer que la imagen del panel sea dinámica? ademas me gustaría saber si existe la posibilidad de cambiar la imagen en runtime desde dentro de la clase.
    PE: miclase.cambiarfondo()

    dónde cambiar fondo evalúa que imagen de fondo debería aparecer.

    Espero tu respuesta! muchas gracias por tu tiempo!!

    • atxy2k

      Claro que puedes cambiar la imagen en Runtime, seria sencillo, creas un hilo que reciba como parametro la clase de tu panel, y en el hilo señalas cada cuanto tiempo quieres que cambie por ejemplo, suponiendo que a eso te refieras con Dinámico, si no, explicame un poco mejor y claro que te echamos una mano, volviendo al “como volverlo dinamico” y haciendo que cambie desde un método dentro de tu clase, crea un hilo y allá colocas cada cuanto tiempo quieres que se cambie la imagen, y cuando la vayas a cambiar, lo único que tendrías que hacer sería tuclase.cambiarFondo() y luego, tupanel.repaint() y listo, con esto pintaria de nuevo con la nueva imagen.

    • Mxrck

      Como dice @atxy2k:disqus , claro que se puede, y no es difícil, recordemos que estamos usando el método paint del objeto ( estamos cambiando la forma en que se dibuja en pantalla ), es solo cuestión de permitirle elegir imagen en runtime y llamar a repaint.

      Es un poco parecido a hacer un juego, se actualizan posiciones de los elementos y se llama al repaint, pero eso es otra historia XD

      • Jonathan Filgaira Cordón

        muy buenos, muchísimas gracias, estaba que no avanzaba, al final con vuestra ayuda tengo la clase acabada.

  • VICTOR HERACLIO GARAY YAURI

    Felicitaciones!!

    Podrias postear un ejemplo de como hacer que el fondo se mueve conforme avance la nave o rectroceda. gracias.

    gyaurivictorher@crece.uss.edu.pe vgaraysoft@hotmail.com

  • Jatniel Josue Feliz Ferreras

    Saludos, he hecho todos los pasos, pero en la línea g. setOpaque(False) ; me sale False con error (cannot find symbol). Ayúdame por favor! Soy nuevo en esto.

    • Amilcar Yañez

      a mi también me sale el mismo error, que pena que no te hayan podido resolver :’c

      • Mxrck

        Parece que fue un error de dedo que cometió mi amigo @atxy2k:disqus , en vez de “False” es “false” sin comillas, ya que se está queriendo escribir el valor booleano.

        • Alexis Gutiérrez

          Aun asi me sigue saliendo error, que puedo hacer?

          • Mxrck

            Que error te aparece?

          • Alexis Gutiérrez

            Lo mismo de Jatniel, pero pude solucionarlo, no es g.setOpaque, es simplemente el setOpaque la solución

  • Yannatay Aurora Neira Hernande

    Te pasaste, me sirvio un monton y aprendi algo nuevo XD gracias!