夜空に輝く星

Since 2003.04.30

天に星、地に花、人に愛

表題のように、夜空に輝く星は美しいものの代表のひとつです。
古来、東洋における牽牛と織姫と天の川の話、西洋におけるオリオンとさそりの話など、星に思いを託して多くの物語、神話が語られてきました。
前回までの日の丸に変わり、今回からは星を題材に進めていきます。

イメージファイルを扱う

Star30.png 星のイメージファイル

星を描くとき、図形として取り扱って、描画関数を使うという方法もありますが、まずシンプルなプログラムから始めたいので、図形ファイルを使います。
上のイメージを保存したいのですが、入れ物を作っておきましょう。

java	サイトのルートディレクトリ
html	HTMLファイルを収容実際のサイトでは、トピックごとに分けた複数のサブディレクトリになる
images	イメージファイルを収容
net	Javaファイルを収容

通常Webサイトを作るとすれば、上記のようなフォルダ構成をとることが多いのではないでしょうか。
前回までは、net/sys5jp/basic/ にHTMLファイルも保存しましたが、実際のサイトイメージに近づくようにフォルダを新しく作ります。

「java」の下に「html」「images」の２つのフォルダを作ります。
上の星イメージを右クリックして「名前をつけて画像を保存」で「images」フォルダに「Star30.png」という名前で保存します。

イメージファイルを表示

最初は単にイメージファイルを表示するプログラムを作ります。同時に表示のためのHTMLファイルも作ります。
コードは、このページの一番下に表示します。イメージファイルの処理部分以外は、前回までと同様です。但し、「this.」は省略しました。
HTMLファイルを表示すると、次のようになります。これだけなら当然、「img」タグを使って直接画像表示したほうが、はるかに簡単ですね。

アプレットでイメージファイルを表示するためには、２段階の処理を行います。

31行目 getImage(getDocumentBase(), getParameter("starimage")); 22行目 g.drawImage(starImage, 0, 0, this);

まず、getImage でイメージファイルを取得します。このgetImage は、Applet のメソッドです。
getImage(URL url, String name) 画面に表示できる Image オブジェクトを返します。
実際の読み込みと描画は、Graphics クラスの drawImage の呼び出しで行われます。
drawImage(Image img, int x, int y, ImageObserver observer) 指定されたイメージの現在利用可能な部分を描きます。
と説明すると、説明の中に又新しい説明を要する言葉が出てきます。

イメージファイルの取得

Javaアプレットのプログラム外とのやり取りについて、param を使う方法は、既に出てきました。param の場合は、Webブラウザのタグですから、統一的な取り扱いは簡単です。
これに対して、イメージファイルの場合は、ＨＤ等の中にＯＳの管理下で保存されているものです。Applet と Image は、それぞれ独立ファイルですから、相互の関係を、ＯＳ・物理媒体・保存位置などが絶対的制約とならないよう表現できる方法が必要です。
そのために、getImage では、実行環境における絶対位置の取得と、そこからアクセスできる相対的なファイル名の組み合わせで、イメージファイルを指定できるようにしています。

getImage(URL url, String name)

引数が２つありますが、通常どちらも、直接記述はせず、実行環境に従った値を取得できるように、関数の戻り値を使います。

URL url

ここには、実行環境のURLを取得できるよう、いずれかのメソッドを記述します。

getDocumentBase()アプレットが組み込まれているドキュメントのディレクトリを命名する絶対 URL を返します。
今のプログラムの場合は、e:\java\html が返ります。
getCodeBase() アプレット自身の URL である、基底 URL を取得します。
今のプログラムの場合は、パッケージ指定していますので、e:\java が返ります。

ローカルな実行環境でなく、インターネット環境であれば、http://www.sys5jp.net/applet/ といった値を返します。

String name

ここには、HTMLファイル作成者が指定できるよう、getParameter(String name) メソッドを呼び出します。
アプリケーションのように大規模なパッケージの場合で、実行時指定が煩瑣となる場合などは、パッケージの中にイメージファイルを含めておき、ここではファイルパスを直接書くという選択もあります。

イメージファイルの読み込みと描画

getImage では、イメージファイルの位置確認だけで、読み込みはしません。最初の描画時に、読み込みつつ描画していきます。読み込みは、裏方で非同期に実行されます。
drawImage(Image img, int x, int y, ImageObserver observer)
(x, y) を左上座標として、イメージを描画します。ImageObserver は裏方の通知を受ける窓口で、Applet 自身がこの機能を持っています。ですからここでは、「this」を指定しています。(正確には、Appletクラスが継承している下位クラスのComponentクラスの持っている機能です)

ソースコード

java/net/sys5jp/basic/Star1.java

1 package net.sys5jp.basic; 2 3 import java.applet.*; 4 import java.awt.*; 5 6 public class Star1 extends Applet { 7 Color backColor = new Color(0, 0, 0); 8 Image starImage; 9 Dimension dim; 10 11 private Color getColorParameter(String param) { 12 String value = getParameter(param); 13 try { return new Color(Integer.parseInt(value, 16)); } 14 catch(Exception e) { return null; } 15 } 16 17 public void paint(Graphics g) { 18 dim = getSize(); 19 g.setColor(backColor); 20 g.fillRect(0, 0, dim.width, dim.height); 21 g.drawImage(starImage, 0, 0, this); 22 } 23 24 public void init() { 25 Color color; 26 if((color = getColorParameter("backcolor")) != null) { 27 backColor = color; 28 } 29 try { starImage 30 = getImage(getDocumentBase(), getParameter("starimage")); } 31 catch(Exception e) { ; } 32 setBackground(backColor); 33 } 34 }

java/html/Star1.html

<html> <head> <style> body {background-color:rgb(0, 0, 0); color:rgb(255, 255, 255)} table {text-align:center; margin:10px 10px} td {padding:5px 10px} </style> </head> <body> <table> <tr><td> <img src="../images/Star30.png"> </td><td> <applet code="net/sys5jp/basic/Star1.class" codebase="../" width=30 height=30> <param name="starimage" value="../images/Star30.png"> </applet> <tr><td> Star30.png </td><td> Star1.class </td></tr> </table> </body> </html>