マウス操作を加える
ここでは、マウスの操作をアプレットに影響させる方法を紹介します。
まず、public class〜の文に変更を加えます。〜 extends Applet{で文が終わっていると
思いますが、Appletと{の間に次の文を挿入します。
implements MouseListener,MouseMotionListener
そしてpublic class〜内に次のメソッドを追加します。
public void mousePressed(MouseEvent e){
//ここにマウスボタンが押された時の処理を記述
}
public void mouseReleased(MouseEvent e){
//ここにマウスボタンが放された時の処理を記述
}
public void mouseClicked(MouseEvent e){
//ここにマウスボタンがクリックされた時の処理を記述
}
public void mouseEntered(MouseEvent e){
//ここにマウスがアプレット画面に入った時の処理を記述
}
public void mouseExited(MouseEvent e){
//ここにマウスがアプレット画面から出た時の処理を記述
}
public void mouseDragged(MouseEvent e){
//ここにマウスボタンがドラッグされたときの処理を記述
}
public void mouseMoved(MouseEvent e){
//ここにマウスカーソルがアプレット画面内を移動した時の処理を記述
}
さて、今回はアプレット内でマウスボタンを押した時には(20,20)から縦の長さ100,
横の長さ50の長方形の輪郭(色は黒)を、マウスボタンを離したときは、その長方形内を青で
塗りつぶすアプレットを作成してみましょう。今回からプログラムがかなり複雑になるので
心してかかりましょう。できるだけ詳細な解説を加えるつもりです。
今回もアニメーションはさせないので、アニメーションしない場合のソースをまず入力（あるいはコピー）します。
そして、public class 〜をpublic class ***(任意) extends Applet implements MouseListener,MouseMotionListener{
そして上記で記述したマウスに関するメソッドを全て入力します。全て入力しないとエラーになります。
”ここに変数を宣言する”の部分に次の文を入力します。
boolean mouse_press_check;
boolean mouse_release_check;
変数名は何でも構いませんが、わかりやすい名前にすることをお勧めします。
このプログラムではmouse_press_checkを『マウスボタンが押されたか。』の判定に、
mouse_release_checkを『マウスボタンが離されたか』の判定に使いたいと思います。
次にinitメソッド内で次の文を入力します。
addMouseListener(this);
addMouseMotionListener(this);
mouse_press_check = false;
mouse_release_check = false;
まず、addMouseListenerとaddMouseMotionListenerでマウス操作を有効にします。
そして、アプレット開始時点ではマウスは『押された状態』でも『離された状態』でもありませんから
値をfalseにセットしておきます。
次にpaintメソッドに次の文を入力します
if(mouse_press_check){
g.drawRect(20,20,50,100);
}
if(mouse_release_check){
g.setColor(Color.blue);
g.fillRect(20,20,50,100);
}
まず、上のif文ですが、mouse_press_checkが『押された状態』(true)の場合、
四角形の輪郭を描画するコードです。if文の詳細はこのサイトの
構造化プログラミングのページをご覧ください。
次に、下のif文ですが、mouse_release_checkが『離された状態』(true)の場合、
四角形の輪郭の中を青で塗りつぶすコードです。
次にmousePressedメソッドに次の文を入力します。
mouse_press_check = true;
repaint();
これはマウスボタンがが押された時、mouse_press_checkを『押された状態』にして、
paintメソッドで輪郭を表示させる条件を満たすようにします。
そしてrepaint()でpaintメソッドを再び呼び出します。
次にmouseReleasedメソッドに次の文を入力します。
mouse_release_check = true;
repaint();
これはマウスボタンが離された時、mouse_release_checkを『離された状態』にして、
paintメソッドで青色で四角形の輪郭の中を塗りつぶす条件を満たすようにします。
そしてrepaint()でpaintメソッドを再び呼び出します。
そして、前回と同様の手順でアプレットを起動します。ちゃんと思い通りに動いていますか？
サンプル
キーボード操作を加える
ここでは、キーボードの操作をアプレットに影響させる方法を紹介します。
まず、public class〜の文に変更を加えます。〜 extends Applet{で文が終わっていると
思いますが、Appletと{の間に次の文を挿入します。
implements KeyListener
マウスと併用して使いたいときは、,で区切ってその後にKeyListenerと追加します。
そしてpublic class〜内に次のメソッドを追加します。
public void keyPressed(KeyEvent e){
//ここにキーが押された時の処理を記述
}
public void keyReleased(KeyEvent e){
//ここにキーが離された時の処理を記述
}
public void keyTyped(KeyEvent e){
//ここにキーがタイプされた時の処理を記述
}
さて、今回はキーボード上の"S"キーが押された場合は、座標(200,200)にpressと、その後、"S"キーが離された時は、
pressという文字を消して、releaseという文字を画面に表示するアプレットを作成しましょう。
今回もアニメーションはさせないので、アニメーションしない場合のソースをまず入力（あるいはコピー）します。
そして、public class 〜をpublic class ***(任意) extends Applet implements KeyListener{ とします。
”ここに変数を宣言する”の部分に次の文を入力します。
boolean s_key_press_check;
boolean s_key_release_check;
ここではs_key_press_checkを『Sキーが押された状態』を保持する変数とし、
s_key_release_checkを『Sキーが押された後、離された状態』を保持する変数とします。
次にinitメソッド内で次の文を入力します。
addKeyListener(this);
requestFocus();
s_key_press_check = false;
s_key_release_check = false;
まず、addKeyListener(this)とrequestFocus()で、アプレット内のキーボード操作を有効にします。
そして、アプレット開始時点ではキーボードの『S』は『押された状態』でも『押された後、離された状態』でもありませんから
値をfalseにセットします。
次にpaintメソッド内で次の文を入力します。
if(s_key_press_check){
g.drawString("press",200,200);
}
if(s_key_release_check){
g.drawString("release",200,200);
}
上のif文はs_key_press_checkがtrueの時、"press"と文字を表示させるソースコードです。
下のif文はs_key_release_checkがtrueの時、"release"と文字を表示させるソースコードです。
次にkeyPressedメソッドに次の文を入力します。そして再びpaintメソッドを呼び出します。
if(e.getKeyCode() == 83){
s_key_press_check = true;
s_key_release_check = false;
repaint();
}
e.getKeyCode()は押されたキーの値をASCIIコードの値で返します。Sは83ですから、83の時は、
Sキーが押された時なので、 s_key_press_checkをtrueとし、『離されている状態』ではないので
s_key_release_checkをfalseとします。
次にkeyReleasedメソッドに次の文を入力します。
if(e.getKeyCode() == 83){
s_key_press_check = false;
s_key_release_check = true;
repaint();
}
e.getKeyCode()は押されたキーの値をASCIIコードの値で返します。Sは83ですから、83の時は、
Sキーが離された時なので、 『押された状態』ではないのでs_key_press_checkをfalseとし、
s_key_release_checkをtrueとします。そして再びpaintメソッドを呼び出します。
そして、前回と同様の手順でアプレットを起動します。ちゃんと思い通りに動いていますか？
注意としては、一度アプレット画面をクリックしてから動作確認をしてください。
そうしないとキーボード入力が反映されないようです。
サンプル
アニメーションさせる
さて、今回はアニメーション（動画のように振舞う）させる方法を紹介します。
今回は・・・JAVAファイルを２つ作成します。
ひとつはApplet用（つまりいままでと同じようなファイル）、もうひとつはアニメーション用のJAVAファイルです。
では例題として、座標(200,100)に大きさ縦横30の円を描き、0.1秒経つごとに円のx座標を１右にずらし、座標(300,100)まで
移動させるアプレットを作成します。
先に、一つ目のアニメーション用のJAVAファイルを作成します。
あらかじめ、アニメーション用のJAVAファイルの名前を決めておきます。
(ここではsample_11_aとします。以降sample_11_aであることを前提とする)
あらかじめ、Applet用のJAVAファイルの名前を決めておきます。
(ここではsample_11とします。以降sample_11であることを前提とする)
まず、public class sample_11_a implements Runnable{と記述します。(最後に}も忘れずに。)
"ここに変数を宣言する"の部分に次の変数を追加します。
sample_11 an;
sample_11は先ほど決めた名前を記述します。
次にこのようなコンストラクタを記述します。
public sample_11_a(sample_11 an){
}
次にコンストラクタ内に次のように記述します。
this.an = an;
この辺りの詳しい解説は、オブジェクト指向プログラミングのページをご覧ください。
そして次のメソッドを記述します。
public void run()
try{
}
catch(InterruptedException ie){
}
}
このメソッドにアニメーションさせたい内容を記述します。
try〜catchは予期しない事態が発生した場合に関係してきます。
ここでは無視します。
今回、アニメーションさせたい内容は『0.1秒ごとにx座標を1ずらす』です。
まず、”0.1秒ごとに”という記述は次の通りです。
Thread.sleep(100);
これをtryブロックの内部に記述します。
つぎに”x座標を1ずらす”は、Applet用のJAVAファイル内のcircle_x（後述）の値を1増加させる
ことなので、次の処理をtryブロックの内部に記述します。
an.circle_x = an.circle_x + 1;
そして、Applet画面を再表示させるため、tryブロックの内部に次のように記述します
an.repaint();
最後にこの処理をx座標が300になるまで繰り返すと言うことなので、つぎのwhile文で今までの3つの処理を挟みます。
while(an.circle_x < 300){
}
これでアニメーション用のJAVAファイルは作成完了です。
次に、一つ目のApplet用のJAVAファイルを作成します。
今回はアニメーションさせますので、アニメーションさせる場合のソースをまず入力（あるいはコピー）します。
そして、"ここに変数を宣言する"のところに次の文を追加します。
int circle_x;
Thread thread;
sample_11_a s11a;
circle_xは円のx座標を示す変数として使用します。
threadはアニメーション用の変数として使用します。
]
s11aはsample_11_a（先ほど作ったJAVAファイル)を利用するための変数です。
そしてinitメソッドに次の文を追加します。
circle_x = 200;
s11a = new sample_11_a(this);
thread = new Thread(s11a);
thread.start();
まず、circle_xに円のx座標の初期位置である200を代入します。
つぎにsample_11_aのインスタンスを生成します。引数としてthis(Applet画面)を指定します。
この辺りの詳しい解説は、オブジェクト指向プログラミングのページをご覧ください。
下の2行は、簡単に言えば、sample_11_a内のrunメソッドをスタートさせるソースコードです。
そして、updateメソッド内に次のように記述します。
grf.setColor(Color.white);
grf.fillRect(0,0,400,400);
grf.setColor(Color.black);
grf.drawOval(circle_x,100,40,40);
まず、１、2行目の文で、一回grfの内容を白色で消去します。これをしないと円の動いた跡が全て見えてしまうためです。
次に、3,4行目の文でcircle_xで指定された場所に黒色で円を描くコードです。
何故、gではなくgrfなのかというと、一回grfに描く画面全てを書いてから
g.drawImage(offscreen,0,0,this);でgに移し変えると、
画面のちら付きを防ぐことができるからです。
そして、前回と同様の手順でアプレットを起動します。クラスファイルはsample_11.classを指定します。
ちゃんと思い通りに動いていますか？
サンプル
ラジオボタンを追加する
ここでは、アプレット画面にラジオボタンを追加する方法を紹介します。
ラジオボタンとはWeb上のアンケート等でよく出てくるWindowsコンポーネントで、複数の選択肢から
一つのものをチェックする際に使用します。後述するチェックボックスとは、ひとつのみ選ぶという点
異なります。ラジオボタン、チェックボックスを追加する際には、それのみでは追加できないので、
パネルというものを使用し、パネルにラジオボタン・チェックボックスを貼り付けて、パネルを
アプレット画面に追加するという形で追加します。
それでは、今回は、ラベルがred,blue,greenのラジオボタンをアプレット画面に追加し、ラジオボタンを
状態を変更することでアプレット画面の背景色(初期値：赤)を変更するプログラムを作成します。
今回はアニメーションさせないので、アニメーションしない場合のソースをまず入力（あるいはコピー）します。
そしてpublic class〜の部分を次のように変更します。
public class ***(任意) extends Applet implements ItemListener{
}
さらに、public class内に次のメソッドを追加します。
public void itemStateChanged(ItemEvent e){
//ここにラジオボタンの状態が変更された時の処理を記述
}
次に、”ここに変数を宣言する”の部分に次の文を追加します。
Panel panel;
CheckboxGroup group;
Checkbox chkRED,chkBLUE,chkGREEN;
Color bgcolor;
Panel panelは前述したパネルを表す変数です。Checkboxは前述したラジオボタンを表す変数です。
CheckboxGroupとは、ラジオボタンのグループを表します。前述した複数の選択肢というのは
実はこのCheckboxGroupの中からひとつ選ぶという意味です。深い意味は知らなくても結構です。
次にinitメソッドで次のコードを記述します。
01：bgcolor = Color.red;
02：panel = new Panel();
03：panel.setBackground(Color.yellow);
04：group = new CheckboxGroup();
05：chkRED = new Checkbox("red",true,group);
06：chkBLUE = new Checkbox("blue",false,group);
07：chkGREEN = new Checkbox("green",false,group);
08：panel.add(chkRED);
09：panel.add(chkBLUE);
10：panel.add(chkGREEN);
11：this.add(panel,BorderLayout.SOUTH);
12：chkRED.addItemListener(this);
13：chkBLUE.addItemListener(this);
14：chkGREEN.addItemListener(this);
長いなぁと思いますが、簡単です。ちなみに解説しやすくするために行番号をつけました。
ですので、実際にプログラミングする時は、行番号を絶対に記述しないでください。
まず、１行目は「初期値は赤」ということなのでbgcolor(背景を表すColor変数)に赤色を設定します。
２行目で、パネルを生成し、３行目でパネルの色を黄色に設定しています。４行目でラジオボタンのグループ
を生成しています。５〜７行目ではそれぞれラジオボタンを生成しています。最初の引数には右に表示される
ラベルの文字列を表しています。２番目の引数では初期値のチェックの有無（有：true,無：false)を設定します。
初期値が赤であるため、chkREDのみtrueとしています。最後の引数は所属するラジオボタンのグループを指定します。
８〜１０行目はパネルにそれぞれのラジオボタンを貼り付ける処理です。１１行目はアプレット画面にパネルを追加
しています。BorderLayout.SOUTHというのは、アプレット画面の下端にパネルを配置するという意味です。
そして、１２〜１４行目はそれぞれのラジオボタンにアイテムリスナーをつけ、ラジオボタンのON/OFF処理を反映させる
ようにします。
次にitemStateChangedメソッドに次の処理を追加します。
if(chkRED.getState()){
}else{
if(chkBLUE.getState()){
}else{
}
}
repaint();
これは、ラジオボタンのチェックの有無状態によって、背景色を変更・設定する処理部分です。
ラジオボタンのチェックの有無状態はgetStateメソッドを使えば得ることができます。
chkRED(赤),chkBLUE(青),chkGREEN(緑)を示すラジオボタンなので、そのチェックの有無を見ることにより
背景色を変更します。
最後に、paintメソッドに次のように記述します。
g.setColor(bgcolor);
g.fillRect(0,0,400,400);
これはbgcolorで指定された色で、アプレット画面内をその色で塗りつぶすという意味です。
そして、前回と同様の手順でアプレットを起動します。ちゃんと思い通りに動いていますか？
サンプル
チェックボックスを追加する
ここでは、アプレット画面にラジオボタンを追加する方法を紹介します。
チェックボックスについては上記で説明したとおりです。ひとつだけではなく、複数（0個もOK）選択できます。
今回もパネルにチェックボックスを貼り付けて、アプレット画面にパネルを追加するという形をとります。
さて今回は、アプレット画面に文字を表示させ、チェックボックスによって太字にするか普通に表示させるかを決めることが
できるアプレットを作成しましょう。
今回はアニメーションさせないので、アニメーションしない場合のソースをまず入力（あるいはコピー）します。
そしてpublic class〜の部分を次のように変更します。
public class ***(任意) extends Applet implements ItemListener{
}
さらに、public class内に次のメソッドを追加します。
public void itemStateChanged(ItemEvent e){
//ここにチェックボックスの状態が変更された時の処理を記述
}
次に、”ここに変数を宣言する”の部分に次の文を追加します。
Panel panel;
Font textFont;
Checkbox chkBOLD;
次にinitメソッドで次のコードを記述します。
textFont = new Font("ＭＳ ゴジック",Font.PLAIN,24);
panel = new Panel();
panel.setBackground(Color.yellow);
chkBOLD = new Checkbox("BOLD");
panel.add(chkBOLD);
add(panel,BorderLayout.NORTH);
chkBOLD.addItemListener(this);
まず、１行目で初期フォント形式を指定しておきます。今回の書式はMSゴシック、サイズは24で太字か普通かを切り替えられるようにします。
まず、２〜３行目はラジオボタンのところで説明したとおりです。３行目のnew Checkbox("BOLD")の部分が
チェックボックスを作成する部分です。ラジオボタンを違うのは、引数の数です。ラジオボタンが３つだったのに対し、
チェックボックスはひとつで済みます。唯一の引数は、チェックボックスの横に表示させる文字列です。
４〜６行目もラジオボタンとおなじようにパネルにアプレット画面を追加し、パネルをアプレット画面に追加し、
さらに先ほど作成したチェックボックスにアイテムリスナーをつけ、チェックボックスのON/OFF状態を反映させるようにします。
次にitemStateChangedメソッドで次のように記述します。
if(chkBOLD.getState()){
textFont = new Font("ＭＳ ゴジック",Font.BOLD,24);
}else{
textFont = new Font("ＭＳ ゴジック",Font.PLAIN,24);
}
repaint();
最後に、paintメソッドに次のように記述します。
g.setColor(Color.orange);
g.fillRect(0,0,400,400);
g.setColor(Color.black);
g.setFont(textFont);
g.drawString("TEST",200,200);
上の２行は、背景色を指定する部分です。ここでは、オレンジを指定します。下の３行は、フォントをセットし、
文字列を描画する部分です。私は、TESTと指定しましたが、これは何でも結構です。あと、文字の色を黒に指定しました。
そして、前回と同様の手順でアプレットを起動します。ちゃんと思い通りに動いていますか？
サンプル
リストボックスを追加する
今回はリストボックスを追加する方法を説明します。リストボックスとは
一覧から値を選択することができるWindowsコンポーネントです。
今回はred,green,blueという値を持つリストボックスを作成し、アプレットに追加し、
リストボックスの値を変更することで、背景色を変更(red=赤,green=緑,blue=青）する
アプレットを作成しましょう。(最初の背景色は赤とする)
今回はアニメーションさせないので、アニメーションしない場合のソースをまず入力（あるいはコピー）します。
そしてpublic class〜の部分を次のように変更します。
public class ***(任意) extends Applet implements ItemListener{
}
さらに、public class内に次のメソッドを追加します。
public void itemStateChanged(ItemEvent e){
//ここにリストボックスの値が変更された時の処理を記述
}
次に、”ここに変数を宣言する”の部分に次の文を追加します。
Choice choice;
Color bgcolor;
ここでのchoiceはリストボックスを表す変数とします。
また。bgcolorは背景色を記憶しておく色変数とします。
次にinitメソッド内に次の文を追加します。
bgcolor = Color.red;
choice = new Choice();
choice.add("red");
choice.add("green");
choice.add("blue");
add(choice,BorderLayout.NORTH);
choice.addItemListener(this);
まず、1行目で背景色の初期値を設定します。初期値は赤ですので、Color.redとします。
2行目で、リストボックスのインスタンスを作成します。3〜5行目で作成したリストボックスに
値を追加します。『red,green,blueという値を持つ』とあるので、red,green,blueをそれぞれ追加します。
6行目で、アプレット画面にリストボックスを画面の上のほうに追加します。7行目でリストボックスの変更が
反映されるよう、アイテムリスナーを追加します。
次にitemStateChangedメソッドで次のように記述します。
String color = (String)e.getItem();
if(color.equals("red")){
}else{
if(color.equals("green")){
}else{
}
}
repaint();
1行目でリストボックスの値を文字列で取得します。2行目ではリストボックスの値が"red"であるか判定しています。
3行目では背景色を赤に指定しています。5行目ではリストボックスの値が"green"であるか判定しています。
6行目では、背景色を緑にしています。8行目では、背景色を青にしています。
if〜else文の文法についての説明はこちらに任せます。
最後にpaintメソッドに次のように記述します。
g.setColor(bgcolor);
g.fillRect(0,0,400,400);
これはbgcolorで指定された色で、アプレット画面内をその色で塗りつぶすという意味です。
そして、前回と同様の手順でアプレットを起動します。ちゃんと思い通りに動いていますか？
サンプル
コマンドボタンを追加する
ここではコマンドボタンを追加する方法を説明します。コマンドボタンとは、クリックすることで
画面内に影響を及ぼすことのできるWindowsコンポーネントです。今回は、アプレット画面内に
コマンドボタンを設置し、ボタンをクリックすることで背景を青と黄色交互に切り替えることのできる
アプレットを作成しましょう。背景色の初期値は青とします。
今回はアニメーションさせないので、アニメーションしない場合のソースをまず入力（あるいはコピー）します。
そしてpublic class〜の部分を次のように変更します。
public class ***(任意) extends Applet implements ActionListener{
}
さらに、public class内に次のメソッドを追加します。
public void actionPerformed(ActionEvent e){
//ここにコマンドボタンがクリックされたときの処理を記述
}
次に、”ここに変数を宣言する”の部分に次の文を追加します。
Button button;
String colorstate;
Color bgcolor;
ここでのbuttonはコマンドボタンを表す変数とします。
また、colorstateは現在の背景色が何色かをしていします。ここでは"b"=青、"y"=黄色とします。
また。bgcolorは背景色を記憶しておく色変数とします。
次にinitメソッド内に次の文を追加します。
bgcolor = Color.blue;
colorstate = "b";
button = new Button("change color");
add(button,BorderLayout.NORTH);
button.addActionListener(this);
まず、1行目で背景色を設定します。初期値は青とするとあるので、Color.blueと指定します。
そして、2行目でcolorstateに"b"を指定します。3行目でコマンドボタンのインスタンスを生成します。
"change color"の部分はボタンのラベルの名前になります。
4行目でアプレット画面にボタンを追加し、5行目でボタンをクリックしたときの影響が反映されるよう、
アクションリスナーを追加します。
次にactionPerformedメソッドで次のように記述します。
if(colorstate.equals("b")){
bgcolor = Color.yellow;
colorstate = "y";
}else{
bgcolor = Color.blue;
colorstate = "b";
}
repaint();
1行目で現在の背景色が何色かを判定します。現在の背景色が青(colorstate="b")のとき、2行目で背景色を黄色に設定します。
5行目では、現在の背景色が黄色(colorstate="y")のとき、背景色を青に設定します。背景色変更の際に必ずcolorstateの値も
変更しておきます。(2行目と6行目）。
if〜else文の文法についての説明はこちらに任せます。
最後にpaintメソッドに次のように記述します。
g.setColor(bgcolor);
g.fillRect(0,0,400,400);
これはbgcolorで指定された色で、アプレット画面内をその色で塗りつぶすという意味です。
そして、前回と同様の手順でアプレットを起動します。ちゃんと思い通りに動いていますか？
サンプル