SwiftUI ScrollViewは、コンテンツがスクロールビューの境界に収まる場合、コンテンツを中央に配置しません

アンドリューズ

ScrollViewコンテンツがスクロールを必要としないほど小さい場合は、内部のコンテンツを中央に配置しようとしていますが、代わりに上部に揃えています。これはバグですか、それとも何かを追加できませんか?Xcodeの使用11.4 (11E146)

    @State private var count : Int = 100

    var body : some View {
//        VStack {
            ScrollView {
                VStack {
                    Button(action: {
                        if self.count > 99 {
                            self.count = 5
                        } else {
                            self.count = 100
                        }
                    }) {
                        Text("CLICK")
                    }
                    ForEach(0...count, id: \.self) { no in
                        Text("entry: \(no)")
                    }
                }
                .padding(8)
                .border(Color.red)
                .frame(alignment: .center)
            }
            .border(Color.blue)
            .padding(8)
//        }
    }

ここに画像の説明を入力してください

タネル

frame(alignment: .center)あなたが追加した修飾子は、それがまったく同じサイズの新しいビューでのビューをラップしているので、何の仕事をしません。そのため、ビューの位置を変更するための追加のスペースがないため、配置は何もしません。

あなたの問題の1つの潜在的な解決策は、全体をラップするだろうScrollViewGeometryReader利用できる高さを読み取ること。次に、その高さを使用して、子がそれより小さくならないように指定します。これにより、ビューがの中央に配置されますScrollView

struct ContentView: View {
    @State private var count : Int = 100

    var body : some View {
        GeometryReader { geometry in
            ScrollView {
                VStack {
                    Button(action: {
                        if self.count > 99 {
                            self.count = 5
                        } else {
                            self.count = 100
                        }
                    }) {
                        Text("CLICK")
                    }
                    ForEach(0...self.count, id: \.self) { no in
                        Text("entry: \(no)")
                    }
                }
                .padding(8)
                .border(Color.red)
                .frame(minHeight: geometry.size.height) // Here we are setting minimum height for the content
            }
            .border(Color.blue)
        }
    }
}

この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。

侵害の場合は、連絡してください[email protected]

編集
0

コメントを追加

0

関連記事

Related 関連記事

ホットタグ

アーカイブ