オブジェクト指向人工生命体52010/11/07 01:11

Warmらしくする

1.線画で描く
 表示はできるようになりました。で、○を描いたってしょうがないのでWarmらしきものを描きます。
 まずは線画チックに描きます。これは、特に問題ないと思います。
public class Warm {

    int x = 50;
    int y = 50;
    int width = 30;
    int height = 30;
    Color warmColor = Color.black;
    
    public void DrawWarm(Graphics g) {
        g.setColor(warmColor);
        // 体
        g.drawOval(x, y, width, height);
        // 目
        g.drawOval(x+1, y-8, 10, 10);
        g.drawOval(x+19, y-8, 10, 10);
        // 瞳
        g.fillOval(x+5, y-5, 4, 4);
        g.fillOval(x+22, y-5, 4, 4);
    }
}

2.テクスチャの貼り付け
 で、PCの能力は線画くらいじゃ何ともないので、テクスチャを貼りつけてみます。
 まずは、テクスチャを準備して(50×50のPNGでOKです)srcの下にresourseフォルダを作成し、インポートします。
 で、コードは次のようになります。
    public void DrawWarm(Graphics g) {

        //①  Graphics を Graphics2D に
        Graphics2D g2 = (Graphics2D)g;
        
        //②  BufferedImageの作成
        BufferedImage bi = null;
        try {
        bi = ImageIO.read(getClass().getResource("/resources/bodyCol01.png"));
        } catch(Exception e) {
            e.printStackTrace();
        }

        //③  Rectangle2D.Doubleの作成
        Rectangle2D.Double rec2DD = new Rectangle2D.Double(0, 0, bi.getWidth(), bi.getHeight());

        //④  BufferedImage と Rectangle2D.Double から TexturePaint を作成
        TexturePaint texture = new TexturePaint( bi, rec2DD );

        // テクスチャをセット
        g2.setPaint(texture);
        // 体
        Ellipse2D.Double ell2DDbody = new Ellipse2D.Double(x, y, width, height);
        g2.fill(ell2DDbody);
        // 目
        g2.setPaint(Color.white); // この時点でテクスチャから単色へ
        Ellipse2D.Double ell2DDeyeL = new Ellipse2D.Double(x+1, y-8, 10, 10);
        Ellipse2D.Double ell2DDeyeR = new Ellipse2D.Double(x+19, y-8, 10, 10);
        g2.fill(ell2DDeyeL);
        g2.fill(ell2DDeyeR);
        // 瞳
        g2.setPaint(Color.green);
        Ellipse2D.Double ell2DDpupL = new Ellipse2D.Double(x+5, y-5, 4, 4);
        Ellipse2D.Double ell2DDpupR = new Ellipse2D.Double(x+22, y-5, 4, 4);
        g2.fill(ell2DDpupL);
        g2.fill(ell2DDpupR);
    }
解説①
 Graphicsクラスではテクスチャを扱う事が出来ません。そこでGraphics2Dクラスを使います。Graphics2DクラスはGraphicsクラスを拡張したもので、色々と機能追加されています。
 …で、ここではGraphicsクラスgをキャストしてGraphics2Dクラスg2にしてます。ところが、実際にプログラム上でこんなことをしてもクラスは変わりませんし、基本中の基本的NGです。
 …が、このコーディングがOKの場合があります。それは、元々gがGraphics2Dクラスだった場合です。
 …で、実はGraphics2Dなんです。なんか、旧バージョンとの互換性云々…とのことです。わかりづらっ(-_-;)
 …で、ついでに言うと、ソースコードの下の方の『目』や『瞳』の図形の描き方が線画の時と変わってますが、これは、テクスチャを貼るから変わったんじゃなくて、Graphics2Dになったため使用するメソッドを変えたものです。
 Graphics2Dを使うので、Graphics2Dの図形描画の方法に従いました。そうしないと、Graphics2Dでしか描けない図形とGraphicsでも描ける図形のメソッドが変わってしまい、スーパークラスと同じ『描く』行為が別メソッドになり、オブジェクト指向的に…乗り物クラスと自動車クラスは…どちらも走る…省略っ^^;
解説②③④
 この連続技でテクスチャを作成します。
 ②でPNG画像を読み込んでBufferedImageを作成します。
 ③でBufferedImageの大きさを取得します。
 ④でイメージと大きさを指定してテクスチャの完成です。

あとは、コードを見ていただければ、よろしいかと…。
あっ、それから、目の白が目立たないんで背景を濃くしました。これはVisualEditorで変えました。

次回は、Warmをいろんな方向に向けたり…かな?

java,描画,テクスチャ,TexturePaint,Graphics2D,setPaint,BufferedImage,ImageIO

コメント

コメントをどうぞ

※メールアドレスとURLの入力は必須ではありません。 入力されたメールアドレスは記事に反映されず、ブログの管理者のみが参照できます。

※なお、送られたコメントはブログの管理者が確認するまで公開されません。

※投稿には管理者が設定した質問に答える必要があります。

名前:
メールアドレス:
URL:
次の質問に答えてください:
お手数をおかけしますが、スパム対策です。
以下に ”しゃしん” と入力してください。

コメント:

トラックバック