Skip to main content

​
1. 適用シーン

情報の収集や製品の記録が必要なシーンに適しています。

​
2. フォームデザイナーの概要

YiDA の設定ページ全体を総称して「デザイナーページ」と呼びます。 ページ全体は「上部操作バー」「左側ツールバー」「中央キャンバス」「右側属性設定パネル」の 4 つの部分で構成されています。以下をご覧ください：

​
2.1 上部操作バー

​
2.1.1 フォーム設定

フォーム設定では、フォームレイアウト、送信時検証、各種フォームルールを設定できます。
注意：プロセス用のフォームデザイナーは若干異なり、フォーム検証はプロセス内で設定する必要があります。

​
2.1.2 ページ設定

ページ設定では、フォームページのレイアウトをカスタマイズし、ページのライフサイクルイベントに対するイベントコールバックを設定できます。
  • ページレイアウトについては、フォームレイアウトをご覧ください。
  • ライフサイクルコールバック

​
2.1.3 ショートカットキー

YiDA デザイナーには対応するショートカットキーも用意されており、設定をすばやく完了できます。以下をご覧ください。

​
2.1.4 グローバル検索

フォームコンポーネントが多い場合は、グローバル検索を使用して、必要なコンポーネントをすばやく特定できます。

​
2.1.5 履歴

YiDA デザイナーには履歴機能が用意されています。保存するたびに記録が自動的に保存され、最大 50 件まで保持されます。直近 50 件の保存記録を確認し、以前のバージョンへロールバックしたり、変更内容の詳細を確認したりできます。

​
2.2 左側ツールバー

​
2.2.1 アウトラインツリー

アウトラインツリーを使用すると、ページ全体のレイアウトをより明確に把握できます。アウトラインツリーから直接、コンポーネントのドラッグ＆ドロップや一括削除を行えます。
  • アウトラインツリーの項目をダブルクリックすると表示名を変更でき、同じタイプの複数のコンポーネントを区別しやすくなります。
  • 右上の「ピン留め」アイコンをクリックすると、アウトラインツリーパネルを左側に固定できます。
  • CMD / CTRL キーを押しながら操作すると、アウトラインツリーで複数選択できます。

​
2.2.2 コンポーネントライブラリ

コンポーネントライブラリのコンポーネントをクリックし、キャンバスまたはアウトラインツリーの目的の位置にドラッグします。コンポーネントをクリックして、キャンバスに直接挿入することもできます。

​
2.2.3 データソース

データソースでは、変数またはリモート変数を宣言してデータを動的に表示できます。 コンポーネントの属性設定で、コンポーネントをデータソースにバインドできます。 詳細はデータソースパネルをご覧ください。

​
2.2.4 JS アクションパネル

JS アクションパネルでは、JavaScript コードを記述して、よりカスタマイズされた要件を実現できます。 詳細は JS アクションパネル - フロントエンドコード開放をご覧ください。

​
2.2.5 国際化パネル

国際化パネルでは、多言語の文言を管理できます。コンポーネントの属性設定で、コンポーネントを多言語データにバインドできます。 詳細は「国際化」をご覧ください。

​
2.2.6 中央キャンバス

キャンバスは、コンポーネントを配置・設定してページを構築するために使用します。カーソルのガイド表示に従ってコンポーネントをドラッグ＆ドロップしたり、コンポーネントをコピー・削除したりできます。いずれの操作もショートカットキーに対応しています。

​
2.3 右側属性設定パネル

​
2.4.1 属性設定

属性設定は、コンポーネントの共通属性を設定するために使用します。変更はリアルタイムでキャンバスに反映されます。 {/} をクリックすると、現在の属性にデータバインディングを適用して、動的表示を実現できます。 注意：データバインディングの結果は、デザイナー内ではリアルタイムにプレビューできません。プレビュー環境で確認してください。 詳細はコンポーネント基本情報をご覧ください。

​
2.4.2 スタイル設定パネル

YiDA デザイナーには、画像・テキスト表示、レイアウトコンテナ、グループなどのコンポーネント向けに基本的なスタイル設定が用意されています。幅、高さ、背景を変更できます。以下をご覧ください： 詳細はカスタムスタイルの概要をご覧ください。

​
2.4.3 プレミアム

プレミアムは、主に特別な要件を持つコンポーネントの設定に使用します。 詳細はコンポーネント基本情報をご覧ください。 ① 一意の識別子：現在のコンポーネントの一意の識別子です。コード内で現在のコンポーネントインスタンスを取得する際に使用し、コンポーネントに対して高度な操作を実行できます。 ② マルチプラットフォーム表示：現在のコンポーネントをどのプラットフォームに表示するかを指定します。デフォルトではすべてのプラットフォームに表示されます。特定のプラットフォームで無効にすると、そのプラットフォームではコンポーネントがレンダリングされません。
注意：このオプションを設定した場合、データはサーバーサイドに送信されず、コードで現在のコンポーネントインスタンスを取得すると null が返されます。
③ データ送信：デフォルト値は「表示時のみ送信」です。フォームコンポーネントの「デフォルト状態」を「非表示」に設定した場合、デフォルトではデータはバックエンドに送信されません。非表示フィールドのデータを送信する必要がある場合は、このオプションを「常に送信」に設定してください。 注意：このオプションは、コンポーネントの「デフォルト状態」属性と連動します。 ④ アクション設定：コンポーネントのイベントコールバックを設定するために使用し、コードによって複雑なビジネスロジックを実装できます。詳細はアクションパネルの使用ガイドをご覧ください。