2000年6月14日更新(新規作成)
  関谷トップページへ CGトップページへ   作者へのメッセージ

図形処理・計算処理実習No.9 Javaでのグラフィックス(4)中山第6章 Javaグラフィクス

2001.6.18 KPC 情報技術科  関谷

1. 前回のJavaグラフィックス(3)の復習とコメント

 slsでの軸測投影(河西 例題59)をJavaに移植して、マウスドラッグ(イベント処理)によるグラフィックスを実習した。

1.1 Glibwvクラス

 GlibwvのメソッドWindow() とView()を使って、スケール変換・移動により描画している。(SetPoint, MoveToメソッドの使用)。このGlibwvクラスのメソッドを使うには、最初に、Window() とView()を指定しておく必要がある。

1.2 マウスのイベント処理

 アプレットで、ボタンやテキストフィールド、チョイスボタンなどを使用した。
 (注)山本芳人,Javaによる図形処理入門,工学図書,1998.3,pp.205-208などを参照した。Webページにも、これらのAppletがあり、イベント操作が体験できる。さらに、それらのJavaソースも見れる。)
   中山のテキストの以下を参照した。あるいは、WebのJava関連のページでもよい。
 第5章の2.3マウスイベント処理などを参照のこと。マウスのイベントは2種のリスナーがある。

1.3 C言語から移植・改造した軸測投影appletプログラムの実行

 原点を固定して、マウスの水平方向のドラッグでの移動量で、y軸回りの回転量として、上下方向のドラッグでの移動量をx軸回りの回転量としている。移動の途中の描画をしているので、マウスの動きに追随している。

1.4 移植・改造した軸測投影appletソースプログラム

 ソースプログラムkace59m.javaは、こちらを参照のこと。

1.5 実習の課題

 軸測投影appletプログラムをまず、動かしてみる。次に中身を解析して、改造を行う。
このプログラムの動作確認や解析だけならば、このWebページから、できる。
改造するには、ファイルサーバからコピーして、編集・コンパイルなどをして各自のフォルダで動作させること。

1.6 Webレポートへのコメント

 Javaのプログラム構造を考察すること。(クラスやイベント処理)
 そして、今回のマウスによる軸測投影の回転プログラムの改造をする。あるいは、逆の順序でも良いが。
図形データを変えて、椅子を線画、ソリッドで作ってくれた人たちが居た。データを変える事で、投影の仕組みも分かってきたのではないでしょうか。

 C言語とJava言語との比較の考察も欲しい。
 機能の違いでは、C言語のときには、パラメータの入力での表示を3枚としていた。Javaでは、マウスのドラッグに追随して回転させるようにした。このために、どのような工夫をしているだろうか?

 

2.今日の学習-Javaでのグラフィックス(4) 第6章 Java.awt.Graphics

 既に3回ほど、例題によるJavaグラフィックスを学習してきたが、ここで、詳しくJava.awt.Graphicsをテキスト第6章を参考に学習する。このテキストでは、マウス操作でのインタラクティブな例題が多い。

既に、テキストのJavaプログラムでの例題のファイル(サーバにコピーしたもの)を紹介している。index.htmlファイルで目次ページになっているので、Javaでの実行画面例とjavaソースリストが見れる。今後は、これを参照しながら、学習していく。

ピクセル操作(直線、リサージュ図形、立体的な点描、スプレー描画)
ドロウ操作(直線、多角形、長方形、折線、楕円と楕円弧、フィル操作、フォント操作)

6.1 ピクセル操作

6.1.1 直線をピクセルで描く

 点を描くメソッドは用意されていないが、drawLine()、drawRect()で描ける。例題E1(直線は点集合)では、drawLineでの点を使って点や線を描いている。 (わざわざ、点の集合で直線を描く必要はないであろうが。)

6.1.2 リサージュ図形を描く

 曲線も点の集合であるので、三角関数を用いて曲線を描ける。

Mathクラスとその使い方−staticメソッドなので、Math.メソッド名(引数)で使う。引数の単位はラジアンで、πはMath.PIでフィールドとして定義されている。

 リサージュ図形は、x、y方向にそれぞれ波の振動をしている点を組み合わせたもの。例題E2では、周期を変える事で6パターンを描いている。

6.1.3 立体的な点描

 例題E3.java:ピクセルで立体球を描く。平方根や階乗の数学的関数を用いて立体的な点描画のユーザ定義のfireball()メソッドを作成して、パラメータを変えてpaint()メソッドで呼び出している。ローカル変数a,b,cを変えると、光の方向などを変えることが可能。いろいろと試してみよう

 GraphicsE3p.java:fireball()メソッドのローカル変数から、クラスのstatic変数に変えて、main()の引数から代入すると、実行時点でこれらのパラメータを指定できる。
この例は、コマンドライン引数の受取り方を示している。(サン・マイクロシステムズ、Javaプログラミング講座、アスキー、1996、pp.214-215を参照した。)

 GraphicsE3pt.html:fireball()のApplet兼アプリケーションプログラムである。参照した本は、有賀妙子・竹岡尚三著、Java1.1プログラミング、ソフトバンク、1997,pp.161-164などである。
 コマンドライン引数とhtmlファイルでのパラメータ指定、テキストフィールドでの更新とボタンによる再描画などを組み合わせている。ソースプログラムGraphicsE3pt.javaはここをクリックする。

