Skip to main content

 

参照

 

 

OutSystems

ナビゲーション

通常のナビゲーションおよび履歴によるナビゲーションを実行する機能と、ナビゲーション動作を上書きする機能(戻るなど)を提供します。CSSを使用して既存のアニメーションを上書きする代わりに、新しい遷移アニメーションを作成するために使用します。

以下のBackHandlersに関連するメソッド(registerBackNavigationHandlerおよびunregisterBackNavigationHandler)は、Androidの[Back]ボタンを押すなどの戻るアクションの動作を操作するときに使用します。一般的なユースケースとして、[Back]ボタンを押したときに前の画面に移動する代わりに単純にメニューを閉じる場合があります。

階層

ナビゲーション

概要

メソッド
navigateBack 「戻る」ナビゲーションを実行し、オプションで遷移アニメーションを使用します。
navigateForward 「進む」ナビゲーションを実行し、オプションで遷移アニメーションを使用します。
navigateTo 指定されたURLへのナビゲーションを実行し、オプションで遷移アニメーションを使用します。
navigatedFromHistory 現在の画面がブラウザの履歴から読み込まれたかどうかを確認します。
registerBackNavigationHandler 「戻る」ナビゲーションのときに呼び出されるコールバック関数をキューに登録します。
unregisterBackNavigationHandler 前に登録されたコールバックを登録解除します。

メソッド

navigateBack([transition: TransitionAnimation | string]): void

「戻る」ナビゲーションを実行し、オプションで遷移アニメーションを使用します。

登録された「戻る」イベントハンドラがある場合は、最後に登録されたものが実行されます。それ以外の場合は、前の画面へのナビゲーションが実行され、遷移アニメーションが使用されていた場合はその逆のアニメーションを使用して現在の画面に到達します。現在の画面がアプリケーションで最初に開かれた画面である場合は、アプリケーションを閉じます。

例:

// navigate to the previous screen using a 'Slide from Left' transition animation
$public.Navigation.navigateBack(3);

パラメータ:

  • (オプション) transition: TransitionAnimation | string
    既存の遷移のタイプ(0 = なし、1 = デフォルト、2 = フェード、3 = 左からのスライド、4 = 右からのスライド、5 = 下からのスライド、6 = 上からのスライド)か、遷移のアニメーションに使用されるCSSクラスのプレフィックスを表す文字列。値が指定されていない場合、現在の画面を開くときに使用されたアニメーションの逆が使用されます。

戻り値: void

navigateForward([transition: TransitionAnimation | string]): void

「進む」ナビゲーションを実行し、オプションで遷移アニメーションを使用します。

現在の画面が「戻る」ナビゲーションによって開かれた場合、「進む」ナビゲーションが実行されます。それ以外の場合、ナビゲーションは実行されません。

例:

// perform a forward navigation using a 'Slide from Right' transition animation
$public.Navigation.navigateForward(4);

パラメータ:

  • (オプション) transition: TransitionAnimation | string
    既存の遷移のタイプ(0 = なし、1 = デフォルト、2 = フェード、3 = 左からのスライド、4 = 右からのスライド、5 = 下からのスライド、6 = 上からのスライド)か、遷移のアニメーションに使用されるCSSクラスのプレフィックスを表す文字列。値が指定されていない場合、次の画面を最後に開いたときに使用された同じアニメーションが使用されます。

戻り値: void

navigateTo(url: string, [transition: TransitionAnimation | string], [replace: boolean]): void

指定されたURLへのナビゲーションを実行し、オプションで遷移アニメーションを使用します。

パラメータ:

  • url: 文字列
    移動先の相対URLまたは絶対URL。URLがアプリケーションの画面を参照している場合、 transitionパラメータの値に基づいて遷移のアニメーションが実行されます。それ以外の場合、通常のブラウザのナビゲーションが実行されます。
  • (オプション) transition: TransitionAnimation | string
    既存の遷移のタイプ(0 = なし、1 = デフォルト、2 = フェード、3 = 左からのスライド、4 = 右からのスライド、5 = 下からのスライド、6 = 上からのスライド)か、遷移のアニメーションに使用されるCSSクラスのプレフィックスを表す文字列。値が指定されていない場合、アプリケーションのエントリモジュールのデフォルトの遷移が使用されます。
  • (オプション) replace: ブーリアン値
    ナビゲーション時に、ユーザーが戻ることができる新しい履歴エントリを作成せずに現在の履歴エントリを置き換えるかどうかを示します。値が指定されていない場合、デフォルトはfalseです。

戻り値: void

navigatedFromHistory(): ブーリアン値

現在の画面がブラウザの履歴から読み込まれたかどうかを確認します。

戻り値: boolean

現在の画面がブラウザの履歴から読み込まれた場合はtrueを返し、それ以外の場合はfalseを返します。

registerBackNavigationHandler

registerBackNavigationHandler(handlerCallback: 関数): 数値

「戻る」ナビゲーションのときに呼び出されるコールバック関数をキューに登録します。

「戻る」イベントがトリガーされると、最期に挿入されたハンドラがキューから呼び出され、削除されます。登録されているイベントハンドラがない場合は、前の画面へのナビゲーションが実行され、現在の画面に移動するときに遷移アニメーションが使用された場合はその逆のアニメーションが使用されます。

例:

// prevent the user from navigating back when a custom sidebar menu is being displayed

var menuBackHandler = function() {
  hideSidebarMenu();
};

showSidebarMenu();
$public.Navigation.registerBackNavigationHandler(menuBackHandler);

// this back navigation will just hide the menu
$public.Navigation.navigateBack();

パラメータ:

  • handlerCallback: 関数
    「戻る」イベントが発生したときに呼び出されるコールバック。

戻り値: 数値

登録されたコールバックのID。

unregisterBackNavigationHandler

unregisterBackNavigationHandler(id: 数値): void

前に登録されたコールバックを登録解除します。

指定されたIDのコールバックが存在しない場合、アクションは実行されません。

パラメータ:

  • id: 数値
    登録解除されるコールバックのID。

戻り値: void

  • Was this article helpful?