【初心者向け】UnityでScrollViewを使ってみよう！
Unityを使い始めたばかりの方にとって、UI要素はちょっと難しく感じるかもしれません。その中でも、たくさんのコンテンツをスクロールして表示する機能は、スマホアプリやメニュー画面でよく使われる基本中の基本です。今回は、Unity標準のUIコンポーネント「ScrollView」を使って、簡単にスクロールできるリスト画面を作る手順をご紹介します。
ScrollViewとは？
ScrollViewは、UnityのUIシステム（UGUI）で用意されているコンポーネントの一つで、縦または横方向にコンテンツをスクロール表示するための枠組みです。
例えば、スマートフォンゲームのアイテムリストや、オプションメニューなどで、画面サイズに収まりきらない情報を表示するときに大活躍します。
環境準備
•Unity Editor（2020以降であればOK）
•新規のUnityプロジェクトを用意（3D/2Dどちらでも構いませんが、今回はUIメインなので2DでもOK）
•Canvas上にUIを配置する基本を把握していることが望ましいですが、初めてでも大丈夫です。
基本的な設置手順
1.CanvasとEventSystemを用意
新規のシーンを作成すると、CanvasとEventSystemが自動生成されます。もしない場合は、
•メニューから GameObject > UI > Canvas をクリックでCanvas生成
• 同じく GameObject > UI > Event System をクリックでEventSystem生成
これでUI関連の基本基盤がそろいます。
Scroll View
├── Viewport
│ └── Content
• Scroll View：スクロール領域全体を管理するコンポーネント
•Viewport：表示範囲を決めるための「窓枠」
•Content：実際にスクロールされる中身（画像やテキストを入れる場所）
2.Contentのサイズとアイテム追加
ScrollView > Viewport > Contentオブジェクトを選択します。ここにテキストやボタン、画像などを並べていくことで、表示領域を超える量のコンテンツを作れます。
たとえば、GameObject > UI > Text (Legacy) を選んで、Contentの子要素にテキストを複数配置してみてください。テキストが表示領域(Viewport)より多く並ぶと、スクロールバーを使って上下に移動可能になります。
3.ScrollViewのパラメータ調整
Scroll View本体を選択すると、インスペクターにはScrollRectコンポーネントがあります。ここで次の設定が行えます。
•Horizontal/Vertical：左右・上下いずれの方向にスクロールするか
•Movement Type：スクロールが範囲外へ行ったときの動き（Elastic、Clampedなど）
•Scroll Sensitivity：スクロール速度の調整
初心者の方はまずデフォルト設定のまま、垂直スクロールを試してみると良いでしょう。
4.スクロールバーの利用
デフォルトでScroll Viewを作成すると、スクロールバー(Scrollbar Vertical)が自動的についてきます。
スクロールさせると、このバーが移動し、全体のどの位置を見ているかが視覚的に分かるようになっています。
不要な場合は、このScrollbarを削除したり、ScrollRectコンポーネントのVertical ScrollbarをNoneにすることで非表示にできます。
実際に試してみよう！
1.簡単なセットアップ
• 新規シーンを作成し、GameObject > UI > Scroll View を追加します。
• Scroll View > Viewport > Contentの子要素に、UI > Text (Legacy)を5つほどコピペして縦に並べます。
•シーンを再生ボタンで実行してみてください。マウスホイールやタッチパッド、エディタ内でドラッグするとテキストが上下にスクロールできるのが分かります。
2.サイズ調整のポイント
Contentは表示領域よりも大きくする必要があります。ContentのRectTransformを選び、Heightの値をViewportよりも大きく設定しましょう。テキストを増やしたり、Spacingを広げることで自然にスクロールできる量が増えます。
3.見た目を整える
背景色やフォントサイズ、テキストをアイテムボタンに変えたり、Layout GroupやContent Size Fitterを組み合わせて整然と並べることも可能です。
Horizontal Layout GroupやVertical Layout Groupを使えば、アイテムを一定間隔できれいに並べることができます。
よくあるトラブルシューティング
•スクロールしない！
ViewportよりContentが小さいとスクロールできません。Contentのサイズやアイテム数を確認しましょう。
•スクロールバーが動かない！
ScrollRectコンポーネントでVertical Scrollbarが正しく割り当てられているか確認してください。また、ScrollbarがViewport外に配置されていないか、Anchorsの位置にも注意が必要です。
•操作感が悪い
ScrollRectのScroll Sensitivityを変更してみたり、Inertiaを有効/無効にしてスクロールの慣性を調整すると良いでしょう。
まとめ
UnityのScrollViewは、画面に収まりきらない情報をスムーズに表示するための標準UIコンポーネントです。初期設定のままでも簡単にスクロールできるようになっているため、初心者の方でも簡単に扱えます。
慣れてきたら、Content Size FitterやLayout Groupを組み合わせて、動的に生成したアイテムをリスト表示したり、カスタムしたスクロールバーで見た目を統一したり、応用的な使い方にも挑戦してみましょう！