Java Appletの解説
<16.お絵かきソフト(その2)>
15.の「お絵かきソフト」の機能をアップします。
1.直線の描写
マウスのボタンを押して、好きな所にドラックすれば直線が描写される方法。
15.の「お絵かきソフト」と大筋は同じですので、違う部分だけ書きます。方法の4番目の
ボタン「点」を「直線」の機能に変えています。
1.<Javaファイル>
−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−
略
public class tpaint2 extends Applet{
略
int px1,py1;
public void init(){
略
p1.add(bmt4=new Button("直線"));
略
public void mousePressed(MouseEvent e){
oldx=e.getX();oldy=e.getY();px1=e.getX();py1=e.getY();}
public void mouseReleased(MouseEvent e){ }
略
public void mouseDragged(MouseEvent e){
if(chi==2){g.clearRect(e.getX(),e.getY(),20,20);}
else if(chi==3){g.setPaintMode();g.drawLine(oldx,oldy,e.getX(),e.getY());oldx=e.getX();oldy=e.getY();}
else if(chi==4){g.setXORMode(new Color(255,255,255));g.drawLine(oldx,oldy,px1,py1);
px1=e.getX();py1=e.getY();g.drawLine(oldx,oldy,px1,py1);}
略
−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−
例1.ここをクリックして下さい。
2.<解説>
1)初期設定
int px1,py1;直線を引くための終点を入れる変数。
2)マウスボタンが押された時の処理;
oldx=e.getX();oldy=e.getY();px1=e.getX();py1=e.getY();
マウスが押された時点の座標を(oldx,oldy)と(px1,py1)に格納します。
3)マウスがドラッグされている時の処理;
1.else if(chi==4){g.setXORMode(new Color(255,255,255));g.drawLine(oldx,oldy,px1,py1);
px1=e.getX();py1=e.getY();g.drawLine(oldx,oldy,px1,py1);}
if(chi==4) 方法として直線が選ばれている場合
g.drawLine(oldx,oldy,px1,py1);マウスのボタンを押した時点の座標(oldx,oldy)とマウスがドラッグ
されている現在の座標(px1,py1)との間に直線を引くことになります。
px1=e.getX();py1=e.getY();g.drawLine(oldx,oldy,px1,py1);ドラッグ中の新しい座標(px1,py1)との間に
次々と線を引くことを意味します。
これでは、次々と直線が何本も引かれる事になります。これを解消するためg.setXORMode(new Color(255,255,255));
があります。これは、現在の色とnew Color(255,255,255)との色とのXOR(排他的論理和)色で描写すること意味します。
即ち、同じ色で重ねて描くとその図は消えることになります。これを使って、線が1本だけ描写されるように
します。これがないとAppletのゲームの「絵かきボード(その1)」のように線が何本も重なって描かれることに
なります。
2.else if(chi==3){g.setPaintMode();
g.setPaintMode();はg.setXORMode(new Color(255,255,255));の設定を元の上書きモードに戻します。でないと、chi==3(細線)が
線が重なると消えるため途切れ途切れになります。
2.四角形、中塗り四角形の描写
マウスのボタンを押して、好きな所にドラックすれば好きな大きさの四角形、中塗り四角形が描写できる方法。
15.の「お絵かきソフト」にbmt5,bmt6の2つのボタン(四角形、中塗四角)を追加します。
1.<Javaファイル>
−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−
略
public class tpaint3 extends Applet{
略
int w1,h1,px1,py1,px2,py2,xx1,yy1;
public void init(){
略
p1.setLayout(new GridLayout(4,2,0,0));
略
p1.add(bmt5=new Button("四角形"));
p1.add(bmt6=new Button("中塗四角"));
略
public void mousePressed(MouseEvent e){
oldx=e.getX();oldy=e.getY();px1=e.getX();py1=e.getY();
w1=0;h1=0;xx1=0;yy1=0;
略
public void mouseDragged(MouseEvent e){
px2=e.getX();py2=e.getY();
略
else if(chi==5){g.setXORMode(new Color(255,255,255));g.drawRect(xx1,yy1,w1,h1);
revwh(px2,py2);g.drawRect(xx1,yy1,w1,h1);}
else if(chi==6){g.setXORMode(new Color(255,255,255));g.fillRect(xx1,yy1,w1,h1);
revwh(px2,py2);g.fillRect(xx1,yy1,w1,h1);}
略
void revwh(int px2, int py2){
if (oldx<=px2){xx1=oldx;}
else {xx1=px2;}
if (oldy<=py2){yy1=oldy;}
else {yy1=py2;}
w1=Math.abs(px2-oldx);
h1=Math.abs(py2-oldy);}}
−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−−
例2.ここをクリックして下さい。
2.<解説>
1)初期設定int w1,h1,px1,py1,px2,py2,xx1,yy1;
w1,h1は、描写する四角形の幅、高さを格納する変数。
px1,py1は、マウスのボタンが押された座標。px2,py2はマウスがドラックされている時の座標。
xx1,yy1は、四角形を描く時、基準になる始点の座標。
2)マウスのボタンが押された時の処理;
oldx=e.getX();oldy=e.getY();px1=e.getX();py1=e.getY();w1=0;h1=0;xx1=0;yy1=0;
マウスのボタンが押された時の座標を(oldx,oldy)と(px1,py1)に記憶する。
w1,h1,xx1,yy1を0に初期設定する。
3)マウスがドラッグ中の処理;
1.px2=e.getX();py2=e.getY();マウスがドラッグ中の座標を(px2,py2)に記憶する。
2.else if(chi==5){g.setXORMode(new Color(255,255,255));g.drawRect(xx1,yy1,w1,h1);
revwh(px2,py2);g.drawRect(xx1,yy1,w1,h1);}
if(chi==5)は、四角形描写が選ばれた時の処理。四角形がいくつも描写されないようにg.setXORMode(new Color(255,255,255));排他的論理和に設定する。
g.drawRect(xx1,yy1,w1,h1);始点(xx1,yy1)幅w1、高さh1の四角形を描く
revwh(px2,py2);ドラッグ中の新しい座標(px2,py2)から新たに描く四角形の(xx1,yy1,w1,h1)の情報得る。
4)四角形の座標を求めるための方法
1.void revwh(int px2, int py2){if (oldx<=px2){xx1=oldx;} else {xx1=px2;}
新しい四角形の座標を求めるための方法です。
g.drawRect(xx1,yy1,w1,h1);は始点(xx1,yy1)として幅w1、高さh1の四角形を表示します。w1,h1は正の数で有効
で負の数では表示されません。マウスのボタンが押された始点より座標が小さな所をドラッグした場合は無効になります。
そこで、ドラッグ中の新しい座標px2が最初にボタンが押された座標oldxより大きければ四角形の始点の座標をxx1=oldx;
とする。小さければxx1=px2;とします。こうする事により、最初にボタンを押した場所より小さいところをドラックした場合、
始点の座標が変わり四角形の描写されます。
Y座標についても同様のことします。
2.w1=Math.abs(px2-oldx);h1=Math.abs(py2-oldy);}}
四角形の幅と高さの計算をします。
円の場合は、g.drawRect(xx1,yy1,w1,h1)をg.drawOval(xx1,yy1,w1,h1)に変えるだけで、後は同様です。
<問題点>
g.setXORMode(new Color(255,255,255));これが効いているため、色が重ね合わさると違う色になります。
面白いと言えば面白いのですが、これを避ける方法も考えなければいけません。
娯楽室の各部屋