スクロールとオーバーフロー

プロトタイプモードでフレームを選択する際、右側のパネルでオーバーフローを伴うスクロールの効果を設定することができます。Pixsoは、水平方向のスクロール、垂直方向のスクロール、水平・垂直方向のスクロールの3種類のスクロールに対応しました。

(1) . 垂直スクロール

垂直方向のスクロールは、長いウェブページ（ショッピングアプリやニュースアプリなど）を閲覧した際の動作を想定し、フレーム内を上下にスライド、またはスクロールさせることができる機能です。

(2) .水平スクロール

水平方向のスクロールは、フレーム内で左右にスライドまたはスクロールし、その間に垂直方向の位置を維持することをサポートします。通常、スライドショーのようなスライドゾーンを作成するために使用されます。

(3) . 水平・垂直方向のスクロール

フレーム内の任意の方向への水平・垂直スクロールに対応しています。地図プレビューでは常に使用されます。

ヒント：オーバーフロー機能付きスクロールを使用するには、オーバーフローさせるコンテンツがフレームの枠を超える必要があります。

スクロールできる表示領域を設定する

1. プロトタイプで見える範囲を、外側のフレームとして作成します。この寸法がビューポートになります。
2. 縦長または横長の内容をその中に配置します。スクロールする方向に、外側のフレームよりも内容がはみ出している必要があります。
3. 外側のフレームを選び、プロトタイプパネルを開きます。
4. オーバーフローを縦、横、または縦横両方向のスクロールに設定します。
5. プロトタイプを再生し、はみ出した内容まで移動できることを確認します。

縦にスクロールするページでは内容を表示領域より高く、横にスクロールする帯状の領域では内容を幅広くします。地図のように両方向へ動かす領域では、縦横ともにはみ出す必要があります。

縦スクロールは、再生画面でマウスホイールまたはドラッグを使って確認できます。横方向や両方向のスクロールは、ドラッグして確認してください。

スクロールできない場合

• 内容が表示領域の横に置かれているのではなく、フレーム内に入っているか確認します。
• 設定した方向に、内容が表示領域からはみ出しているか確認します。
• 内容を含む外側のフレームにオーバーフローを設定します。
• デザインキャンバスだけでなく、プロトタイプの再生画面で確認します。