グラフィックを描こう！ (5/9)

では、描画処理を順に見ていきましょう。ここでは「背景色の設定」「青い四角形の描画」「赤い円の描画」という順に描画をしています。

c.drawColor(Color.BLACK);

まず、背景色の設定からです。これは「drawColor」を呼び出して行います。色の値は、Color.BLACKを指定していますね。これは、黒の値を示すクラスフィールドです。Colorクラスには、よく使われる色の値として、あらかじめ以下のようなクラスフィールドが用意されています。

BLUE CYAN DKGRAY GRAY GREEN LTGRAY
MAGENTA RED TRANSPARENT WHITE YELLOW

続いて、青い四角形を描画します。まず、描画に必要な属性を設定するPaintインスタンスを作成し、それに塗りつぶし方式と、使用する色を設定します。

Paint fill_paint = new Paint();
fill_paint.setStyle(Paint.Style.FILL);
fill_paint.setColor(Color.BLUE);

「setStyle」が、描画スタイルを設定するものです。ここではPaint.Style.FILLを指定して、図形の内部まで塗りつぶす方式に設定しています。この他、「STROKE（線のみ描画）」「FILL_AND_STROKE（塗りつぶしと線を描画）」が用意されています。

「setColor」は、描画に使われる色を設定するものです。これで、青い色で図形が描かれるようになります。準備が整ったら、描画を行います。

c.drawRect(100f, 100f, 200f, 200f, fill_paint);

「drawRect」は、四角形を描くメソッドです。引数には描く図形の左上、右下の横・縦位置と、使用する属性を収めたPaintインスタンスが渡されます。続いて、円の描画です。

fill_paint.setColor(Color.RED);
c.drawOval(new RectF(0f, 0f, 100f, 100f), fill_paint);

先ほどのPaintインスタンスをまた再利用します。「setColor」で描画に使う色を赤に変更し、それから「drawOval」で円を描きます。このdrawOvalは、RectFクラスで描く領域を指定し、これとPaintメソッドを引数に渡して呼び出します。

RectFというクラスは、四角い領域を指定するのに用いられるもので、領域の左側・上側・右側・下側の４つの位置（左および上からどれだけ離れているか）をfloat値で指定してインスタンスを作成します。同様のものに、int値で位置を指定するRectもあります。

(by. SYODA-Tuyano.)

※リストが表示されない場合

AddBlockなどの広告ブロックツールがONになっているとリストなどが表示されない場合があります。これらのツールをOFFにしてみてください。

public void onDraw(Canvas c) {
    c.drawColor(Color.BLACK);
    
    Paint fill_paint = new Paint();
    fill_paint.setStyle(Paint.Style.FILL);
    fill_paint.setColor(Color.BLUE);
    c.drawRect(100f, 100f, 200f, 200f, fill_paint);


    fill_paint.setColor(Color.RED);
    c.drawOval(new RectF(0f, 0f, 100f, 100f), fill_paint);
}