java AWTスレッド

Question

このソースで

import java.awt.*;

//メインのクラス
public class SwingIconMove2{
	int width, height;	//縦横サイズ
	Frame mainF;		//フレーム
	Canvas mainC;		//キャンバス
	
	public SwingIconMove2(){
		//サイズ設定して
		width = 500;
		height = 500;
		
		//キャンバスの大きさと背景色を指定
		mainC = new MainCanvas();
		mainC.setSize(400,400);
		mainC.setBackground(Color.blue);
		
		//フレームの大きさと背景色を指定、キャンバスをフレームに載せる
		mainF = new Frame("moving ball");
		mainF.setBackground(Color.white);
		mainF.setSize(width,height);
		mainF.setLayout(new FlowLayout());
		mainF.add(mainC);
		
		mainF.setVisible(true);
	}
	
	public static void main(String[] args){
		//main関数でインスタンス化を行います
		SwingIconMove2 frame = new SwingIconMove2();
	}
}


class MainCanvas extends Canvas implements Runnable{
	int x, y;		//ボールの位置
	int vx = 30;		//移動量
	int vy = -20;		//移動量
	Thread thread;	//スレッド準備
	
	//コンストラクタは位置を指定してスレッド開始
	public MainCanvas(){
		x = 170;
		y = 265;
		
		thread = new Thread(this);
		thread.start();
	}
	
	public void paint(Graphics g){
		g.setColor(Color.white);
		g.fillOval(x, y, 30, 30);
	}
	
	public void run(){
        while (true) {
            x += vx;
            y += vy;

            repaint();
            

        	//早すぎて困るのでスリープ
            try {
                Thread.sleep(540);
            } catch (InterruptedException e) {
                e.printStackTrace();
            }
        }
	}
}

このように動きます。

イメージとしては

このようにボールを８個用意して回したいです。
どこをどうすればいいですか・・・？
教えてください！

Comments

[masaya_ohashi]

まず確認ですが、あなたのプログラムは右上に向かって●が進んでいくだけのように見えます。これを「回る動きに変える」、「それを8個同時に」ということがわからないということですか？

[Launcher]

はい、おっしゃる通りです！　後々は●をJButtonにして回したいと思っています！　

Answer 1

まず回転のお話をしましょう。
半径が1の円を描くとき、右側から円を上に向かって描くとします。そのとき、xの値は1から始まり0、-1、0、最後にまた1になります。yの値は0から始まり1、0、-1、最後に0になります。さて、こんな数値をどうやって計算するのかということですが、このグラフ、見たことありませんか？
http://www.wolframalpha.com/input/?i=x%3Dcos(t)
http://www.wolframalpha.com/input/?i=y%3Dsin(t)
そう、sin、cosカーブです。これは時間経過tを用いてsinとcosを計算したときのグラフです。cosは1、0、-1、0という周期運動、sinは0、1、0、-1という周期運動をしています。これらを組み合わせると…
http://www.wolframalpha.com/input/?i=x%3Dcos(t),+y%3Dsin(t)
見事な円になりました。つまり、xの座標をcos(t)と考え、yの座標をsin(t)と考えます。ただ、このままだと半径1のパターンしか作れないので、それぞれに半径rを掛けます。

x = cos(t) * r;
y = sin(t) * r;

例えば10秒かけて1周するのであれば、sinやcosが1周するのに必要なのは2πですからtの求め方はこうなります。経過時間をpass(ミリ秒)とすると、

t = 2 * 3.1415 * pass / 10000;

さらにこのままですと0、0の座標を中心に回転するので、中心としたい座標を足してずらします。中心点をcenterX、centerYとすると

period = [周期時間];
pass = [経過時間];
centerX = [回転の中心点x];
centerX = [回転の中心点y];
r = [半径];
t = 2 * 3.1415 * pass / period;
x = cos(t) * r + centerX;
y = sin(t) * r + centerY;

これで円運動する物体の中心点x、yの座標が求められました。ここを中心に●を描画すれば、無事に●が円運動します。

さて、これを8つ描きたいということですが、8つ描くだけならいまある描画処理をfor文で8回やればいいだけです。わざわざボールの個数分のスレッドを回す必要はありません。これら8つの●が常に等間隔、等速で回るのであれば、tに対して8分の1周分プラス(またはマイナス)したtを渡してやればいいだけです。for文のカウントをiとしたとき、tの計算はこうなります。

t = 2 * 3.1415 * (pass + period * i / 8) / period;

あとは自分で組み立ててみてください。

Comments

[KiyoshiMotoki]

最後の
　t = 2 * 3.1415 * pass / period + (period * i / 8);
は
　t = 2 * 3.1415 * pass / period + (2 * 3.1415 * i / 8);
ではありませんか？

[masaya_ohashi]

あ、ほんとですね、このやり方だとpassに足すのが正しいですね。PIを2回出すのはあんまりやりたくないので経過の方をいじろうとしたんですが、この位置じゃだめですね。ご指摘ありがとうございます！

[KiyoshiMotoki]

b

[Launcher]

分かりやすい説明ありがとうございます！
早速組み立ててみます。

Answer 2

「回る動きに変える」のほうだけ。

現在の実装では、ループ1回ごとに x に vx を足して、y に vy を足していますね。つまり

   x = 170;
   y = 265;

   while (true) {
      x += vx;
      y += vy;

ここをこんなかんじにすればいいでしょう:

   static int[] xarray = new int[] {170, 212, 230, 212, 170, 128, 110, 127};
   static int[] yarray = new int[] {265, 253, 225, 197, 185, 197, 225, 253};
   int t = 0;
   while (true) {
      t = (t+1) % 8;
      x = xarray[t];
      y = yarray[t];

ちりばめられている数字は適当に作っただけなので、やりたいことに応じて変えてください。

Comments

[Launcher]

回答、ありがとうございました！
変えて実装してみたのですがうまくいきませんでした・・・

[matobaa]

お、おぅ……