Creando grilla para proyección isométrica

Gráficos en Java

Hace algunos años cuando empecé a interesarme en los temas de programación, recuerdo que no sabía exactamente por dónde empezar y cual era el tema que estaba bien aprender, y también por aquel tiempo solía visitar regularmente una de las bibliotecas más grandes de Latinoamérica que hay aquí en México: la Vasconcelos. Así que un buen día me decide por investigar si había una zona específica en la biblioteca sobre temas de programación, y bueno aunque era obvio que había una zona de estantes, mi ignorancia me llevó a hacer una búsqueda en una de las pc’s del recinto. Ya habiendo ubicado más o menos el departamento me dirigí hacia ahí y recuerdo que uno de los primeros libros que tomé fue uno totalmente dedicado a hablar sobre programación en C#(el título del libro es C# para estudiantes de los autores Douglas Bell Mike Parr).Recuerdo que lo abrí en una de las páginas que hablaba sobre como programar algunos gráficos sencillos, y lo que más me llamó la atención fue el ver algunos gráficos de ejemplo pintados sobre una de las páginas del libro y que estaban hechos a partir de las llamadas a algunas de las funciones de la API de gráficos de este lenguaje. Y bueno, recordé esto debido a que hace unos días estaba viendo una hoja con una malla pintada que sirve como recurso para pitar isométricos y que tenía botada entre las páginas de un libro, pero que ese día por estar buscando yo algunas cosas la encontré y echándole un vistazo detenidamente me percate que había cierto patrón en las líneas en diagonal que se entrecruzan en sentido opuesto, así que se me abrió más la curiosidad y procedí a medir los puntos en las coordenadas x e y que se forman entre punto y punto en línea diagonal, ¿y cual fue mi sorpresa? que entre cada punto de x e y por cada línea había una distancia de separación igual. Antes ya había pintado algo parecido sobre un JPanel en Java, pero con otra técnica en la que me sirvió aplicar el teorema de Pitágoras, sólo que ese programita en Java lo perdí cuando extravíe una usb(trataré de recordar como lo hice porque en esa ocasión estaba, precisamente estudiando el teorema de Pitágoras y se me ocurrió aquella vez que lo podía aplicar sobre un gráfico). En esta ocasión me dio curiosidad por ver como java pintaba cada una de las líneas desde un extremo del punto y al punto x que están determinados en base al tamaño del lienzo que para este caso es el componente jpanel de la librería gráfica de Java. Así que si estás leyendo esto y te cuesta imaginar de lo que te estoy hablando y además te gusta el lenguaje de programación en Java, te dejo el código para que lo reproduzcas en tu pc, primero el código de lo que ha de pintar el jpanel:

package paint;

import java.awt.Color;
import java.awt.Graphics;

import javax.swing.JPanel;

/**
 *
 * @author OseChez
 */
public class Isometrico extends JPanel{
    public Isometrico(){
        setBackground(Color.gray);
    }

    @Override
    public void paint(Graphics g) {
        g.setColor(Color.green);
        int xBase = 0;
        int yBase = 0;
        int xIni = 14;
        int dx = 20;
        int yIni = 10;
        int dy = 10;
        g.setColor(Color.green);
        int xmirrBase= 1100;
        int xmirrIni = 1086;
        int ymirrIni = 10;
        int mdy = 10;
        for(int i =0; i < 141; i++ ){
          if(i < 1) 
           g.drawLine(xIni, yBase, xBase, yIni);
          else{
           g.drawLine(xIni + dx, yBase, xBase, yIni + dy);  
           dx = dx + 14;
           dy = dy + 10;
          }
         }
         
        for(int i =0; i < 141; i++ ){
          if(i < 1) 
           g.drawLine(xmirrIni, yBase, xmirrBase, ymirrIni);
          else{
           xmirrIni -=14;
           g.drawLine(xmirrIni, yBase, xmirrBase, ymirrIni + mdy);  
           
           mdy = mdy + 10;
           }
         }
    }
}

Aquí lo más importante de saber es que los componentes java son un objeto y que por lo tanto heredan métodos de la clase base o padre jcomponent y que te permiten sobrescribir el método Paint, el cuál recibe como parámetro virtual un objeto Graphics, que es el que invoca las funciones de pintado sobre el lienzo, así que cuando quieras crear un componente propio deberías invocar tu lógica principal de pintado sobre el método Paint

Ahora la clase main para invocar nuestro componente gráfico:

package grilla3d;

import java.awt.BorderLayout;
import java.awt.Color;
import java.awt.Container;
import javax.swing.JFrame;
import paint.*;
/**
 *
 * @author OseChez
 */
public class Grilla3D extends JFrame{

    /**
     * @param args the command line arguments
     */
    public static void main(String[] args) {
        new Grilla3D().setVisible(true);
    }
    public Grilla3D(){
        setBackground(Color.gray);
        setDefaultCloseOperation(EXIT_ON_CLOSE);
        setLayout(new BorderLayout());
        setSize(500, 500);
        Container c = getContentPane();
        
        c.add(new Isometrico(),BorderLayout.CENTER);
    }
}

Si te detienes un poco a estudiar el código escrito dentro del método Paint, verás que el bloque iterativo para las líneas en diagonal que van desde el punto y izquierdo del lienzo al punto x de la parte superior del lienzo aumenta en la misma proporción debido a un dato constante asignado a las variables dx y dy respectivamente más un aumento que se suma a cada una de ellas, por lo que en un principio pensé que se podía reproducir este bloque de código para crear las líneas en sentido opuesto, pero pasa algo extraño y se muestra todo mal, así que tuve que aplicar algunos cambios:

for(int i =0; i < 141; i++ ){
          if(i < 1) 
           g.drawLine(xmirrIni, yBase, xmirrBase, ymirrIni);
          else{
           xmirrIni -=14;
           g.drawLine(xmirrIni, yBase, xmirrBase, ymirrIni + mdy);  
           
           mdy = mdy + 10;
          }
        }

El mundo de los gráficos en computadora es sumamente interesante, pero que puede llegar a ser muy complejo en la medida de los tipos de gráficos que quieras tratar, reproducir o crear en una pantalla de ordenador. Si tiene gusto por las matemáticas y eres sesudo para ellas y además te llama la atención el mundo de los gráficos creados por ordenador, entonces no dudes en que podrías especializarte en este campo que es utilizado en muchos ámbitos de la programación informática. Te comento lo anterior debido a que quizá te llame la atención la programación y apenas vayas empezando a aprender, y que tal vez no sepas que temas estudiar, así que si eres bueno(a) para las mates, no dudes en estudiar mucho este tema(gráficos por computadora), ya que es aplicable a muchos tipos de programación, ya sean videojuegos, tratamiento de imágenes, creación de componentes para gui de usuario, formas cad, etc. Hasta el próximo post.

Hola, Gracias por visitar mi blog. He querido compartir este blog a través de GitHub. Es bienvenido todo el que quiera contribuir o mejorar este sistema de blog. Tus comentarios serán de mucha utilidad, si descargas el proyecto y tienes alguna duda sobre como echarlo a andar, no olvides que me puedes localizar en vuesongosechez@gmail.com o dejáme un Comentario