Skip to main content
Config Editor は、BRICKS Controller に搭載されたビジュアルエディターで、アプリケーションやモジュールの設定をブラウザで直接作成・編集できます。任意のアプリケーションやモジュールを開き、Config Editor をクリックして編集を開始します。
同じビジュアルエディターは CTOR にも エディタータブとして組み込まれています。CTOR では、保存すると編集内容がプロジェクトの bricks-ctor ソースにコンパイルされ、Git にコミットされます。一方、こちらでは保存するとクラウドのアプリケーション設定が直接更新されます。

BRICKS アプリケーションの仕組み

BRICKS アプリケーションは、UI、データ、ロジック、インタラクションを定義する JSON 設定上で動作します。BRICKS Foundation ランタイムがこの設定を読み取り、画面にアプリケーションをレンダリングします。 設定を作成する方法は 2 つあります: どちらも同じ JSON 設定を生成します。Config Editor から始めて、後から Generate Project でコードファーストのワークフローに切り替えることも、コードからデプロイして Config Editor で編集を続けることもできます。

アプリケーション構造

BRICKS アプリケーションは、組み合わせ可能なエンティティのツリーです:
Config Editor は、これらのエンティティを管理するための構造化されたインターフェースを提供します。

Subspace

Subspace は自己完結した機能単位です — 画面や機能モジュールと考えてください。各 Subspace には独自の Brick、Generator、Data、Canvas、Animation があります。アプリケーションはルート Subspace をエントリーポイントとして持ちます。 Subspace を使用してアプリケーションを論理的なセクションに整理します。一方の Subspace の Canvas 内から別の Subspace を参照することで、Subspace をネストできます。

Canvas

Canvas はビューレイアウトを定義します。フレーム座標(x、y、幅、高さ)を使用して、グリッド上にアイテム(Brick または Subspace 参照)を配置します。 Canvas のサポート機能:
  • ライフサイクルイベント — Canvas がアクティブまたは非アクティブになるときにアクションをトリガーする firstEnterenterexit イベント
  • Canvas の切り替え — マルチ画面フローで Canvas 間をナビゲートする
  • アイテムの配置 — 特定の座標とサイズで Brick と Subspace 参照を配置する

Brick

Brick はビジュアルなビルディングブロックです — コンテンツを表示してインタラクションを処理する UI コンポーネントです。 Brick はスタイル設定、アニメーション化、タップイベントへの応答が可能で、プロパティをデータに動的にバインドできます。

Generator

Generator はすべての外部 I/O とデータ処理を担います。アプリケーションを API、データベース、ハードウェア、AI モデルなどに接続します。各 Generator には、データノードにデータを供給するアウトレット(出力チャンネル)と、アクションをトリガーするイベントがあります。

Data

Data ノードはアプリケーションの状態を格納します。型付き(string、number、boolean、array、object)で、Brick や Generator のプロパティにリンクしてリアクティブな更新を行えます。Generator のアウトレットが値を発行すると、リンクされた Data が更新され、そのデータにバインドされた Brick が自動的に再レンダリングされます。

Data Calculation

Data Calculation はデータを変換する JavaScript 関数です。25 以上の組み込みライブラリ(lodash、moment、crypto など)を備えたサンドボックス環境で動作します。フォーマット、パース、または派生値の計算に使用します。

Animation

Brick のビジュアルエフェクトとトランジションを定義します。Animation はイベントによってトリガーでき、位置、不透明度、スケール、回転などのプロパティに適用できます。

アクションとイベント

アクションはイベントによってトリガーされるコマンドです。Brick と Generator はイベント(タップ、レスポンス、エラー、タイマーのティック)を発行し、以下のアクションに接続します:
  • Canvas を変更する
  • データを更新する
  • Generator をトリガーする
  • Animation を実行する
  • Subspace 間をナビゲートする

クイック編集

Short Edit を使用して、完全なリリースを作成せずに素早くプロパティを変更します。Short Edit を使用すると、参照によって個別の Brick や Generator のプロパティを変更でき、本番デバイスへの迅速な反復とライブ調整に役立ちます。 BRICKS CLI を使用してプログラムでクイック編集を適用することもできます:

設定の検証

Config Editor は編集中に BRICKS スキーマに対して設定を検証します。CLI から設定ファイルを検証することもできます:

Simulator

Config Editor のツールバーには Simulator ボタン(旧称 Web Preview)があり、デバイスなしでブラウザ上でアプリケーションを実行できます。現在の設定をコンパイルして、埋め込みパネルにレンダリングします。リサイズコントロールを使って、パネルを水平または垂直に分割できます。 Automation または Data Calculation の編集中は Simulator を使用できません。 デフォルトでは、Simulator はハードウェアと AI モデルを軽量な代替に置き換えます — カメラ、地図、サーマルプリンター、オンデバイスの LLM/STT/TTS はすべてローカルのスタンドインとして動作します。実際の実装を使用するには、メニューから Simulator Settings を開きます。 テストを記録するには、Record Events as Automations を使用します。操作が記録され、Auto Generated テストとして設定に書き込まれます。

保存とリリース

1

変更を保存する

Config Editor で Save をクリックして変更を保存します。これによりアプリケーションの作業中の設定が更新され、バインドされたデバイスに変更が自動的にデプロイされます。
2

バージョンをリリースする(オプション)

アプリケーション詳細ページに移動し、現在の設定をバージョン管理されたリリースとしてスナップショットするためのリリースを作成します(他のデバイスへのデプロイ用)。
Config Editor で保存すると、バインドされたデバイスに変更が自動的にデプロイされます。他のデバイスへのデプロイ用にバージョンをスナップショットしたい場合はリリースを作成してください。

コアリファレンス

すべての Brick、Generator、データ型、設定オプションの詳細なプロパティドキュメントについては、コアリファレンスを参照してください。

コアリファレンス

すべての BRICKS プラットフォームのエンティティとプロパティの完全なドキュメント。