「DJGL-キー入力」の編集履歴（バックアップ）一覧はこちら

「DJGL-キー入力」(2016/10/12 (水) 19:48:47) の最新版変更点

追加された行は緑色になります。

削除された行は赤色になります。

*キーボードでの入力
----
キーボードでの入力を取得する方法を解説します。これと[[画像の描画>>DJGL-画像の描画]]を学べばかんたんなゲームは作成可能です。

**ソースコード
----
まずは下記のソースコードを打ち込んでください。
※[[DJGL-画像の描画]]できちんと画像描画ができていないと何も表示されません。
&bold(){※2016年10月6日更新：今回からupdateメソッドを使う＆処理の順番をわかりやすくするためdrawメソッドとupdateメソッドの場所を入れ替えました。}(処理はupdate→drawの順番)


#highlight(linenumber,java){{
//------------
//変更点開始
/////////////////
import densan.s.game.input.KeyInput;
import java.awt.event.KeyEvent;
/////////////////
//変更点終了
//------------
 
import java.awt.Image;
 
import densan.s.game.image.ImageLoader;
import java.awt.Color;
 
import densan.s.game.drawing.Drawer;
import densan.s.game.manager.GameManager;
import densan.s.game.manager.Updatable;
 
 
public class TestGame implements Updatable {
 
	private Image playerImage;
	//------------
	//変更点開始
	/////////////////
	private int x, y;
	/////////////////
	//変更点終了
	//------------
	//初期化
	public TestGame() {
		playerImage = ImageLoader.load("resources/player01.png");
		//------------
		//変更点開始
		/////////////////
		x = 100;
		y = 100;
		/////////////////
		//変更点終了
		//------------
	}
	//更新
	@Override
	public void update() {
		//------------
		//変更点開始
		/////////////////
 
		//キー入力に応じて移動
		if (KeyInput.isPressing(KeyEvent.VK_RIGHT)) {//右アローキー
			x+=3;
		}
		if (KeyInput.isPress(KeyEvent.VK_LEFT)) {//左アローキー
			x-=3;
		}
		if (KeyInput.isPress(KeyEvent.VK_UP, KeyEvent.VK_B)) {//上アローキーとBキー
			y-=3;
		}
 
		if (KeyInput.isPressing(KeyEvent.VK_DOWN, KeyEvent.VK_SPACE)) {//下アローキーとスペースキー
			y+=3;
		}
		/////////////////
		//変更点終了
		//------------
 
	}
	//描画
	@Override
	public void draw(Drawer d) {
		//------------
		//変更点開始
		/////////////////
		//画像を描画
		d.drawImage(playerImage, x, y);
 
 
		/////////////////
		//変更点終了
		//------------
 
	}

	//初期化
	public static void main(String[] args) {
		//ゲームを管理するクラスを取得
		GameManager gm = GameManager.getInstance();
		//このメソッドでウインドウを表示する
		//引数はそれぞれ(幅, 高さ, タイトルバーに表示する文字)
		gm.createFrame(800, 600, "テストゲーム");
		//更新と描画を担うオブジェクトを設定
		gm.setUpdatable(new TestGame());
	}
 
}

}}

このコード実行すると以下のようになります。見た目は画像描画のときと変わりありません。
(画像を自分で用意してる場合は表示される画像が違います)
この状態で矢印キー(アローキー)を押すと画像が上下左右に動きます。上と左は1回押すごとに動き、下と右は長押しでも動きます。この違いは使っているメソッドの違いです。スペースキーで下、Bキーで上にも動きます。
#ref(スクリーンショット 2016-10-04 09.21.10.png)
**解説
----
変更点が全体に散らばっています。ひとつひとつ見ていきます。
-4~5行目のimport文
--そのまま書けばいいですが、標準ライブラリのKeyEventクラスは複数あるのでパッケージ名に気をつけてください。

-26行目はx,yという変数を定義しています。
--この変数は画像が描画される位置を示します。これを変化させることで、画像が描画される位置を変更し、画像が動いているように表示します。

-36〜37行目は変数の初期化です。とりあえずの値です。

