ＪＡＶＡ　ＧＵＩプログラミング 第５回 ボタンとそのイベント処理

今日は・・ ボタンを用いて操作をする方法を学びます。 以前に行った、人が回転するプログラムを改造します ただし、今回は旧式のプログラムで組んであるので 若干の違いはあります。

サンプルです（長いよ） import java.applet.*; import java.awt.*; import java.awt.image.*; import java.awt.event.*;

サンプルです（長いよ） public class ex10 extends Applet implements Runnable,ActionListener　{ int x,y,flag; int delta_x,delta_y; Thread anime=null; Image image1,image2,image3,image4; Button button1=new Button("上"); Button button2=new Button("下"); Button button3=new Button("左"); Button button4=new Button("右"); Panel panel=new Panel();

サンプルです（長いよ） public void init() { x=100;y=100;flag=0; delta_x=5; delta_y=0; image1=getImage(getCodeBase(),"s1.jpg"); image2=getImage(getCodeBase(),"s2.jpg"); image3=getImage(getCodeBase(),"s3.jpg"); image4=getImage(getCodeBase(),"s4.jpg"); button1.addActionListener(this); button2.addActionListener(this); button3.addActionListener(this); button4.addActionListener(this);

サンプルです（まだまだ） add(panel); panel.add(button1); panel.add(button2); anime=new Thread(this); anime.start(); }

サンプルです（長いよ） public void paint(Graphics g) { g.setColor(Color.white); g.fillRect(0,0,500,500); if ((flag % 4)==0) g.drawImage(image1,x,y,this); if ((flag % 4)==1) g.drawImage(image2,x,y,this); if ((flag % 4)==2) g.drawImage(image3,x,y,this); if ((flag % 4)==3) g.drawImage(image4,x,y,this); }

サンプルです（長いよ） public void actionPerformed(ActionEvent e) { if(e.getSource()==button1) { delta_x=0; delta_y=-5; } if(e.getSource()==button2) { delta_x=0; delta_y=5; } if(e.getSource()==button3) { delta_x=-5; delta_y=0; } if(e.getSource()==button4) { delta_x=5; delta_y=0; } }

サンプルです（終わり） public void run() { while (anime!=null) { x+=delta_x; y+=delta_y; flag+=1; repaint(); if (x>500) {x=0;} try { Thread.sleep(100); } catch (InterruptedException e) {}; }

実行結果はどうでしたか？ ボタンを押すことにより、移動方向が変わりましたね では、早速ですが解説します。

解説ｉｍｐｏｒｔ部 import java.applet.*; import java.awt.*; import java.awt.image.*; import java.awt.event.*;

解説ｉｍｐｏｒｔ部 import java.applet.*; import java.awt.*; 今回はjavax.swingではなく、このようにします。 import java.applet.*; import java.awt.*; import java.awt.image.*; import java.awt.event.*;

解説ｉｍｐｏｒｔ部 import java.applet.*; import java.awt.*; import java.awt.image.*; import java.awt.event.*; この３つもｉｍｐｏｒｔします

解説　宣言部 public class ex10 extends Applet implements Runnable,ActionListener　{ int x,y,flag; int delta_x,delta_y; Thread anime=null; Image image1,image2,image3,image4; Button button1=new Button("上"); Button button2=new Button("下"); Button button3=new Button("左"); Button button4=new Button("右"); Panel panel=new Panel();

解説 宣言部 今回はJappletではなくAppletにします。 解説　宣言部 public class ex10 extends Applet implements Runnable,ActionListener　{ int x,y,flag; int delta_x,delta_y; Thread anime=null; Image image1,image2,image3,image4; Button button1=new Button("上"); Button button2=new Button("下"); Button button3=new Button("左"); Button button4=new Button("右"); Panel panel=new Panel(); 今回はJappletではなくAppletにします。

解説　宣言部 public class ex10 extends Applet implements Runnable,ActionListener　{ int x,y,flag; int delta_x,delta_y; Thread anime=null; Image image1,image2,image3,image4; Button button1=new Button("上"); Button button2=new Button("下"); Button button3=new Button("左"); Button button4=new Button("右"); Panel panel=new Panel(); スレッドを用いるのでRunnableを、 ボタンのイベントを扱うのでActionListenerimplementsします。

解説　宣言部 public class ex10 extends Applet implements Runnable,ActionListener　{ int x,y,flag; int delta_x,delta_y; Thread anime=null; Image image1,image2,image3,image4; Button button1=new Button("上"); Button button2=new Button("下"); Button button3=new Button("左"); Button button4=new Button("右"); Panel panel=new Panel(); 変数ｘ、ｙ、ｆｌａｇを用意します

解説　宣言部 public class ex10 extends Applet implements Runnable,ActionListener　{ int x,y,flag; int delta_x,delta_y; Thread anime=null; Image image1,image2,image3,image4; Button button1=new Button("上"); Button button2=new Button("下"); Button button3=new Button("左"); Button button4=new Button("右"); Panel panel=new Panel(); Ｘ方向の変化量と Ｙ方向の変化量を 表す変数を用意します

解説　宣言部 public class ex10 extends Applet implements Runnable,ActionListener　{ int x,y,flag; int delta_x,delta_y; Thread anime=null; Image image1,image2,image3,image4; Button button1=new Button("上"); Button button2=new Button("下"); Button button3=new Button("左"); Button button4=new Button("右"); Panel panel=new Panel(); 以前と同じっス

解説　宣言部 public class ex10 extends Applet implements Runnable,ActionListener　{ int x,y,flag; int delta_x,delta_y; Thread anime=null; Image image1,image2,image3,image4; Button button1=new Button("上"); Button button2=new Button("下"); Button button3=new Button("左"); Button button4=new Button("右"); Panel panel=new Panel(); button1を上という ボタンにします

解説　宣言部 public class ex10 extends Applet implements Runnable,ActionListener　{ int x,y,flag; int delta_x,delta_y; Thread anime=null; Image image1,image2,image3,image4; Button button1=new Button("上"); Button button2=new Button("下"); Button button3=new Button("左"); Button button4=new Button("右"); Panel panel=new Panel(); パネルを用意します

解説 init部 public void init() { x=100;y=100;flag=0; delta_x=5; delta_y=0; image1=getImage(getCodeBase(),"s1.jpg"); image2=getImage(getCodeBase(),"s2.jpg"); image3=getImage(getCodeBase(),"s3.jpg"); image4=getImage(getCodeBase(),"s4.jpg"); button1.addActionListener(this); button2.addActionListener(this); button3.addActionListener(this); button4.addActionListener(this);

解説 init部 public void init() { x=100;y=100;flag=0; delta_x=5; delta_y=0; image1=getImage(getCodeBase(),"s1.jpg"); image2=getImage(getCodeBase(),"s2.jpg"); image3=getImage(getCodeBase(),"s3.jpg"); image4=getImage(getCodeBase(),"s4.jpg"); button1.addActionListener(this); button2.addActionListener(this); button3.addActionListener(this); button4.addActionListener(this); xとyとflagの値を設定します

解説 init部 public void init() { x=100;y=100;flag=0; delta_x=5; delta_y=0; image1=getImage(getCodeBase(),"s1.jpg"); image2=getImage(getCodeBase(),"s2.jpg"); image3=getImage(getCodeBase(),"s3.jpg"); image4=getImage(getCodeBase(),"s4.jpg"); button1.addActionListener(this); button2.addActionListener(this); button3.addActionListener(this); button4.addActionListener(this); Ｘの移動量 Ｙの移動量を設定します

解説 init部 public void init() { x=100;y=100;flag=0; delta_x=5; delta_y=0; image1=getImage(getCodeBase(),"s1.jpg"); image2=getImage(getCodeBase(),"s2.jpg"); image3=getImage(getCodeBase(),"s3.jpg"); image4=getImage(getCodeBase(),"s4.jpg"); button1.addActionListener(this); button2.addActionListener(this); button3.addActionListener(this); button4.addActionListener(this); 画像の読み込みですね

解説 init部 public void init() { x=100;y=100;flag=0; delta_x=5; delta_y=0; image1=getImage(getCodeBase(),"s1.jpg"); image2=getImage(getCodeBase(),"s2.jpg"); image3=getImage(getCodeBase(),"s3.jpg"); image4=getImage(getCodeBase(),"s4.jpg"); button1.addActionListener(this); button2.addActionListener(this); button3.addActionListener(this); button4.addActionListener(this); button1からbuttton4までを 処理するイベントとして追加する

解説 init部 add(panel); Ｐａｎｅｌを画面に追加します panel.add(button1); anime=new Thread(this); anime.start(); } Ｐａｎｅｌを画面に追加します

解説 init部 add(panel); panel.add(button1); panel.add(button2); anime=new Thread(this); anime.start(); } パネルにボタン４つを追加します

解説 init部 add(panel); panel.add(button1); panel.add(button2); anime=new Thread(this); anime.start(); } スレッドを開始します

解説 ｐａｉｎｔ部 public void paint(Graphics g) { g.setColor(Color.white); 解説　ｐａｉｎｔ部 public void paint(Graphics g) { g.setColor(Color.white); g.fillRect(0,0,500,500); if ((flag % 4)==0) g.drawImage(image1,x,y,this); if ((flag % 4)==1) g.drawImage(image2,x,y,this); if ((flag % 4)==2) g.drawImage(image3,x,y,this); if ((flag % 4)==3) g.drawImage(image4,x,y,this); } この前とまったく同じなので…（≧▽≦）

解説 ｒｕｎ部 public void run() { while (anime!=null) { x+=delta_x; 解説　ｒｕｎ部 public void run() { while (anime!=null) { x+=delta_x; y+=delta_y; flag+=1; repaint(); if (x>500) {x=0;} try { Thread.sleep(100); } catch (InterruptedException e) {}; }

解説 ｒｕｎ部 public void run() { while (anime!=null) { x+=delta_x; 解説　ｒｕｎ部 public void run() { while (anime!=null) { x+=delta_x; y+=delta_y; flag+=1; repaint(); if (x>500) {x=0;} try { Thread.sleep(100); } catch (InterruptedException e) {}; } 今回はｘとｙをそれぞれｄｅｌｔａ＿ｘ， ｄｅｌｔａ＿ｙだけ増やしてあげます

解説 イベント処理部 public void actionPerformed(ActionEvent e) { 解説　イベント処理部 public void actionPerformed(ActionEvent e) { 　if(e.getSource()==button1) 　　　{ 　 　delta_x=0; delta_y=-5; 　　　}　 以下略

解説 イベント処理部 public void actionPerformed(ActionEvent e) { 解説　イベント処理部 public void actionPerformed(ActionEvent e) { 　if(e.getSource()==button1) 　　　{ 　 　delta_x=0; delta_y=-5; 　　　}　 以下略 } この部分はＡｃｔｉｏｎＬｉｓｔｅｎｅｒに登録したものに触れたときに自動的に呼び出される

解説 イベント処理部 public void actionPerformed(ActionEvent e) { 解説　イベント処理部 public void actionPerformed(ActionEvent e) { 　if(e.getSource()==button1) 　　　{ 　 　delta_x=0; delta_y=-5; 　　　}　 以下略 もしふれたものがbutton1であればという意味です

解説 イベント処理部 public void actionPerformed(ActionEvent e) { 解説　イベント処理部 public void actionPerformed(ActionEvent e) { 　if(e.getSource()==button1) 　　　{ 　 　delta_x=0; delta_y=-5; 　　　}　 以下略 Button1は上に移動することなので、 Ｘの移動量を０に、Ｙの移動量をー５にする

今日はここまで 今日はボタンを利用する方法を勉強しました ボタンを配置する場所を設定するのは今日はやりません（ＪＡＶＡでは結構面倒・・）