6.1.4 ピクセルでスプレー描画を作成く

 お絵かきツールなどでは、マウスをクリックすると、スプレー缶でペンキを塗るように、無数の点をランダムに散らばらせて霧状に描くことができる。これに挑戦する。
 スプレーの太さ:描画範囲を変える->スクロールバーのスライダーによる。 ただし、イベントが発生してもrepaint()を呼ばない方が良いと思われる。(adjustmentValueChanged()メソッドでは、repaint();をコメントにする。)
 スプレー缶から霧を発生させる:マウスのクリック位置やドラッグ位置を取得する

6.2 ドロウ操作

6.2.1 直線を引く

 フレームの境界サイズ、描画領域の取得をして、フレーム描画領域に合った模様を描く。

例E5.java 描画領域に合わせて、ダイヤモンド模様

 例E5.javaは、描画領域に合わせて、ダイヤモンド模様をdrawLine()メソッドで描く。窓の大きさを変えると、それに追随して再描画する。

例E6.java オシロスコープにsigmoid関数

 例E6.javaでは、方眼紙(orオシロスコープ)のような画面に、sigmoid関数func1()とfunc2()をメソッドにして、描く。

例E7.java ローレンツ曲線を陰線処理

 例E7.javaでは、ローレンツ曲線を陰線処理して、描画している。(手前から描くときに、座標の最大値と最小値を記憶して、この範囲内なら表示しないで、範囲外なら表示すると共に更新する。)

(3次元の軸測投影は、No.3での回転で学習した。ここでは、-y軸まわりとX軸回りの回転量angleを同じにして計算している。ただし、yの計算式の最後から2つ目cos(-a)をsin(a)に変更すること。)

例E8.java インタラクティブ・放射状線群描画

 例E8.javaでは、マウスをクリックすれば、その点が中心になり、そのままドラッグすれば直線を連続的に描くアプリケーションを作成。ここでは、paint()メソッドの代わりに、getGraphics()メソッドでGraphicsオブジェクトを取得し、そのオブジェクトで描画している。

6.2.2 多角形を描く

 閉じた多角形を描くために、drawLine()メソッドで繋ぐのは大変であるので、drawPolygon()メソッドを使う。座標配列の指定かPolygonオブジェクトの指定による。

例E9.java drawPolygon(8角形を描く-5度ずつ回転も)

例E10.java drawPolygon(マウスでクリックされた点で3角形)

6.2.3  長方形を描く

 drawRect()メソッドで長方形を描く。左上角の始点のx、y座標と幅と高さを引数とする。drawRoundRect()は角丸めの長方形。draw3DRect()は立体的な長方形。

例E11.java 額縁の作成drawRect()

例E12.java 色付きのボタンの作成draw3DRect()

6.2.4  折れ線を描く

 drawPolyline()メソッドで折れ線を描く。X座標の整数配列、y座標の整数配列、頂点の数を引数とする。自動的には閉じない。

例E13.java 自由曲線描画ツールdrawPolyline()

点のデータはすべてPolygonオブジェクトが保持しているので、フレームサイズを変えて再描画すると、前に描画したものが再現できる。

6.2.5  楕円と楕円弧を描く

 drawOval()メソッドで円と楕円を描く。左上のX座標、y座標、幅と高さを引数とする。

例E14.java マウスがクリックされると楕円の中心点を決め、ドラッグされると半径として楕円を描く。中心点から45度の方向で円とする。

6.3 フィル操作(塗りつぶし)

6.3.1 長方形の塗り込み

 fillRect(), fillRoundRect(), fill3DRect()

例E15.java 複合ボタンfill3DRect()

6.3.2 オリジナルボタンの作成

例E16.java オリジナルボタンfillPolygon()

6.3.3 楕円の塗り込みfillOval()

例E17.java グラフィックス 楕円の塗り込みfillOval()

このプログラムは、対話型ではない。

6.3.4 RGBカラーバーによるボタン色の最適化ツール

例E18.java RGBカラーバー

6.4 フォント操作

6.4.1 フォント

例E19.java Javaフォントリスト

6.4.2 フォント属性

例E20.java Javaフォント属性の調整

6.4.3 リリーフ文字、リリーフ座標

例E21.java リリーフ線・文字

3 実習課題とレポート

3.1 実習課題

テキスト6章の解説を読み、例題をコンパイルし、実行してみる。
それらの中で、皆さんの興味を持った例を詳しく解析し、改造しなさい。
レポートには、それらの中から、appletに変更して、ハイパーリンクのこと。
javaソースと実行できるappletのほかに、考察をhtmlファイルには追加すること。
(注1)Appletプログラムの作り方については、前3回のプログラム例を参考にするとよい。init()メソッドで初期化するほかに、htmlファイルで、窓のサイズを指定している。テキストフィールドでインタラクティブに変えるようにすれば、変化のあるWebページとなる。

(注2)Webページの形式として、左上に、テキスト名、プログラム名、氏名番号などのタイトル行、さらにパラメータの表示行などを追加すること。

3.2 Webページでのレポート提出

 前回と同様で、appletタグを持つhtmlファイルへのハイパーリンクとする。(インタラクティブなプログラムでのイメージの貼り付けは、望ましくない。)