俺に解るように説明する "Godot Engine 3.x" 入門+

ゲームエンジン Godot Engine に関すること。入門とか使い方とかチュートリアルとか、あれとかこれとか。日本語解説。

"Godot Engine" エアホッケー Part2 日本語表示をしたいのだが......ラベルノード

いろいろ気になって先に進めない病の俺だが、頑張って一歩でも進んで行きたいと思う。具体的には、そう、スタート画面にゲームのタイトルを表示させたい。

Godot では、シーンにノードを追加することでゲームを作成していく。これが基本概念。お絵かきソフトのレイヤーに図形を入れていくような事と同じだ。順を追って進んで行こう。

ノードの追加

シーンパネルの [+] ボタンを押す。

f:id:ore2wakaru:20170803161759p:plain

こんな窓が開く。Godot Engine で使える全てのノードの一覧だ。「どのノードを追加いたしましょうか?」って聞いてきている。

f:id:ore2wakaru:20170803170422p:plain

ノードには全てアイコンマークが示されていて、色分けされている。それぞれの色が何関係のものかと言うと、

  • 緑: UI 
  • 青: 2D
  • 赤: 3D 
  • 黄: アニメ
  • 白: その他、一般

こんな感じだ。めちゃくちゃに色がつけられている訳ではない。

特に、上の画像でハイライトされている緑アイコンのノード「Control」は、緑チームの一番先頭に位置するチームリーダー。UI 関係ノードの子分をいっぱい引き連れている親分的存在だ。こいつのことをベースノードと言ったりする。

UI 関係のベースノードが「Control」なら、2D 関係は「Node2D」、3D 関係は「Spacial」がそれぞれベースノードとなる。3親分体制だ。(ただ、本当の親分は一番上に出てる白アイコンの「Node」っていうやつ。こいつが大親分。)

左の [>] のマークを押して、どんな手下を抱えているのか、見るだけ見てみよう。

f:id:ore2wakaru:20170803173856p:plain

いっぱいある。さらに子分を持っているノードも出てきた。[>] を押せば、もっと出てくる。大抵、ここで、一回はイヤになる。「ぐはっ、めんどくせ、こんなに覚えられない。」って。

だが、大丈夫だ。基本的に、UI、2D、 3D の3つのカテゴリがあるって思えばいい。使い方に関して言えば、各カテゴリー内では共通事項がいっぱいある。ひとつ覚えると、連続して分かってくる。どれか一つちゃんと覚えれば、次のを覚える労力は、前の 1/3 くらいにはなる感じ。覚えれば覚えるほど、その先に行くのが格段に楽になる。そんな感じだ。

「Label」ノード

で、数あるノードの中でどれを追加するかなんだが、ゲームタイトルの表示をしたいと思っているので、それに対応出来るノードにする。

画面にテキスト文字を表示させる事が出来るノードとして、「Label」ノードというのがあるので、これにする。[>] マークを押して開いていって探してもいいが、検索欄に、"label" と入力して表示を絞り込む方がすっきりする。アイコンの色が緑なので、UI 関係のノードだと分かる。

選択出来たら、ダブルクリックか、[作成] をクリックだ。

f:id:ore2wakaru:20170803182440p:plain

上手くいくとこうなる。

f:id:ore2wakaru:20170803192247p:plain

色々気になる事(1. 横についてる丸いマーク。2. 一個いっこの意味。3.4. はなくて。5. [Anchor](アンカー)っていうのは、、、)もあるが、別の機会に説明するとして、先に進む。

インスペクターパネルの “Text” と書いてあるところの右のアイコンをクリック。

f:id:ore2wakaru:20170803224458p:plain

すると、ビックリする程でかい、テキスト入力窓が開く。([閉じる] ボタンが発見困難っす。)

なんとこれ、入力行は1行だけという事ではなく、複数行いける。(アイコンも何か複数行イケまっせという見栄えだった。) 普通に改行すればいいので、2行で、

と入れてみよう。終わったら、右下の [閉じる] を押すか、この窓以外の適当な所をクリックだ。

f:id:ore2wakaru:20170803225937p:plain

マルポチと線で囲われた四角の部分がテキストの表示場所だ。あまりにも表示がハジッコ過ぎるし、小さくて見難い。

マウスの真ん中ボタンドラッグでパン、クルクルして拡大。または、四角をマウスドラッグで移動させてきてもいい。見やすい所にもってこよう。で、どうだろうか?

f:id:ore2wakaru:20170803231604p:plain

うむ。残念ながら、日本語が書かれた部分は見えないようだ。いけるのは、半角英数字だけか? インターフェースに日本語が出るのに、なぜ? 日本語は入力出来ても出力は出来ない? と思うだろうが、結論から言うと、「日本語もイケる」。だが、やり方は次回にまわそう。

シーンの保存

今回、大したことをやってないので、セーブせずに [x] で破棄してもいいのだが、一応シーンにノードが追加出来た事を記念して、セーブしておこうと思う。

メニューの [Scene] > [Save Scene As..]、

f:id:ore2wakaru:20170803234948p:plain

名前を付けて保存だ。名前は好きに付けてくれ。(俺はそのままにしたけど。) 拡張子は、3つから選べるが、最初からなっているやつ “.tscn” のままでいい。(".tscn" はテキストエディタで中身が見える。text の t と scene の scn か?)

f:id:ore2wakaru:20170804001317p:plain

以下、2つほど確認してから、エディタを終了させよう。

f:id:ore2wakaru:20170804002033p:plain



今回やったのは、「シーン」に「ラベルノード」を追加するって事。これをお絵かきソフトに例えるなら、「レイヤー1」に「テキスト文字」を書いてみました。って感じかな。

次は日本語部分の表示。と、文字の大きさも調整して、ゲーム画面で使うのと同じに見えるよう出来たらいいな。



【おまけ】

  • ノードの追加はショートカット [Ctrl] + [A] でいける。
  • お気に入りボタン [★] は、一回押すと欄に追加。もう一回押すと、欄から消える。
  • シーンの保存で、上書き保存は、 [Ctrl] + [S] が楽ちん。