別の画面に移動する
多くのアプリケーションには、エンドユーザーがやりとりを行うコンテンツを備えた複数の画面があります。ユーザーが画面間を移動できるようにするため、通常はリンクまたはボタンを使用します。
エンドユーザーがアプリケーションの画面間を移動できるようにする一般的なケースは、複数の項目があり、ユーザーが項目を選択して、選択した項目の詳細を新しい画面に表示できるようにする場合です。
モバイルアプリでこのようなナビゲーションを作成するには、以下の手順を実行します。
-
リストを表示する画面で、List Itemウィジェットを選択します。
-
List Itemウィジェットのプロパティで、On Clickイベントのハンドラとして対象画面を選択し、現在のリストアイテムの識別子を対象画面への入力引数として定義します。
Webアプリでこのようなナビゲーションを作成するには、以下の手順を実行します。
-
リストを表示する画面で、Linkウィジェットをリストに表示される項目の詳細と関連付けます。
-
Linkウィジェットのプロパティで、Destinationプロパティに対象画面を選択し、現在のリストアイテムの識別子を対象画面への入力引数として定義します。
モバイルアプリの例
GoOutモバイルアプリケーションには、位置情報にある場所を表示する［Home］画面があります。エンドユーザーが場所をタップすると、その場所の詳細画面に移動できるようにします。
このようなナビゲーションを作成するには、以下の手順を実行します。
-
Listウィジェットにある［Home］画面でリストアイテムを選択します。
-
プロパティエディタで、［Place］画面をOn Clickイベントのハンドラとして選択し、Place識別子を引数として渡します。
-
パブリッシュしてテストします。
Webアプリの例
場所のレビューや評価ができるアプリケーションであるGoOutWebには、すべての場所を表示するバックオフィス画面があります。場所を編集できる別の画面にユーザーが移動できるようにします。
このようなナビゲーションを作成するには、以下の手順を実行します。
-
［Places］画面を開きます。
-
場所を表示するテーブルに新しい列を追加します。
-
ツールボックスから新しい列のセルにLinkウィジェットをドラッグし、「Edit」と入力してリンクのテキストを定義します。
-
Linkウィジェットを選択し、プロパティエディタでDestinationを［PlaceEdit］画面に設定し、PlaceIdをPlaceTable.List.Current.Place.Idに設定します。
-
パブリッシュしてテストします。