-50~62行目のupdateメソッドでキーの入力に応じてx,yの値を変化させています。
--キーボードの入力を取得するにはKeyInputクラスのstaticメソッドを使います
---staticなのでnewする必要はありません。
--キーの入力を取得するメソッドは2種類あります
---65,75行目の&bold(){isPressing}メソッドは「押されている間ずっと」trueを返します。
---キャラの移動などの押しっぱなしでも可能にしたいことに使います
---68,71行目の&bold(){isPress}メソッドは「押された瞬間だけ」trueを返します。
---決定キーなどの1度だけ押されたのを検出したいときに使います。
--キー入力を受け取るメソッドの引数にはKeyEvent(Java標準ライブラリ)の定数を使います。
---基本的に引数には&bold(){KeyEvent.VK_[キー]}で指定します。
----アルファベット・数字ならそのまま、名前ついてるキーならその名前を入れればいいです。
----KeyEvent.VK_AならAキー、KeyEvent.VK_1なら1キー、KeyEvent.VK_SPACEならスペースキー
----矢印キーはUP、DOWN、RIGHT、LEFTとなっています。
---KeyEventについて詳しくは[[>>https://docs.oracle.com/javase/jp/8/docs/api/]]
----フィールドの先頭がVKのやつみるだけで十分です。
---引数が2つ以上のものは、どれかのキーが押されていればtureになります。(OR)
----可変長引数なので、KeyEventの定数ならいくつでも引数に追加できます。
-----KeyInput.isPress(KeyEvent.VK_A, KeyEvent.VK_B, KeyEvent.VK_C, KeyEvent.VK_D)みたいに。
--KeyInputについて詳しくは[[>>http://kiki33.bitbucket.org/densan/s/game/input/KeyInput.html]]

-75行目は引数の中身が定数からx,yに変わっています。updateでx,yを変更することで描画される位置を変更出来るようにしています。
--ゲームを作るときは基本的にプレイヤーや敵が居る位置を変数に保存して、その位置に画像を描画することでゲーム画面を描画します。

**まとめ
----
今回はキー入力について解説しました。これでユーザからの入力を受け付けられるようになったのでいろいろできます。
----
#comment_num2

*キーボードでの入力
----
キーボードでの入力を取得する方法を解説します。これと[[画像の描画>>DJGL-画像の描画]]を学べばかんたんなゲームは作成可能です。

**ソースコード
----
まずは下記のソースコードを打ち込んでください。
※[[DJGL-画像の描画]]できちんと画像描画ができていないと何も表示されません。
&bold(){※2016年10月6日更新：今回からupdateメソッドを使う＆処理の順番をわかりやすくするためdrawメソッドとupdateメソッドの場所を入れ替えました。}(処理はupdate→drawの順番)


#highlight(linenumber,java){{
//------------
//変更点開始
/////////////////
import densan.s.game.input.KeyInput;
import java.awt.event.KeyEvent;
/////////////////
//変更点終了
//------------
 
import java.awt.Image;
 
import densan.s.game.image.ImageLoader;
import java.awt.Color;
 
import densan.s.game.drawing.Drawer;
import densan.s.game.manager.GameManager;
import densan.s.game.manager.Updatable;
 
 
public class TestGame implements Updatable {
 
	private Image playerImage;
	//------------
	//変更点開始
	/////////////////
	private int x, y;
	/////////////////
	//変更点終了
	//------------
	//初期化
	public TestGame() {
		playerImage = ImageLoader.load("resources/player01.png");
		//------------
		//変更点開始
		/////////////////
		x = 100;
		y = 100;
		/////////////////
		//変更点終了
		//------------
	}
	//更新
	@Override
	public void update() {
		//------------
		//変更点開始
		/////////////////
 
		//キー入力に応じて移動
		if (KeyInput.isPressing(KeyEvent.VK_RIGHT)) {//右アローキー
			x+=3;
		}
		if (KeyInput.isPress(KeyEvent.VK_LEFT)) {//左アローキー
			x-=3;
		}
		if (KeyInput.isPress(KeyEvent.VK_UP, KeyEvent.VK_B)) {//上アローキーとBキー
			y-=3;
		}
 
		if (KeyInput.isPressing(KeyEvent.VK_DOWN, KeyEvent.VK_SPACE)) {//下アローキーとスペースキー
			y+=3;
		}
		/////////////////
		//変更点終了
		//------------
 
	}
	//描画
	@Override
	public void draw(Drawer d) {
		//------------
		//変更点開始
		/////////////////
		//画像を描画
		d.drawImage(playerImage, x, y);
 
 
		/////////////////
		//変更点終了
		//------------
 
	}

	//初期化
	public static void main(String[] args) {
		//ゲームを管理するクラスを取得
		GameManager gm = GameManager.getInstance();
		//このメソッドでウインドウを表示する
		//引数はそれぞれ(幅, 高さ, タイトルバーに表示する文字)
		gm.createFrame(800, 600, "テストゲーム");
		//更新と描画を担うオブジェクトを設定
		gm.setUpdatable(new TestGame());
	}
 
}

}}

このコード実行すると以下のようになります。見た目は画像描画のときと変わりありません。
(画像を自分で用意してる場合は表示される画像が違います)
この状態で矢印キー(アローキー)を押すと画像が上下左右に動きます。上と左は1回押すごとに動き、下と右は長押しでも動きます。この違いは使っているメソッドの違いです。スペースキーで下、Bキーで上にも動きます。
#ref(スクリーンショット 2016-10-04 09.21.10.png)
**解説
----
変更点が全体に散らばっています。ひとつひとつ見ていきます。
-4~5行目のimport文
--そのまま書けばいいですが、標準ライブラリのKeyEventクラスは複数あるのでパッケージ名に気をつけてください。

-26行目はx,yという変数を定義しています。
--この変数は画像が描画される位置を示します。これを変化させることで、画像が描画される位置を変更し、画像が動いているように表示します。

-36〜37行目は変数の初期化です。とりあえずの値です。

-50~62行目のupdateメソッドでキーの入力に応じてx,yの値を変化させています。
--キーボードの入力を取得するにはKeyInputクラスのstaticメソッドを使います
---staticなのでnewする必要はありません。
--キーの入力を取得するメソッドは2種類あります
---65,75行目の&bold(){isPressing}メソッドは「押されている間ずっと」trueを返します。
---キャラの移動などの押しっぱなしでも可能にしたいことに使います
---68,71行目の&bold(){isPress}メソッドは「押された瞬間だけ」trueを返します。
---決定キーなどの1度だけ押されたのを検出したいときに使います。
--キー入力を受け取るメソッドの引数にはKeyEvent(Java標準ライブラリ)の定数を使います。
---基本的に引数には&bold(){KeyEvent.VK_[キー]}で指定します。
----アルファベット・数字ならそのまま、名前ついてるキーならその名前を入れればいいです。
----KeyEvent.VK_AならAキー、KeyEvent.VK_1なら1キー、KeyEvent.VK_SPACEならスペースキー
----矢印キーはUP、DOWN、RIGHT、LEFTとなっています。
---KeyEventについて詳しくは[[>>https://docs.oracle.com/javase/jp/8/docs/api/java/awt/event/KeyEvent.html]]
----フィールドの先頭がVKのやつみるだけで十分です。
---引数が2つ以上のものは、どれかのキーが押されていればtureになります。(OR)
----可変長引数なので、KeyEventの定数ならいくつでも引数に追加できます。
-----KeyInput.isPress(KeyEvent.VK_A, KeyEvent.VK_B, KeyEvent.VK_C, KeyEvent.VK_D)みたいに。
--KeyInputについて詳しくは[[>>http://kiki33.bitbucket.org/densan/s/game/input/KeyInput.html]]

-75行目は引数の中身が定数からx,yに変わっています。updateでx,yを変更することで描画される位置を変更出来るようにしています。
--ゲームを作るときは基本的にプレイヤーや敵が居る位置を変数に保存して、その位置に画像を描画することでゲーム画面を描画します。

**まとめ
----
今回はキー入力について解説しました。これでユーザからの入力を受け付けられるようになったのでいろいろできます。
----
#comment_num2