はじめまして。エンジニアのtoshiroです。
 
本日からブリブサー技術ブログをたまに担当させていただきます。
UnityとC#まわりのことをゴニョゴニョと書いていきたいと思います。


さて記念すべき第一回は、「イージングを手軽に自作してみる」です。

もうちょっと具体的にいうと、
「オブジェクトを、ユーザーの入力に応じて、それっぽくイージングで動かしてみる」
です。

ボタンを押すと、最初はゆっくり動き、
押し続けるとどんどん早く動き、
離すとだんだん遅くなり、そして止まる。
そういう一連の、慣性の法則が効いてるっぽい動きですね。
ゲーム操作の気持ちよさを演出するには地味ですが欠かせないものです。


キー入力のInput.GetAxisを使えば、あっさり実装できてしまうのですが、
スマホで同じようなことを実現する方法が見つけられず、自作することになりました。

色々ググってみると以下の記事が参考になりました。
「イージングとはなんぞや？」という疑問もここで解決するでしょう！

・イージング処理の計算式 - 強火で進め
・土日 Flash のススメ(4)：動きをつけるということ（イージングについて考える）

しかし、上記を全部理解してやろうとしたら難しすぎたので、
実装自体はシンプルにしました。
（お手軽ですから）


[実装手順]
・-1.0〜+1.0のfloat変数axisValueを用意
・右（左）ボタンを押し続けるとaxisValueにTime.deltaTimeの値を加算（減算）、離すと減算（加算）　という処理を書く
・そのfloat変数に任意のfloat値valueを掛けて、transform.Translate()で移動。

ソースはこんな感じです。これを動かしたいオブジェクトにコンポーネントとして追加します。
public class easingTest : MonoBehaviour {
	float axisValue = 0; //-1〜+1の値
	public float value = 10.0f; //移動スピード

	void Update () {
		if (Input.GetKey("right")) {
			axisValue += Time.deltaTime;
			if (axisValue <= 0 ) {
				axisValue += Time.deltaTime;
			}

			if (axisValue >= 1.0f) {
				axisValue = 1.0f;
			}
		} else if (Input.GetKey ("left")) {
			axisValue -= Time.deltaTime;

			if (axisValue > 0 ) {
				axisValue -= Time.deltaTime;
			}

			if (axisValue <= -1.0f) {
				axisValue = -1.0f;
			}
		} else {
			if (axisValue > 0) {
				axisValue -= Time.deltaTime;
				if (axisValue <= 0) {
					axisValue = 0;
				}
			} else if (axisValue < 0 ){
				axisValue += Time.deltaTime;
				if (axisValue >= 0) {
					axisValue = 0;
				}
			}
		}

		transform.Translate(new Vector3(axisValue * value * Time.deltaTime, 0, 0 ));
	}
}

これでそれっぽい動きになります。
あとはif (Input.GetKey(“right”)) …とかの部分を、スマホでも使えるお好きな入力に書き換えれば完了。

ちなみにaxisValueにTime.deltaTimeを足したり引いたりしている箇所Time.deltaTimeに適当にfloatを掛けると
加速具合、減速具合を調整できると思います。



もし他に良い方法あればぜひ教えて下さい。


ではでは。

ブログを引っ越しました。

Unity,cocos2dxを中心とした、ゲーム制作の技術メモ。沖縄のゲームアプリ開発会社・ブリブサーのブログです。
ほぼ毎日更新中！下記リンクよりどうぞ。
ブリブサー開発戦線〜僕らはあの戦いを忘れない〜