title: SwiftUI, White space between view and tabbar
body: <p>There is this mysterious white space between my view and custom tabbar which I cannot seem to remove with .edgesIgnoreSafeArea or .ignoreSafeArea. Does someone else experience the same problem/have a solution for this?</p>
  <p>I tried using different techniques and code but nothing seems to be working. I have added a label inside a VStack with a grey background to make the issue more visible. Please have a look and let me know if this might be a bug or an issue on my end.</p>
  <p>My code:</p>
  <pre><code>  import SwiftUI
  
      struct MotherView : View {
          @EnvironmentObject var viewRouter: ViewRouter
      
      var body: some View {
          
          
          GeometryReader { geometry in
              
              VStack {
              
                  
                      switch viewRouter.currentPage {
                      case .home:
                          
                                              
                          VStack {
                              Text(&quot;hello world&quot;)
                          }
                          .edgesIgnoringSafeArea(.bottom)
                          .frame(width: geometry.size.width, height: geometry.size.height - 50)
                          .background(Color(#colorLiteral(red: 0.501960814, green: 0.501960814, blue: 0.501960814, alpha: 1)))
                          
                          
                      case .search:
                          SearchView()
                          
                      case .favorites:
                          FavoriteView(fontSize: 12.0)
          
  
                      
                          case .settings:
                              SettingsView()
                              
                              
                      
      
      }
                      
                  Spacer()
                      
              
                  
  
                  
  
      VStack {
  
                      Divider().ignoresSafeArea()
  
                      HStack {
                          tabbarIcon(width: geometry.size.width, height: geometry.size.height, systemIconName: &quot;house&quot;, sytemFillIcon: &quot;house.fill&quot;, tabName: &quot;Home&quot;, assignedPage: .home)
  
                          tabbarIcon(width: geometry.size.width, height: geometry.size.height, systemIconName: &quot;magnifyingglass&quot;, sytemFillIcon: &quot;magnifyingglass&quot;, tabName: &quot;Search&quot;, assignedPage: .search)
  
                          tabbarIcon(width: geometry.size.width, height: geometry.size.height, systemIconName: &quot;bookmark&quot;, sytemFillIcon: &quot;bookmark.fill&quot;, tabName: &quot;Favorites&quot;, assignedPage: .favorites)
  
                          tabbarIcon(width: geometry.size.width, height: geometry.size.height, systemIconName: &quot;gearshape.2&quot;, sytemFillIcon: &quot;gearshape.2.fill&quot;, tabName: &quot;Settings&quot;, assignedPage: .settings)
                      }
                      .frame(width: geometry.size.width, height: geometry.size.height/10)
  
  
  
  
                  }
              
              
              
                  
                  
              
                  
                  
                  
              }
              .edgesIgnoringSafeArea(.bottom)
              
              
          }
      }
  }
  
  
  
      struct tabbarIcon: View {
      
      @State var scale : CGFloat = 1
      @EnvironmentObject var viewRouter: ViewRouter
      let width, height: CGFloat
      let systemIconName,sytemFillIcon, tabName: String
      let assignedPage: Page
      
      var body: some View {
          
          
              Button(action:{
                  
                  if viewRouter.currentPage != assignedPage {
                      viewRouter.currentPage = assignedPage
                  }
                  
                  
                  
                  
              } ){
                  VStack {
                      
                      
                      ZStack {
                          
                          Image(systemName: sytemFillIcon)
                              .resizable()
                              .aspectRatio(contentMode: .fit)
                              .opacity(viewRouter.currentPage == assignedPage ? 1 : 0)
                          
                          Image(systemName: systemIconName)
                              .resizable()
                              .aspectRatio(contentMode: .fit)
                              .opacity(viewRouter.currentPage == assignedPage ? 0.0 : 1)
                          
                          
                          
                          
                      }
                      
                      
                      
                      //4 icons so /4 of the width of the screen.
                      .frame(width: width/4, height: height/40)
                      
                      Spacer()
                      
                  }
                  .foregroundColor(viewRouter.currentPage == assignedPage ? Color(&quot;ShadowCard&quot;) : Color(&quot;Accentgreen&quot;))
                  
              }
          
              //Scaling effect when pressed
              .buttonStyle(ScaleButtonStyle())
              
              
          
          
          
          
      }
  }
  
  
      struct ScaleButtonStyle: ButtonStyle {
          func makeBody(configuration: Self.Configuration) -&gt; some View {
              configuration.label
                  .scaleEffect(configuration.isPressed ? 0.8 : 1)
                  .animation(.spring(response: 0.15, dampingFraction: 0.6, blendDuration: 1.5))
                  
          }
      }
  </code></pre>
  <p>Screenshot:
  <a href="https://i.stack.imgur.com/XFHc5.png" rel="nofollow noreferrer">mysterious white space</a></p>