Deki Editor

概要

Deki のシーンを開き、編集し、再生し、出荷するためのデスクトップアプリです。エンジンを同じプロセス内で動かすので、C++ で書いたコンポーネントはプラグイン DLL にコンパイルされ、すぐにインスペクターに表示されます。パッケージも同じ仕組みで読み込まれます。

現在は Windows に対応しています。Linux でもネイティブのファイルダイアログ付きで動作します。

ダウンロード

エディターは無料のオープンソース（Apache 2.0）です。各リリースにはプラットフォームごとにアーカイブがひとつあり、コンパイラーも同梱されています。好きな場所に展開してDekiEditor を実行するだけです。C++ ツールチェーンも含め、ほかにインストールするものはありません。

最新リリースは GitHub から入手できます。各アーカイブの横には SHA-256 が記載されています。

Windows 版はまだコード署名されていないため、初回起動時に SmartScreen の「Windows によって PC が保護されました」ダイアログが表示されます。詳細情報をクリックし、実行を選んでください。自分でビルドする場合は、ソースとセットアップガイドがgithub.com/dekiengine/deki-editor にあります。

パネル

ヒエラルキーは複数選択できるツリーです。ドラッグで親を変えたり並べ替えたりでき、構造の編集も値の編集と同じ元に戻す（アンドゥ）履歴に記録されます。

インスペクターは自動で作られます

フィールドに DEKI_EXPORT タグを付けます。C++26 の静的リフレクションによるコード生成がビルド時にそれを拾い、プロパティ記述子とそのシリアライズを出力します。ほかに登録するものはありません。

DEKI_CATEGORY("Demo")
DEKI_DESCRIPTION("Bobs the object up and down on a sine wave.")
class Bobber : public Deki::Component
{
public:
    DEKI_EXPORT DEKI_SLIDER(0, 64)
    float amplitudePx = 12.0f;

    DEKI_EXPORT DEKI_SLIDER(0, 4)
    float speedHz = 0.6f;

    void Awake() override;
    void Update() override;
};

ウィジェットも記述子が選びます。範囲付きの float にはスライダー、色にはカラーピッカー、AssetRef<T> にはアセットピッカー、enum にはドロップダウンです。

ほかの属性：DEKI_TOOLTIP、DEKI_GROUP、メートル単位の値をピクセルで編集するDEKI_UNIT(px)、別の値が許すまでフィールドを隠す DEKI_VISIBLE_WHEN、ビルドから除外する DEKI_EDITOR_ONLY。

見たままがデバイスに描画されます

プレイモードでは、ハードウェアと同じ RenderToBuffer() の経路で、パネルの実際のサイズのままシーンを動かします。編集モード、プレイモード、ボードの表示は一致します。レンダラーのプレビューではなく、同じひとつのレンダラーだからです。

ホットリロード

編集後にエディターにフォーカスを戻すと、HotReloadService がソースツリーの差分を取り、パッケージとプラグインの DLL をアンロードし、CMake でビルドし直し、コンポーネントエディターを登録し直します。その間もシーンは動いたままです。

思いどおりに動く元に戻す（アンドゥ）

すべての編集はコマンドで、コマンドはまとめられます。スライダーをドラッグしても、元に戻す履歴は何百件ではなく 1 件です。複数選択中の編集は、選択したすべてのオブジェクトに適用されるひとつのコマンドにまとめられます。

ビルドと書き込み

ビルドパネルはボードの設定を読み込み、ツールチェーンを最後まで実行します。プラットフォームの CMake を生成し、ファームウェアをビルドし（ESP32 は ESP-IDF 経由）、アセットを .tex、MessagePack の .scene、ベイク済みフォントとして storage/ にエクスポートし、USB で書き込みます。同じエクスポートで、オフライン起動用の SD カードも作れます。

スクリプトで操作する

エディターには MCP サーバーが入っています。--mcp を付けて起動すると、シーン、アセット、パッケージマネージャー、ビルド、スクリーンショットの撮影を JSON-RPC で操作できます。何もない状態からプロジェクトを作り、スクリーンショットを撮るところまでこれで行えます。このサイトにあるエディターの画像は、すべてこの方法で作りました。