Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

TabView with PageTabViewStyle() not using available height in ScrollView

so I have a TabView like shown below, but when I try to implement it in a ScrollView I always have to give it a fixed height. Is there a way of telling the tabview to use the space it needs in the scrollView? I don't know the height of the inner content (which btw. changes over time) of the TabView, so a fixed height doesn't work for me.

I tried .frame(maxHeight: .infinity), but that doesn't seem to work

import SwiftUI

struct TEST: View {
    var body: some View {
        ScrollView {
            TabView {
                Text("Hello World")
            }
            .tabViewStyle(PageTabViewStyle(indexDisplayMode: .never))
            .frame(maxHeight: .infinity)
            // only .frame() with fixed Height works...
        }
    }
}
like image 668
Paul Avatar asked Sep 30 '20 11:09

Paul


1 Answers

You need to use a fixed height like the screen height because the scrollview has infinite height. So when you set an infinite height on object inside the scrollview it takes only the space that the content really needs. I recommend you to use a the screen height on your TabView like this :

.frame(height: UIScreen.main.bounds.height)

Or to use a GeometryReader that gives you the height taken by the ScrollView and then apply it to the TabView frame like this :

struct MyView: View {
     var body: some View {
          GeometryReader { proxy in
               ScrollView {
                    TabView {
                         Text("Hello World")
                    }
                    .tabViewStyle(PageTabViewStyle(indexDisplayMode: .never))
                    .frame(height: proxy.size.height)
                }
            }
    
        }
}
like image 120
Hans Rietmann Avatar answered Sep 21 '22 13:09

Hans Rietmann