【Unity1】ボタン長押しでゲージ(uGUIのImage)を溜め、ジャンプ力アップ！【ユニティちゃん縦スクロール9】

Unity5.1.1f1 Personal(2015年6月)

 

このコンテンツは、『ユニティちゃんライセンス』で提供されています

 

前回の続きです〜

 

今回は、ジャンプボタンを長く押せば押すほどジャンプ力が強くなる機能をつけたいと思います〜uGUIのImageも活用して、画面右上にジャンプ力ゲージも作ります！

 

uGUIについてより知りたい方は以下のエッセンスもご参照下さい〜

 

 

 

 

【目標】ジャンプボタン長押しでジャンプ力を強くする！

 

①ジャンプ力表示用のGUIを用意する

今回もuGUIを使います〜

 

 まずはHierarchy>Create>UI>Imageを選択し、画像表示用のGUIを作成します〜

 

 

今回はImageを２つ作成して下さい〜そして、Bar1とBar2と名づけましょう〜

 

 

今回使う画像はこちらです〜

 

 

こちらの画像をプロジェクト欄にドラッグ＆ドロップし〜

 

ドラッグ＆ドロップ！

 

続いてBarのInspectorから、SpriteModeをMultipleに設定し、SpriteEditorを開いて下さい〜

 

 

右上にSliceというところをクリックし、TypeはAutomaticのまま、Sliceして下さい！

 

 

すると画像が、2つのバーにカットされます〜

 

 

そのままSpriteEditorを閉じて、Applyしてください〜

 

 

それではBar1の設定からしていきます〜Bar1のInspectorビューを開いて下さい〜

 

まずはRectTransformにある四角いボックスをクリックし、AnchorPresetの設定をして下さい〜右上を選択し、altを押したままクリックするとAnchorを右上に設定し、ポジションも同時に変更してくれます〜

 

 

他のRectTransformの設定は以下の通りです〜PivotのXが0になっている点だけ注意して下さい〜そして、Image(Script)のSourceImageに、ピンクのバー画像を指定して下さい〜

 

 

バーが出現

 

こんな感じに、右上にBarのSprite画像が表示されました〜同じ要領でもうひとつbar2の設定をしていきましょう！

 

Bar2が上

 

GUIの描画順は、下にあるものほど上に表示されます〜ですので、さっき作ったBar1を下に、これから設定していくBar2を上に置きましょう！

Bar2の設定はBar1とほぼ一緒です〜

 

Bar2のInspector設定

 

Bar2がBar1に隠れているため、画面に変化はありません〜

 

 

Bar1のWidthを0にしてみましょう〜

 

Bar2出現

 

更にBar1のWidthを90にしてみましょう〜

 

 

90だけ左端からゲージが表示されます！

Bar1のRectTransformで、PivotのXを0にしたことを覚えているでしょうか〜これにより、画像の基点が左端になり、左から右へ画像が伸びるようになった感じです〜

 

次はスクリプトです〜画像のWidthとjumpPower変数を関連させていきます〜

 

②長押しで貯めたジャンプパワー分、上に力を加える

長押しは、Input.GetMouseButtonという機能を使います〜押し続けている間、処理を行い続けます！

 

似た種類のものにInput.GetButtonDown（ボタンを押した瞬間）と、Input.GetButtonUp（ボタンを放した瞬間）というメソッドがあります〜（余談）

 

今回は、1フレームにつき4ずつ増やす、300以上になった時ジャンプ力を0に戻すという処理を作ります〜以下ソースです！

 

 

このBarScriptはBar1に付けて下さい〜

 

public変数playerScriptを作成したので、Playerオブジェクトを指定します〜

 

ドラッグ＆ドロップ！

 

まずはStartメソッドでRectTransformコンポーネントを取得しています〜これで、Bar1のRectTransformをスクリプト上で使用できるようになりました〜

 

次にInput.GetMouseButton(0)（クリック中である）且つ、playerScript.isGrounded（ユニティちゃんが地面に付いている）時、ジャンプ力ゲージが増えます〜

isGrounded判定を追加しないと、ジャンプ中もクリックし続ければゲージが溜まってしまうので、注意です〜

 

画像サイズを変更する時は、RectTransformのsizeDeltaで設定します〜中身はVector2型(x, y)です〜

 

ゲージの横幅が300を超えたら0に戻しまた増えるというループをさせております〜

 

Input.GetMouseButtonUp(0)（クリックを離す）の条件を満たした時、PlayerScriptのJumpメソッドへ、ジャンプ力ゲージのサイズ（0〜300)を2.5倍した（0〜700）ジャンプ力を渡しております〜

 

ジャンプが終わったら、ジャンプ力ゲージを0に戻します〜

 

また、ジャンプゲージを溜めてながらジャンプする前に落ちるというケースも考えられるので、unityChanControllerのisGroundedがfalseだった場合、ゲージを0に戻します〜

 

続きまして、PlayerScriptを加筆修正致します〜

 

 

BarScriptからアクセスできるように、isGrounded変数とJumpメソッドをpublicにします〜また、jumpForceを受け取るために引数を追加します〜

 

不要になったjumpForce変数と、Updateメソッド内のJumpメソッドの呼び出しは削除しておいて下さい〜

 

 【結果】

 

長押しでゲージが増え、ゲージの長さによってジャンプ力が変わっています〜

 

今回はここまでです〜

ありがとうございました〜

 

【Unity開発1】キャラクターを自動で移動させる【ユニティちゃん横スクロールアクション2D:1/11】

【Unity開発1】壁にぶつかった時にキャラクターを反転させる【ユニティちゃん横スクロールアクション2D:2/11】

【Unity開発1】キャラクターをジャンプさせる！【ユニティちゃん横スクロールアクション2D:3/11】

【Unity開発1】キャラクターをカメラが追いかける！【ユニティちゃん横スクロールアクション2D:4/11】

【Unity開発1】uGUIを使って点数を表示する！【ユニティちゃん横スクロールアクション2D:5/11】

【Unity開発1】タイトル画面とゲームオーバー画面を作る！【ユニティちゃん横スクロール2D:6/11】

【Unity開発1】アニメーションを付ける！【ユニティちゃん横スクロールアクション2D:7/11】

【Unity開発1】バグ発見！無限にジャンプできちゃう！【ユニティちゃん横スクロールアクション2D:8/11】

【Unity開発1】ボタン長押しでジャンプ力を強くしたい！【ユニティちゃん横スクロール2D:9/11】

【Unity開発1】足場を下から突き抜けて、そのまま乗っかりたい！【ユニティちゃん横スクロールアクション2D:10/11】

【Unity開発1】ランダムで足場を自動生成する【ユニティちゃん横スクロールアクション2D:11/11(Fin)】