Skip to main content

 

 

 

 
Language:

 

 
Service Studioバージョン :
 
 
OutSystems

UIフロー

UIフローは、画面やブロックをグループ化する要素です。UIフローのインスタンスは、すべて[Interface]タブのUI Flowsの下に表示されます。

Service StudioのUIフロー

新しいアプリを作成すると、[Interface]のUI FlowsにデフォルトのUIフローがすでにいくつか含まれています。

  • Common。アプリが画面やブロックで再利用するUIやロジックが含まれます。メニュー、サインインしたユーザーの情報、サインインロジックなどです。
  • Layouts。画面のレイアウトを定義するブロックが含まれます。
  • MainFlow。デフォルトのUIフローです。これを利用してアプリに画面を追加することができます。新しいアプリでは、このUIフローは空になっています。

Common UIフローとLayouts UIフローのデフォルトコンテンツを編集する際は、アプリのすべての画面が影響を受ける可能があることに注意する必要があります。

新しいUIフローを追加する

新しいUIフローを追加するには、Service Studioで以下の手順を実行します。

  1. Interface]タブに移動し、UI FLowsフォルダを右クリックします。

  2. ヘルプメニューで[Add new UI Flow]を選択します。

    ヘルプメニューとAdd new UI Flowオプション

UIフローのテーマを設定する

UIフローに追加したすべての画面では、モジュールのデフォルトテーマを使用します。UIフローThemeプロパティを編集すると、テーマを変更できます。

デフォルト画面を設定する

デフォルト画面は、リアクティブWebアプリではインデックスページ、またはモバイルアプリではホーム画面です。デフォルト画面はモジュールに1つのみ設定でき、家のアイコンが表示されます。

UIフローのインデックスページ/ホーム画面

画面をデフォルトとして設定するには、Service Studioで以下の手順を実行します。

  1. デフォルトとして設定する画面に移動します。
  2. 画面を右クリックし、ヘルプメニューで[Mark as Default Screen]を選択します。

UIフローエディタ

UIフローをダブルクリックすると、UIフローエディタが開きます。このエディタでは、以下を行うことができます。

  • 画面間の関係を参照する
  • UIフローがサポートする要素をツールボックスからドラッグする

UIフロー内でコネクタを描くことができますが、これらの接続は表示のみであるため、画面間のやりとりを定義する必要があります。

ツールボックスの使用

画面やブロックを作成するには、ツールボックスから要素をUIフローエディタにドラッグします。使用可能なツールボックスの要素は、作成するアプリのタイプによって異なります。

UIフローツールボックスと要素

画面のスキャフォールディング

エンティティをUIフローエディタにドラッグすると、アクセラレータが開始します(スキャフォールディング)。たとえば、エンティティをUIフローエディタにドラッグすると、処理ロジックを含む2つの画面(項目を一覧表示する画面と項目を編集する画面)が自動的にスキャフォールディングされます。

自動的に作成された画面

従来のWebアプリのUIフロー

従来のWebアプリのUIフローには、アプリでURLを定義するエントリポイントがあります。Is Defaultプロパティが「True」に設定されているエントリポイントは、アプリのインデックスページです。

また、従来のWebアプリのUIフローには、UIフローのすべての画面に適用されるセキュリティ設定があります。

  • Was this article helpful?