Canvasクラスで図形を描画する

Canvasについて

Panelを使ったiアプリは、基本的に「コンポーネントを組み合わせて画面を作る」というものでした。が、実際にはこうしたiアプリはそれほど多くはないでしょう。特にエンターテイメント系のものは、グラフィックを中心とした表示が多いはずです。

こうしたグラフィックを使って表示を作るタイプのものでは、Panelは使いません。「Canvas」と呼ばれるコンポーネントを使います。Java SEのAWTにもCanvasクラスはありましたが、こちらはそれとは違うcom.nttdocomo.uiパッケージのCanvasです。

このCanvasには、AWTと同様にpaintメソッドが用意されており、これをオーバーライドして描画のための処理を作成します。このメソッドは引数にGraphicsインスタンスが渡されますので、このGraphics内のメソッドを呼び出して描画を行うことができます。基本的な描画の方法は、AWTと非常に似ていますね。ただし、まったく同じではありません。この点、注意が必要です。

では、簡単なサンプルを作成してみましょう。SampleIAppアプリケーションクラスから、MainCanvasというCanvasクラスを利用して画面表示をするサンプルを考えてみることにしましょう。

import com.nttdocomo.ui.*;

public class SampleIApp extends IApplication {

  public void start() {
    Display.setCurrent(new MainCanvas(this));
  }
}

class MainCanvas extends Canvas {
  IApplication iapp;
  
  MainCanvas(IApplication app){
    super();
    this.iapp = app;
  }
  
  public void paint(Graphics g) {
    g.setColor(Graphics.getColorOfRGB(0, 0, 255));
    g.fillRect(10, 10, 100, 100);
    g.setColor(Graphics.getColorOfRGB(255, 0, 0));
    g.fillArc(50, 50, 100, 100, 0, 360);
    g.setColor(Graphics.getColorOfRGB(0, 255, 0));
    g.setFont(Font.getFont(Font.SIZE_MEDIUM));
    g.drawString("This is Canvas", 10, 150);
  }
}