今回はUnityのキーボードでキャラクター画像を動かすについて勉強するッピ！
何かキーを押すと画像がうごく仕組みをつくるッピ！
キーボードとキャラクター画像の移動～？
まだ習ったことないわ！
キーボードの扱いとオブジェクト画像の移動はUnityの基礎の基礎ッピ！
絶対覚えておくと良いッピ！
これからこのキー入力とキャラクター画像移動を一緒に勉強して行くッピよ～
キーボードでオブジェクト画像を移動する方法を学ぼう
必要なもの
まずは必要なものを用意するッピ！
- Unity
- Windows または Mac のパソコン
が必要ッピよ～！
まだ Unity をダウンロードしてない人は
↓ の記事を参考に必要なものをインストールするといいッピ！
Unityを起動する
まずはゲーム作成画面をつくってみるッピ！
Unity-Hubを立ち上げて、
2Dまたは３Dでプロジェクトをつくるッピよ～
できた！
いい感じッピ！
画像ファイルを用意しよう！
それじゃあ、さっそく画像をUnityで表示するっぴ！
・・・その前に、移動する画像が必要だっぴよ～
必要な画像
今回は特別に「うさタブ」と「背景」画像を用意したッピ！
この２つの画像を、右クリックで保存するッピ！
オッケー！
できたわ！
画像をAssetsに登録しよう
準備できたッピか？
それなら画像をAssetsに登録するッピ！
使いたい画像を、ドラッグ＆ドロップでアセットの部分に登録するッピ！
ドラッグ＆ドロップってなんだったかしら？？
たしか、
ファイルをマウスで選択したまま、
ファイルを移動する方法をドラッグ＆ドロップっていうんじゃなかったかな？
そうだったわっ！
別のウィンドウからファイルを引っ張ってもってくれば良いのよねっ
いい感じだっぴ！
２人ともよく出来てるッピ♪
画像をシーンに登録する
まずは画像をシーンに登録するッピ！
やり方は
背景画像をドラッグして、ヒエラルキー下のシーンにドロップするッピ！
できたぜ！
すてきねっ！
よくできてるッピ！
つぎにうさタブの画像もシーンに登録して欲しいんだッピ♪
こうかしら？
いいかんじだぜアイカちゃん！
キャラクターを全面に配置する
だけどこれ、うさタブさんのすがたが見えないわ？
ちゃんとシーンに登録したのに・・・
ホントだ・・・
これじゃあうさタブの画像が移動しても見えないな・・・
どうすればいいのかしら・・・
安心するッピ♪
キャラクターの画像を洗濯して
レイヤー順序→０から１へ変更
をすれば、キャラクターの画像が前面に押し出されるッピ♪
ほんとだわ！
うさタブさんが出てきた！
この
レイヤー順序の数字が大きいほど、画像が前面に押し出される
ッピ！ 覚えておくと良いッピ！
はしっこの
【青い●】
をドラッグして、うさタブの大きさを自由にかえれるッピ♪
おっしゃ！
こんなんでどうだっ
すごいわユウキくんっ
C#スクリプトを作成する
次からプログラムを組んでいくッピよ～！
まずは画面下のAssetの部分で
右クリック→作成→C#スクリプト
を選択するッピ！
名前を
move
に変更するッピよ～
できたわ！
さすがだぜアイカちゃん！
プログラムを編集する
できたC#プログラムを
ダブルクリックして、スクリプトファイルを開くッピ！
もともと書かれている
プログラムを削除して、新しくプログラムを書いていくッピ～！
消しちゃっていいのか？
大丈夫だッピ～♪
このうさタブに任せるッピ！
using UnityEngine;
public class keyInput : MonoBehaviour
{
void Update()
{
}
}
こんな感じで良いのかしら？
バッチリッピよ～！
アイカちゃん才能あるッピね♪
ちなみにこのプログラムは
using UnityEngine;
public class keyInput : MonoBehaviour
{
void Update()
{
//ここに新しいプログラムを入力する
}
}
という意味になるッピ！
新たにプログラムを書き込む
まずは、classのすぐ下に
新しくプログラムを書いていくッピ！
private float speed = 0.1f;と書き込むッピよ～
これは
private float speed = 0.1f;
という意味になるッピ！
数字が大きいほど移動スピードが早くなるッピ！
そうなのねっ
void Update の中に、新しくプログラムを書いていくッピ！
Vector2 pos = transform.position;
if (Input.GetKey(KeyCode.RightArrow))
{
pos.x += speed;
}
else if (Input.GetKey(KeyCode.LeftArrow))
{
pos.x -= speed;
}
else if (Input.GetKey(KeyCode.UpArrow))
{
pos.y += speed;
}
else if (Input.GetKey(KeyCode.DownArrow))
{
pos.y -= speed;
}
transform.position = pos;と書き込むッピよ～
ちなみに最初のプログラムは
Vector2 pos = transform.position;
という意味になるッピ！
そのあとのプログラムは
if (Input.GetKey(KeyCode.RightArrow)) {
pos.x += speed; }
という意味になるッピネ！
この
KeyCode.DownArrow や pos.y -= speed;
はどういう意味になるのかしら？
それは
KeyCode.DownArrow
pos.y -= speed;
という意味になるッピネ！
| キーコード | 対応するキー |
|---|---|
| UpArrow | ↑ |
| DownArrow | ↓ |
| RightArrow | → |
| LeftArrow | ← |
ちなみに
pos.y += speed;
だと、上↑にいくッピ♪
| 移動のじく | 動く方向 |
|---|---|
| y (上と下) | ＋で↑にいく ーで↓にいく |
| x (右と左) | ＋で→にいく ーで←にいく |
| z （3Dのみ/前後） | ＋で前にいく ーで後にいく |
そのあとのプログラムは
transform.position = pos;
という意味になるッピネ！
なるほど、こういう意味だったのか！
using UnityEngine;
public class move : MonoBehaviour
{
private float speed = 0.1f; //floatは小数点
void Update()
{
Vector2 pos = transform.position;
if (Input.GetKey(KeyCode.RightArrow))//→キーを押したら
{
pos.x += speed;//右に移動
}
else if (Input.GetKey(KeyCode.LeftArrow))//←キーを押したら
{
pos.x -= speed;//左に移動
}
else if (Input.GetKey(KeyCode.UpArrow))//↑キーを押したら
{
pos.y += speed;//上に移動
}
else if (Input.GetKey(KeyCode.DownArrow))//↓キーを押したら
{
pos.y -= speed;//下に移動
}
transform.position = pos;
}
}
プログラムができたら、
ファイル→保存(Ctrl+S)
でセーブするッピよ～
キャラクター画像にプログラムを組み込む
保存したプログラムを、キャラクター画像に組み込んでいくッピ！
[move]C#スクリプトを
うさタブにドラッグ＆ドロップするッピ～
右のインスペクターに
move（スクリプト）
があることを確認するッピ！
これかしら？
できたぜ！
いい感じッピ！
動作確認
最後は動作確認ッピ～！
ゲームの上にある[▶]ボタンを押してゲームを開始するッピ！
キーボードの
↑↓←→
を押して、うさタブ画像が移動するか確認するッピ！
できた～！
やったねユウキくんっ
Unityのキーボード入力について
Unityのキーボード入力には、
Input.GetKeyメッソドを使うッピ！
| プログラムメッソド | 発動条件 |
|---|---|
| Input.GetMouseButton | マウスのボタンが押されていたら発動 |
| Input.GetKey | キーボードのキーが押されたら発動 |
インプットメッソド～？
って何だ？
インプットメッソドというのは、
マウスやキーボードなど、外部から入力があったときに
発動するプログラムをつくるときに使うものッピ！
インプットゲットキーというのは、
キーボードでキーを入力されたあとに発動するプログラムッピ！
そうなのね！
へ～
だけどさ、うさタブ
using UnityEngine;
public class move : MonoBehaviour
{
private float speed = 0.1f; //floatは小数点
void Update()
{
Vector2 pos = transform.position;
if (Input.GetKey(KeyCode.RightArrow))//→キーを押したら
{
pos.x += speed;//右に移動
}
else if (Input.GetKey(KeyCode.LeftArrow))//←キーを押したら
{
pos.x -= speed;//左に移動
}
else if (Input.GetKey(KeyCode.UpArrow))//↑キーを押したら
{
pos.y += speed;//上に移動
}
else if (Input.GetKey(KeyCode.DownArrow))//↓キーを押したら
{
pos.y -= speed;//下に移動
}
transform.position = pos;
}
}この、
Input.GetKey (KeyCode.LeftArrow)
とかってやつ
左右とかのキー以外にもできないのか？
エンターキーとかスペースキーも使いたいんだけどな・・・
もちろんできるッピね～！
今回使ったエンターキー以外にも、
よく使うキーを紹介するッピ！
これをキーコードというッピ！ 覚えておくと良いッピよ～
| キーコード | 対応するキー |
|---|---|
| Return | エンターキー |
| Backspace | バックスペースキー |
| Delete | デリートキー |
| Tab | タブキー |
| Escape | エスケープキー |
| Space | スペースキー |
| UpArrow | ↑ |
| DownArrow | ↓ |
| RightArrow | → |
| LeftArrow | ← |
| 数字キーコード | 対応するキー |
|---|---|
| Alpha0 | 0 |
| Alpha1 | 1 |
| Alpha2 | 2 |
| Alpha3 | 3 |
| Alpha4 | 4 |
| Alpha5 | 5 |
| Alpha6 | 6 |
| Alpha7 | 7 |
| Alpha8 | 8 |
| Alpha9 | 9 |
すっげええ！
こんなにあるのか
まだまだあるッピよ～！
詳しくは、Unityのリファレンスをチェックすると良いッピ♪
勉強になったぜ！
今日もまたひとつ学んだわ！
- 画像素材をAssetに登録
- ヒエラルキー→画像素材をシーンに登録
- キャラクター画像をレイヤー順序で前面へ
- Assets→右クリック→C#スクリプト
- プログラムを作成
- C#スクリプトをキャラクター画像に組み込む
- テストプレイ
上手くできたッピか？
これからも色んなゲーム作りやプログラムの解説をしていくッピ！
次回も楽しみにしているッピよ～～！
UnityはC#を元に作られているッピ！
まだまだ Unity や C#について勉強したい人は↓の記事を参考にするッピ♪
