Primitivas da classe Canvas

A classe Canvas é uma classe para as aplicações que necessitam manipular eventos de baixo nível e realizar chamadas para desenhar no display.

De uma perspectiva de desenvolvimento da aplicação, a classe Canvas é permutável com classes padrão, assim, uma aplicação pode misturar e combinar Canvas com as telas de alto nível (high-level) quando preciso.
Por exemplo: Você pode criar uma interface comum e tratar as teclas que podem ser pressionadas nas respectivas telas, quem controla esse tratamento é a classe de baixo nível, Canvas.

A classe Canvas possui métodos para manipular ações de jogos, eventos de teclas e eventos de ponteiros (se suportado pelo dispositivo) e primitivas de desenho gráfico.

O método do paint() da Canvas, é declarado como abstract, sendo assim, a aplicação deverá sobrescrevê-lo, um objeto da classe Graphics que irá controlar o que irá ser exibido no canvas. O método repaint() serve apenas para atualizar a tela Canvas.

Desenhando objetos primitivos

Agora que já sabemos a estrutura de um canvas, vamos desenhar algo na tela, para isso iremos usar o objeto do tipo Graphics e aplicar sobre ele métodos pré-fabricados pelo J2ME que irão desenhar coisas simples na tela como strings, retângulos, arcos, triângulos, etc. Esses comandos ficarão dentro do método paint().

Desenhando uma linha

Para desenhar uma linha é simples, vamos usar o método drawLine() da classe Graphics, ele irá receber 4 atributos: o 1ª será o pixel x de onde a linha vai começar, o 2º será o pixel y de onde a linha vai começar, o 3º o pixel x onde a linha vai terminar, o 4º será o pixel y onde a linha vai terminar.

import javax.microedition.lcdui.*;

public class ClasseMeuCanvas extends Canvas {
public void paint(Graphics meuGrafico){
meuGrafico.drawLine(30, 40, 70, 90);
}
}

Desenhando um retângulo

Para desenhar um retângulo, vamos usar o método drawRect() da classe Graphics, ele irá receber 4 atributos: o 1ª será o pixel x de onde o retângulo vai começar, o 2º será o pixel y de onde o retângulo vai começar, o 3º será a largura em pixels do retângulo, o 4º será a altura em pixels do retângulo.

import javax.microedition.lcdui.*;

public class ClasseMeuCanvas extends Canvas {
public void paint(Graphics meuGrafico){
meuGrafico.drawRect(20, 30, 60, 70);
}
}

Desenhando um retângulo cheio

Você viu anteriormente como desenhar um retângulo na tela, só que no exemplo anterior esse retângulo era oco por dentro, ou seja, você só desenhou as bordas do retângulo, vamos agora fazer um retângulo totalmente pintado por dentro, para isso vamos usar o método fillRect() da classe Graphics, ele irá receber os mesmos atributos do método drawRect(): o 1ª será o pixel x de onde o retângulo vai começar, o 2º será o pixel y de onde o retângulo vai começar, o 3º será a largura em pixels do retângulo, o 4º será a altura em pixels do retângulo.

import javax.microedition.lcdui.*;

public class ClasseMeuCanvas extends Canvas {
public void paint(Graphics meuGrafico){
meuGrafico.fillRect(20, 30, 50, 60);
}
}

Desenhando uma String

Vamos desenhar uma string, note que não vamos simplesmente colocar a string na tela, vamos desenhá-la, apesar disso o J2ME já vem com uma fonte string padrão para o Canvas. Vamos usar o método drawString() da classe Graphics, ele irá receber 4 atributos: o 1º será o texto da string, o 2º será o pixel x de onde vai ser desenhado, o 3º será o pixel y de onde vai ser desenhado, o 4º será a "raiz" do objeto, ou seja, onde será a referência dos pixels x e y.

import javax.microedition.lcdui.*;

public class ClasseMeuCanvas extends Canvas {
public void paint(Graphics meuGrafico){
meuGrafico.drawString("Texto da string", 50, 100, Graphics.LEFT|Graphics.TOP);
}
}

Nesse caso a raiz do pixel x está no ponto esquerdo do objeto (Graphics.LEFT), e a raiz do pixel y está no ponto acima do objeto (Graphics.TOP). Você também pode colocar a raiz do pixel x na direita (Graphics.RIGHT) ou no centro (Graphics.HCENTER), e a raiz do pixel y na parte de baixo (Graphics.BOTTOM) ou no centro (Graphics.VCENTER).

Colocando uma cor

Você pode setar cores para desenhar objetos com cores diferentes, para isso use o método setColor() da classe Graphics entrando como parâmetro os valores das cores vermelho, verde e azul respectivamente.

