Genta Hirauchi

公開日:2020/08/31
更新日:2020/09/03

【SwiftUI】ScrollViewでスクロール画面を実装する方法を解説

  • SwiftUIで、スクロール画面を実装したい
  • スクロールバーを非表示にしたい

SwiftUIでは、ScrollViewを使用することで、簡単にスクロール画面が実装できます。

本記事では、ScrollViewの基本的な実装方法と、スクロールバーを非表示にする方法について解説致します。

目次

ScrollViewの実装

基本的な実装

ScrollViewは、以下のように実装します。

ScrollView(スクロール方向) {
    スクロールしたいView
}

ScrollViewの引数には、スクロールしたい方向を指定します。
縦にスクロールしたい場合は.vertical
横にスクロールしたい場合は.horizontal
を指定します。

デフォルトでは、.veticalが指定されておりますので、縦にスクロールしたい場合は、何も指定しなくでも大丈夫です。

以下は、10個のTextを、縦と横にスクロールさせるサンプルコードです。

スクロールバーを非表示にする

続いて、スクロールバーを非表示にする方法についてです。
スクロールバーを非表示にするには、イニシャライザの引数に、showsIndicators: Boolを追加します。

showsIndicatorsのデフォルト値はtrueです。showsIndicatorsにfalseを指定することで、スクロールバーは表示されなくなります。

以下は、先ほどのサンプルのスクロールバーを非表示にしたコードです。

スクロールバーが表示されなくなりましたね。
以上、ScrollViewでスクロール画面を実装する方法についてでした。