独自のネイティブUIを作る

用意されたコントロールでは足りない場合に、ネイティブの描画を拡張します。

まずは用意されたコントロールを使います。アプリ固有のUIが必要な場合は、プラグインの実験的な拡張APIでSwiftUIやAndroid Composeの実装を追加できます。

Engineは描画とWebからの反映を担う下位レイヤーです。独自ホストやレンダラーを実装する際に統合ガイドやリファレンスを参照します。標準導入の前提知識として読む必要はありません。

状態と操作を共有し、表示を拡張する

表示する値とWebの操作対象を公開する、読み取り専用のDOM readerを定義します。ネイティブ側はその値を描画し、宣言された操作を呼び出します。Webの要素を状態の基準とフォールバックUIに保ち、readerへの業務ロジックの移動やSwiftUI・Composeへの二重実装はしません。

Web側の定義とネイティブ側の実装はアプリ内に置けます。別のnpmパッケージやCapacitorプラグインを作る必要はありません。対応するプラットフォームごとに同じ定義に対応するネイティブ実装を登録します。まず実験的な拡張ガイドを使い、独自ホストや描画統合を作る場合にEngineを直接扱います。