import javax.microedition.lcdui.*;

public class ClasseMeuCanvas extends Canvas {
public void paint(Graphics meuGrafico){
meuGrafico.setColor(255, 0, 0);
meuGrafico.drawRect(50, 50, 20, 30);
}
}

Pegando uma cor

Para pegar uma cor vamos utilizar o método getColor() da classe Graphics que irá retornar um inteiro com os valores RGB agrupados.
Primeiro vamos criar a variável inteira que irá armazenar a cor.

import javax.microedition.lcdui.*;

public class ClasseMeuCanvas extends Canvas {
int corPega;
public void paint(Graphics meuGrafico){
}
}

Agora vamos setar alguma cor através do método setColor().

import javax.microedition.lcdui.*;

public class ClasseMeuCanvas extends Canvas {
int corPega;
public void paint(Graphics meuGrafico){
meuGrafico.setColor(255, 128, 64);
}
}

Agora vamos utilizar o método getColor(), e armazenar o resultado na variável corPega.

import javax.microedition.lcdui.*;

public class ClasseMeuCanvas extends Canvas {
int corPega;
public void paint(Graphics meuGrafico){
meuGrafico.setColor(255, 128, 64);
corPega = meuGrafico.getColor();
}
}

O valor obtido na variável corPega é equivalente ao número hexadecimal agrupado FF, 80, 40 que se traduz em inteiro como 255, 128, 64.

Abaixo segue um código fonte completo usando canvas, mostrando o que vimos até agora.

import javax.microedition.midlet.*;
import javax.microedition.lcdui.*;

public class PrimitivasCanvasMidlet extends MIDlet implements CommandListener{
private Display display;
private List list;
private Command cmdok, cmdexit;
private CanvasDraw canvasDraw;
int listItemIndex;

public PrimitivasCanvasMidlet(){
canvasDraw = new CanvasDraw();
display = Display.getDisplay(this);
list = new List("Primitivas em Canvas", List.IMPLICIT);
cmdok = new Command("Mostrar", Command.OK, 2);
cmdexit = new Command("Sair", Command.EXIT, 2);
list.append("Linha", null);
list.append("Retângulo", null);
list.append("Retângulo Arredondado", null);
list.append("Arco", null);
list.append("Triângulo", null);
list.addCommand(cmdok);
list.addCommand(cmdexit);
list.setCommandListener(this);
}

public void startApp(){
display.setCurrent(list);
}

public void pauseApp(){}

public void destroyApp(boolean unconditional){
notifyDestroyed ();
}

public void commandAction(Command c, Displayable d){
listItemIndex = list.getSelectedIndex();
if(c == cmdok){
display.setCurrent(canvasDraw);
}else if(c == cmdexit){
destroyApp(true);
}
}

class CanvasDraw extends Canvas implements CommandListener{
Command back;

public CanvasDraw(){
back = new Command("Voltar", Command.BACK, 1);
addCommand(back);
setCommandListener(this);
}

public void paint(Graphics g){
g.setColor(0, 0, 0);
g.fillRect(0,0, getWidth (), getHeight ());
g.setColor(0, 0, 255);

if(listItemIndex == 0){
 g.drawString("Linha".toUpperCase(), getWidth () / 2, 5, Graphics.HCENTER |
         Graphics.TOP);

 g.drawLine(getWidth()/4, 100, 3 * getWidth()/4, 100);
}

if(listItemIndex == 1){
 g.drawString("Retângulo".toUpperCase(), getWidth()/2, 5, Graphics.HCENTER |
 Graphics.TOP);

 g.fillRect(getWidth () / 4, 100, getWidth() / 2, 40);
}

if(listItemIndex==2){
 g.drawString("Retângulo Arredondado".toUpperCase(), getWidth () / 2, 5,
 Graphics.HCENTER | Graphics.TOP);

 g.fillRoundRect(getWidth () / 4, 100, getWidth () / 2, 40, 30, 40);
}

if(listItemIndex == 3){
 g.drawString("Arco".toUpperCase(), getWidth () / 2, 5, Graphics.HCENTER |
 Graphics.TOP);

 g.fillArc(getWidth () / 4, 100, 90, 90, 180, 270);
}

if(listItemIndex == 4){
 g.drawString("Triângulo".toUpperCase(), getWidth () / 2, 5, Graphics.HCENTER |
 Graphics.TOP);

 g.fillTriangle(getWidth() / 4, 100, 90, 90, 100, 180);
}
}

public void commandAction (Command c, Displayable d){
if(c == back){
 display.setCurrent(list);
}
}
}
}