HSP3 hgimg4 gpbプレビューVSCode拡張機能を作ってみた

Posted at 2024-06-16

概要

Hot Soup Processor 3 hgimg4では、gameplay3Dを採用しており3Dファイルとしてgpbファイルを採用しています。このgpbファイル用の簡易プレビュー機能を提供するVSCode機能拡張を作ってみました。

gpbファイル選択時に簡易表示します。

プレビュー例

gpbファイルを選択するとロードが始まりプレビュー表示します

materialファイルハイライト例

色がつきます

フォントを格納したgpbファイルを選択するとフォントビットマップを表示します。

フォントプレビュー例

フォントビットマップをグレースケール表示します

gpbファイルを右クリックして「HSPGPB: gpbファイルをパースする」を選択するとHSP3とは関係なくバイナリをパースしてワイヤーフレーム表示します。材質、ノード変形などは適用されません。

gpbファイルパースの選択方法

gpbファイルで右クリックする

gpbファイルパース例

格納されているメッシュをワイヤーフレーム表示します

以下から hspgpb-vscode-0.1.1.vsixファイルをダウンロードして
VSCode拡張機能としてインストールしてください。

プレビュー機能はHSP3.7β8 hgimg4のWebGL版を使用して実現しています。
ワイヤーフレーム表示機能は threejs を使用しています。

プレビュー機能においてpath/to/piyo.gpb というファイルを選択した場合、path/to/piyo.material ファイルを探します。

その後、piyo.material に記載されている画像ファイルを探します。
path = res/hoge.png と記載されていた場合

プログラミング言語HSP3
https://hsp.tv