Skip to main content

 

 

 

Template:OutSystems/Documentation_KB/Breadcrumb_New_Layout

 

 

Template:OutSystems/OSLanguageSwitcher

 

 

 

OutSystems

画面テンプレートの作成に関するガイドライン

画面テンプレートは、開発者が優れたUXと性能を備えた画面を作成できるようにするために作成する必要があります。このドキュメントは、そのために役立ちます。

一般的に、以下に従う必要があります。

  • ターゲットモジュールでの重複を避けるため、公開されているブロックおよびUI要素を使用します。
  • 開発者が必要な画面テンプレートを見つけやすくするため、メタデータを入力します。
  • UIを十分サポートできるようにロジックを作成します。
  • できる限り再利用しやすい画面テンプレートにします。

画面テンプレートをテストし、エラーや警告がないようにします。開発者が画面テンプレートから画面を作成した後、画面をパブリッシュしてデモを実行できる必要があります。

データ置換のガイドライン

データ置換機能を使用すると、開発者はエンティティやアトリビュートをドラッグ&ドロップして、画面のデータソースや関連するラベルを置き換えることができます。これにより、開発者の作業速度を向上できますが、データ置換のエラーが大量に発生して、手動による修正が必要になると作業速度が低下してしまいます。

データ置換を適切にサポートする画面テンプレートを作成するためのヒントを以下に示します。

Aggregates

Aggregateの使用に関する主なポイントは以下のとおりです。

  • リスト、テーブルレコード、チャート、フォームなどの要素内では、Aggregateを使用してデータを読み込みます。
  • Aggregateの名前には「sample」という単語を使用しないでください。データ置換アルゴリズムのパフォーマンスに影響を及ぼす可能性があります。

デフォルトではないウィジェットで置換を有効にする

リスト、テーブル、フォーム、チャート以外の要素でデータ置換機能を提供するには、[Extended Properties]ペインでservicestudio-showRecordを追加して[True]に設定します。

Propertiesペイン

Expression

UI要素とアトリビュートがどのように連携しているかがすぐにわかり、画面のトラブルシューティングをすばやく行うことができるように、画面テンプレートを設計します。

データソース

ローカルソースとサーバーソースが混在しないように、ウィジェットのデータを設計する必要があります。データ置換では、サーバーデータ同士の置換とローカルデータ同士の置換のみを実行できます。

命名

ウィジェットには、Table、List、Formなどの一般的な名前を使用します。同一要素が複数ある場合は、MainTableやSecondaryTableのような名前を使用します。

ウィジェット名

プロンプト

プロンプトを設計する際は、一般的であるとともにエンティティ名とは異なるものにします。たとえば、「Search name or department」ではなく「Search」を使用します。

サンプルデータおよびビジネスロジック

あるユースケースに固有でデータモデルがわかっている画面テンプレートを作成する場合は、ビジネスロジックを実装するのが妥当です。それ以外の場合は、多くのケースで使用できるシンプルなロジックを目指します。

変数

カウンター、分離されたウィジェット、検索の実装などの変数がデータ置換されないようにするには、エンティティアトリビュートとは異なる名前のローカル変数を使用します。

参照およびコピーされたコンテンツ

汎用的なロジックを集約するためのモジュールを作成し、カスタム画面テンプレートモジュールでそこから要素を参照する必要があります。これにより、ターゲットモジュールには参照のみが追加されます。カスタム画面テンプレートモジュールのローカルでロジックを作成した場合、開発者がターゲットモジュールでコンテンツを複製することになります。

反対に、ターゲットモジュールにコンテンツをコピーする必要がある場合は、カスタム画面テンプレートのローカルでコンテンツを作成する必要があります。

カスタムスタイル

OutSystems UIフレームワークのCSSクラスか、デフォルトテーマのクラスを使用します。こうすることで一貫したデザインになり、ターゲットモジュールでCSSが重複しません。また、開発者がターゲットモジュールで互換性があるテーマを使用していない画面テンプレートを選択した場合、不適合に関する警告メッセージが表示されます。

プレビューおよびテスト

要素がIfツールのブランチ内で折りたたまれ、メインエディタのプレビューで正しく表示されない場合は、要素をコンテナ内にラップします。これにより、要素に親コンテナの全体幅が適用されてプレビューが修正されます。

Service Studioのプレビュー

「Work in progress」などのカテゴリを使用して、画面テンプレートが未完成であることが開発者にわかるようにします。

  • Was this article helpful?