Popup

モジュールパス: /alier_sys/Popup.js

概要

Alierでいうポップアップとは画面内に表示する小窓のことです。Alierではポップアップを表示するために、 Popup クラスを提供しています。

Alierが提供するポップアップはフレームとコンテナで構成されています。フレームは PopupFrame を継承したクラスで、コンテナは PopupContainer を継承したクラスで構成されています。また、 PopupFrame と PopupContainer はどちらも ViewLogic を継承しています。

フレームはポップアップの外側を構成している要素です。ポップアップの種類や配置を決定しています。デフォルトはAlierが提供するフレームを使用します。フレームはユーザがカスタムすることも可能です。

コンテナはポップアップの内側を構成している要素です。ポップアップのコンテンツとなる、文章やボタンなどを決定づけるものです。コンテナはユーザが作成します。 PopupContainer を継承したクラスを作成し、その中でポップアップに表示する文章などを指定します。

Popupの構成

Alierが提供するポップアップはモーダル、モードレス、メッセージボックス、トーストの4つです。

ポップアップ	説明
モーダル	ポップアップの表示中にポップアップ外のユーザーの操作を受け付けないポップアップです。
モードレス	ポップアップの表示中にポップアップ外のユーザーの操作を受け付けるポップアップです。
メッセージボックス	メッセージをユーザに向けて表示するためのポップアップです。必要に応じてユーザが意思決定を行えるように設定できます。枠外の操作が不可能なため、モーダルポップアップに分類されます。
トースト	主に通知を表示する数秒以内に自動で消えるポップアップです。枠外の操作が可能なため、モードレスポップアップに分類されます。