はじめに

記事をお読み頂きありがとうございます！Reeenと申します。
私は現在、株式会社ゆめみで内定者アルバイトとしてiOSアプリの開発を行っています。
そこでScrollViewの縦方向の無限拡張で少し詰まり、この方法を発見したのでアウトプットをしようと思いました。
少しでも参考になれば幸いです🙇‍♂️

動作環境

Swift: 5.7.2
Xcode: 14.2
iOS: 15.0+

内容

まず前提としてSwiftUIのScrollViewでは以下のようなコードを書いても内容に合わせて自動で高さが調節されることはなく、無限拡張(.infinityのような挙動)になってしまいます。

ScrollView {
    Rectangle()
        .fill(.purple)
        .frame(width: 300, height: 300)
}
.border(.black, width: 5)

そこで、以下のコードを追加します。

@State private var contentHeight: CGFloat = 0.0

.overlay(
    GeometryReader { proxy in
        Color.clear.onAppear {
            contentHeight = proxy.size.height
        }
    }
)

.frame(maxHeight: contentHeight)

その結果、下記写真のようにScrollViewのサイズが自動で調整されました。

(紫色の部分がスクロールできます)

コードの全体

HogeView.swift

struct HogeView: View {
    @State private var contentHeight: CGFloat = 0.0

    var body: some View {
        ScrollView {
            Rectangle() //ここにScroll可能にしたいViewを設置してください
                .fill(.purple)
                .frame(width: 300, height: 300)
                .overlay(
                    GeometryReader { proxy in
                        Color.clear.onAppear {
                            contentHeight = proxy.size.height
                        }
                    }
                )
        }
        .border(.black, width: 5)
        .frame(maxHeight: contentHeight)
    }
}

struct HogeView_Previews: PreviewProvider {
    static var previews: some View {
        HogeView()
    }
}

最後に

ここまでお読み頂きありがとうございました！
もっと良い方法があれば教えてください！
SwiftUI頑張ります😁

はじめに

動作環境

内容

コードの全体

最後に

参考文献