Unityでインスペクターだけでスコアを管理できるスクリプトを作る

Unityの勉強です。

前回記事で3DボタンでDoTweenをかじってみたところ、オブジェクトの移動だけと言わず数値の増減だったら何でも…スコアの加算にも使える、というのを知って、取り組んでみました。

その前に、

今までUnityは3D部分しか見てなくて、UIは全然わからなかったのですが、要点は

・UI独特の座標系列であるRect Transformは、Alt押しながら左上の四角マスをクリックして位置決めする

・レイアウトをギズモ操作するには、SceneとGameウィンドゥ別表示しないと無理

・テキストはoverwflowに切り替え重点

・UIボタンはデフォがクソダサすぎるので、ImageにButtonコンポーネントをアタッチして作るほうがいい。

・3DボタンはUIとは別系統で、もっと自由に制御できる

---

●スコア管理のロードマップ

足し算の実装ごときに、いちいちテキストエディタ開いてプログラム作るとかバカげてる!

その一方で、貧相なUIでは素人丸出しでつらい、我慢できない!

見た目リッチなスコア表示が即使えるんだったら、ゲーム作るモチベが上がるってもの。

インスペクタ上から引数を渡せて、スコア表示まで全部やってくれるスクリプトを作れたら、ずっと使い回せるだろう-

-という理念に基づき、仕様を考えたらば

1.パブリックでスコアの変数を作り、スコア表示する場所を指定できるようにする

2.スコア増加の処理をするユーザー関数を作る

3.加算点を引数にして、イベントで外から呼び出せるようにする

これで、テキストエディター一切開かずスコア計算&表示できるシステムが実現できるのではと思い立ちました

---

●DotWeenを導入

Tween系アセットでは一番メジャーらしいですね。

iTweenは重くて、LeanTweenは最も軽いけど難しすぎるとか

フリー版は自分で制御コード書く必要があります。しかもサンプルコードは一切ありません

有料版は買えないわけじゃないけど、今回はあえてプログラムの勉強に無料版でがんばります

●スコア管理スクリプトと3Dボタン改

スコアの表示と足し算を同時に行い、アニメーションしながら加算するスクリプトを作りました。

ついでにスコア加算用の3Dボタンのスクリプトもつけて、こんな感じになります

箱は3Dボタンで、押すとマウスクリックイベント発動で-これもDoTweenの力で-

ぴょこっとアニメーションして、同時にスコアの関数に得点を与えて呼び出します。

スコアの関数は得点を加算して、スコア表示のフォントサイズと色もトゥイーンします。

各ボタンはそれぞれ得点と設定が違い、

得点の大きさに比例してスコア表示も派手になります。

スコアと3Dボタンの各設定の説明はねんのため画面に全部列挙

●スクリプトの説明

・スコア管理用スクリプト

コードはこんなです↓。（初めてgithub使ってみたけどweb表示させるとこ以外全くわからん）

ScoreCounter.csて名前でスクリプトを作って、空オブジェクトに貼り付けて使います

・3Dボタン用スクリプト

このスクリプトは、長押しやドラッグ向きに3x2種の設定を用意してます。Timeはボタンクリックの時間が2つぶん設定できます。

すべての項目を使う必要はありません　使う変移だけ数値を書けばいいです

DoTweenTransit1.csて名前でスクリプトを作って、3Dオブジェクトにイベントトリガーとともに貼り付けて使います

こちらは、ボタンのクリックなどに向いたPunchスクリプト

DoTweenPunct1.CSという名前でスクリプトを作って、上と同様に3Dオブジェクトにイベントトリガーとともにアタッチします。

コードは

作り方

※サンプルプロジェクトをアップ…したいけどDotWeenつけたままアップはだめだろなので、自作のレシピだけ説明します。

1.DotWeenは事前にインポートしてセットアップしておきます

2.シーンに、カンバスと、イベントシステムと（カンバスを作ると自動作成されます）、

スコア用テキストフィールドと、ボタン操作用のなにか…3Dオブジェクトを作成します。

3.スコア管理用スクリプトを収めるための空オブジェクトを作ります

ここまでで、こんな構成になります↓ 当然説明テキストは不要です

4..メインカメラにマウスボタン検出用のレイキャスターをアタッチします。

5.上で公開してる3つのコードを作って、3Dボタンとスコア管理用オブジェクトにそれぞれアタッチして、設定します。

スコア管理用

インスペクターから各種設定をします。

ScoreTextの欄には、必ずスコア表示用のUIテキストフィールドを指定します。

スコアの初期値、テキストのフォントサイズと色などを指定します

フォントサイズはでたらめな数が入力できないようにスライダー式にしてあります

3Dボタン用1

トランスフォーム各種とTime1、2の欄を書きます

イベントトリガーには3Dボタンとスコアカウントのオブジェクトを選択して、画像にある名前の関数を選びます。

画像の例では、マウスボタンを押したときと離したとき、2つのイベントを作ってそれぞれ関数を選んでます。6つある設定のうち使うのは2つだけです。元の位置・サイズに戻るように設定しないと3Dボタンが画面外に消えたりします。

ボタンアクションはオマケなので、動かなくてもいいならスクリプトも設定もいりません。スコアカウントのイベントのとこだけでいいです

3Dボタン用2

3Dボタン1と同様に、設定します

パンチは、ボタンクリックのイベント一つ分だけ設定すればいいのでこちらが楽です。

6.実行ボタンで動作確認、エラーでずに動いたら成功です

以下、よまなくていいコードの説明と苦労話

[SerializeField]に、", Range(1f, 100f)"とか追記すると入力できる範囲を限定できます

DoTweenは、トゥイーンが終わる前に次のトゥイーンを実行しようとすると、アニメーションが上書きされて位置やスケールとかがずれてしまいます。スコアだとカウントアップ中のポイントがかき消されます。(相対変化しないカラーとかは問題なし)

対策に、transform.DOComplete(true);とかで阻止してます。

でもスコアアップの上書き阻止は構文がわからなくて未実装です

…if構文とか変数の型とか、概念は知ってても構文の細かいとこが覚えられない

囲うのは()だったか{}だったか、いちいちググって書くからコーディングはしこたま遅いです。

一番ひっかかったのは、floatとintをまぜた計算の仕様。

得点=整数から補正値=小数をわり出したくて、intの変数を割り算に使ったら、

floatの変数に代入してるにもかかわらず答えは整数になる つまり1/10が0.1にならず0になる、のに気づくのに苦しめられた。

全てに備えるために、めぼしい数値は全部floatにしようと思った

DoTweenの構文はもっと魔境でした。ネット上の豊富なお手本がなきゃ手も足も出なかったよ

オブジェクトのトランスフォームより、単純な変数の変移のほうが逆に難しいとは。

シーケンスとかまじでわからない。パンチはお手軽で便利なのに、意外やスコアなど単純な数値の変移ができない、あるいは構文が見つからなかった。

まあ苦労せず複雑なことしたかったら有料版買ってねということかなー

---

UIまで込みのスコア計算なんて、

アセットが絶対あると思うんですが、見つからない…素人が思いつくんだから絶対あるはずなんだけど。ハイスコアの更新と保存まで考えると流石に面倒っすよ

#ゲーム開発 #アセット #Unity #DoTween