UIScrollView で縦スクロールを実現する!!
XcodeでUIScrollViewを使って、横幅は画面幅に固定の状態で、縦スクロールのみする画面を作成していこうとおもいます。
Viewを削除して、UIScrollViewを設置
まず、Main.stroyboardに初期で配置してあるViewを削除し、代わりにUIScrollView を設置します。
さらに、そのUIScrollView内にViewを配置します。
また今回は、スクロールしていることがわかりやすいように、View内に、imageView を配置してあります。
横幅を固定する
内側のViewの横幅を画面幅に固定にするために、UIScrollViewとViewのwidthを同じに設定します。
スクロールするコンテンツの高さを設定
スクロールするコンテンツの高さを設定するために、Viewの高さを設定します。
下の画像では、900にしてあります。
Viewに制約をつける
ここが縦スクロールを実現するポイントになります。
Viewの上下左右に制約を付け加えます。
※このとき、ScrollViewに対して制約がついてることを確認してください。
UIScrollViewとView の高さは異なりますが、制約でそれぞれの距離を0にすることで、縦スクロールを実現することができるようです!!
InterfaceBuilderを見やすく
最後にInterfaceBuilderから見やすくするために、ViewControllerから、Simulated SizeをFreedomにし、Heightを900に変更しておきましょう。
シミュータで確認すると、しっかり縦スクロールができていると思います!!
おまけ
こちらもどうぞ
このブログのTwitterアカウントを作成しました!!
フォロー待ってます!!
twitter.com
