tabView in Vstack in Scrollview

I'm creating a view which is scrollable and has Vstack which include tabView

what I'm facing that when I added the TabView in Vstack , it's vanished unless I specify the height for the TabView

and when I specify the height of the tabview any lazy view inside it , it loose it's laziness because I already specify the height which means it render all it's content in advance .

BTW I have to use tabview because I need the paging effect :

here's the full code

 ScrollView{
        LazyVStack{
            
            Text("hello")
            
            
            TabView(selection: $selectedIndex){
                
                LazyVGrid(columns: columns2) {
                    ForEach(myItems.indices, id: \.self) { item in
                        Color.green
                            .frame(height: 150)
                            .overlay {
                                Text("\(item.description)")
                                    .foregroundStyle(Color.black)
                                    .font(.largeTitle)
                            }
                        
                    }
                    
                    .tag(0)
                    
                }
                
            }.frame(minHeight: 100)
          // if I removed this line the tabview will disappear 
 // and if I specify a big number the lazyVgrid is no longer lazy 
        }
    }