レスポンシブユーザーインターフェイス

レスポンシブ動作により、画面サイズに関わらず、ビュー要素の最適なユーザー体験が提供されます。水平方向のスクロールを最小限に抑え、利用可能なディスプレイスペースで最大限にデータを表示します。 たとえば、ユーザーがタブレットの向きを横から縦に変えると、その動きに応じてUI画面の幅が狭まります。

レスポンシブ動作のオプションには、フォームのデザインレイアウトやテーブルの列の重要度などがあります。

ブレークポイントにより表示幅が定義されます。 デフォルトでは、Pegaのレスポンシブブレークポイントは自動的に設定されます。 表示幅がブレークポイントを超えると、レスポンシブ動作がレイアウトに適用されます。 ダイナミックレイアウトでは、レスポンシブブレークポイントの動作により、表示領域の幅に基づいてフィールドのレイアウトが変更されます。 

たとえば、デフォルトのブレークポイントでは4列が、タブレットでは2列、スマートフォンでは1列が表示され、小さい画面幅でもフォームが読みやすくなり、水平方向のスクロールは不要になります。

App Studioでは、フィールドのレイアウトは利用可能なデザインテンプレートに限定されます。 デザインテンプレートは、UIがどのように変化するかを決めます。 レイアウトテンプレートを変更するには、実行時にビューを設定します。

たとえば、1列のデザインテンプレートの代わりに2列のデザインテンプレートを使用するようにビューを設定できます。

次の問題に答えて、理解度をチェックしましょう。