今回はデバッグ時に役立ちそうなアドオン「HyperLog」を紹介します。
目次
HyperLogアドオンの使い方
HyperLogとは
HyperLogとは、ゲームオブジェクトのパラメータを短いコードで表示できるようにするアドオンとなります。
ダウンロードは以下のページから行います。
![](https://2dgames.jp/wp-content/uploads/2022/02/Notification_Center-3-1024x408.png)
「Code」をクリックして「Download ZIP」を選びます。
プロジェクトを作成する
このアドオンを適用するプロジェクトを作成します。
そして先ほどダウンロードしたアドオンのファルダ内に存在する「addons」フォルダを「ファイルシステム」にドラッグ&ドロップして追加します。
![](https://2dgames.jp/wp-content/uploads/2022/02/Notification_Center-4-1024x458.png)
するとファイルシステム内に「addons/hyperlog」フォルダがコピーされます。
![](https://2dgames.jp/wp-content/uploads/2022/02/Notification_Center-5.png)
アドオンを使用する設定をする
次にメニューの「プロジェクト > プロジェクト設定」を選びます。
![](https://2dgames.jp/wp-content/uploads/2022/02/Notification_Center-6.png)
プラグイン設定
そして「プラグイン」タブを選び、HyperLogのステータス「有効」にチェックを入れます。
![](https://2dgames.jp/wp-content/uploads/2022/02/Notification_Center-7-1024x354.png)
これでプラグインが有効となります。
HyperLogを使用するスクリプトの例
使い方は先ほどのページに書かれています。
が、ここでも簡単に使い方を説明しておきます。
まずは 2Dシーン(Node2D)を作成して名前を「Player」にリネームします。
![](https://2dgames.jp/wp-content/uploads/2022/02/Notification_Center-9.png)
次に「icon.png」をドラッグ&ドロップして「Player」ノードの下にぶら下げます。
![](https://2dgames.jp/wp-content/uploads/2022/02/Cursor_%E3%81%A8_Notification_Center-1024x902.png)
ドラッグ&ドロップで配置すると Iconスプライトの位置が原点 (0, 0) からずれていると思うので、(0, 0) にリセットしておきます。
![](https://2dgames.jp/wp-content/uploads/2022/02/Notification_Center-10.png)
スクリプトをアタッチする
そうしたら「Player」ノードを選択してスクリプトをアタッチします。
![](https://2dgames.jp/wp-content/uploads/2022/02/Notification_Center-11.png)
extends Node2D
func _ready() -> void:
# ログを表示する
HyperLog.log(self).text("position>%0.2f") # 座標
HyperLog.log(self).text("rotation_degrees") # 回転角度
func _process(delta: float) -> void:
# 上下左右で移動する
var dir = Vector2()
if Input.is_action_pressed("ui_left"):
rotation_degrees -= 10
dir.x = -1
if Input.is_action_pressed("ui_right"):
rotation_degrees += 10
dir.x = 1
if Input.is_action_pressed("ui_up"):
dir.y = -1
if Input.is_action_pressed("ui_down"):
dir.y = 1
dir = dir.normalized()
position += dir * 500 * delta
HyperLog.log() にインスタンスを設定し、それにより返却されるインスタンスの text() 関数に表示したいプロパティを指定します。
上記のスクリプトでは、座標と回転角度を表示する設定となります。
では実行して動作を確認します。
![](https://2dgames.jp/wp-content/uploads/2022/02/hyperlog.gif)
フォントを大きくする
という感じでとても便利なHyperLogですが、個人的に気になったのが、フォントサイズが小さい、ということです。(Godot のデフォルトフォントが小さいためなので、これは仕方がないですけれども…)
なのでフォントを大きくする設定をしてみます。
デフォルトのフォントは解像度が低いので、mplusフォントを使用します。
以下のデータをダウンロードします。
こちらのデータにはテーマファイルとTTFファイルが含まれています。
- plus-1c-regular.ttf
- new_theme.tres
をファイルシステムにドラッグ&ドロップして追加します。
![](https://2dgames.jp/wp-content/uploads/2022/02/Notification_Center-12-1024x424.png)
なおフォントサイズは「32」px と大きめのサイズにしています。
大きすぎる場合は “new_theme.tres” ファイルをダブルクリックして、インスペクタからサイズを変更できます。
このあたりの設定方法は以下のページにまとめています
![](https://2dgames.jp/wp-content/uploads/2022/01/fonr-160x160.gif)
次に HyperLogが Labelノードを生成している部分を書き換えます。
「adding/hyperlog/trackers/tracker_text.gd」を開きます。
![](https://2dgames.jp/wp-content/uploads/2022/02/Notification_Center-13.png)
“tracker_text.gd” の 28行目あたりに Labelノードを生成しているコードがあります。
func _add_label(parent):
var label = Label.new()
# 独自のテーマを適用する
label.theme = load("res://new_theme.tres")
parent.add_child(label)
ここに “new_theme.tres” を読み込んでテーマを設定するコードを挟み込みます。
では実行してフォントサイズが大きくなっていることを確認します。
![](https://2dgames.jp/wp-content/uploads/2022/02/hyperlog-1.gif)
完成プロジェクトファイル
今回作成したプロジェクトファイルは以下からダウンロードできます。