Dibujando en Canvas 2

Hola. Hoy seguiremos mostrando cuales son las demás primitivas gráficas para dibujar.

1 - Ya tenemos nuestra clase que hereda de Canvas y por supuesto nuestro MIDlet:

import java.io.IOException;
import javax.microedition.lcdui.Canvas;
import javax.microedition.lcdui.Graphics;
import javax.microedition.lcdui.Image;

public class Dibujando extends Canvas {

    Image imagen;

    public Dibujando() {
        try {
            imagen = Image.createImage("/book.png");
        } catch (IOException ex) {
        }
    }

    protected void paint(Graphics g) {
       
    }

}

2 - Como pueden ver en nuestro código hemos creado una imagen para después poder pintarla en pantalla:

Creamos una atributo de tipo Image donde se almacenara la imagen en memoria.
Dentro del constructor de nuestra clase abrimos la imagen para esto, desde la clase Image tenemos un método:

Image.createImage("/book.png")

Este método recibe como parámetro un String que seria la ruta de la imagen, como nuestra imagen esta en la carpeta raíz del proyecto ponemos "/" si la imagen estaría en la carpeta res seria: "/res/book.png".

Esta instrucción debe ir en un bloque try-catch, ya que esto puede generar un error al no poder encontrar o abrir la imagen.

3 - Ya tenemos nuestra clase y la imagen abierta, empecemos a dibujar:

// Pintamos todo el fondo de Blanco
g.setColor(0xFFFFFF);
g.fillRect(0, 0, getWidth(), getHeight());

Hemos pintado todo el fondo de la pantalla de blanco. Esto se hace porque en algunos teléfonos, el fondo no se pinta solo y nos dejara lo ultimo que teníamos en pantalla.

4 - Seteamos el color que utilizaremos para dibujar:

// Ponemos el color en Negro
g.setColor(0x000000);

Así sencillo podemos cambiar de color en cualquier momento.

5 - Dibujando nuestro primer circulo sin relleno:

// Dibujando un Circulo sin Relleno
g.drawArc(10, 10, 50, 50, 0, 360);

Este método recibe los mismo parámetros que el fillArc que nos permite dibujar círculos rellenos.


* int x : Coordenada X donde empezar a dibujar el circulo.
* int y: Coordenada Y donde empezar a dibujar el circulo.
* int width: Tamaño de ancho del circulo.
* int height: Tamaño de alto del circulo.
* int startAngle: El angulo donde comenzara el circulo.
* int arcAngle: El total hasta donde llegara el circulo.

6 - Dibujamos nuestra imagen:

g.drawImage(imagen, 30, 30, Graphics.TOP | Graphics.LEFT);

* Image imagen : Imagen que dibujaremos.
* int x : Coordenada X donde empezar a dibujar.
* int y : Coordenada Y donde empezar a dibujar.
* int anchor : Como se dibujara la imagen.

7 - Dibujar una linea

g.drawLine(60, 60, 60, 120);

* int x1 : Coordenada X del punto 1.
* int y1 : Coordenada Y del punto 1.
* int x2 : Coordenada X del punto 2.
* int y2 : Coordenada Y del punto 2.

Aquí se unirán esos dos puntos para formar la linea.

8 - Rectangulo sin relleno.

g.drawRect(70, 10, 50, 50);

* int x : Punto del ancho de la pantalla donde empezara a dibujar el rectángulo.
* int y: Punto del alto de la pantalla donde empezara a dibujar el rectángulo.
* int width: Tamaño de ancho del rectángulo.
* int height: Tamaño de alto del rectángulo.

9 - Dibujando Texto.

g.drawString("Java ME", 30, 122, Graphics.TOP | Graphics.LEFT);

* String texto : Texto que dibujaremos.
* int x : Coordenada X.
* int y : Coordenada Y.
* int anchor : Como dibujar el texto.

Y así ya tenemos casi todos los métodos que podemos utilizar para dibujar. Como pueden observar son pocos y nada muy complejos, Si quieren dibujar cosas mas avanzadas tendrán que pensar un poquito mas...

Les dejo el codigo completo:

import java.io.IOException;
import javax.microedition.lcdui.Canvas;
import javax.microedition.lcdui.Graphics;
import javax.microedition.lcdui.Image;

public class Dibujando extends Canvas {

    Image imagen;

    public Dibujando() {
        try {
            imagen = Image.createImage("/book.png");
        } catch (IOException ex) {
        }
    }

    protected void paint(Graphics g) {
        // Pintamos todo el fondo de Blanco
        g.setColor(0xFFFFFF);
        g.fillRect(0, 0, getWidth(), getHeight());

        // Ponemos el color en Negro
        g.setColor(0x000000);

        // Dibujando un Circulo sin Relleno
        g.drawArc(10, 10, 50, 50, 0, 360);

        // Dibujando un Imagen
        g.drawImage(imagen, 30, 30, Graphics.TOP | Graphics.LEFT);

        // Dibujamos una Linea
        g.drawLine(60, 60, 60, 120);

        // Dibujamos un Rectangulo sin relleno
        g.drawRect(70, 10, 50, 50);

        // Dibujamos un String
        g.drawString("Java ME", 30, 122, Graphics.TOP | Graphics.LEFT);
    }

}

Saludos
Maty...