iosswiftuitabviewhstackzstack

Show color on full screen in SwiftUI


I'm trying to show red color in full screen.

If I use edgesIgnoringSafeArea(.all) the screen automatically becomes scrolling enabled, which I don't want. Can you please advise me how to show red color on full screen without scrolling and without stretching because i change the color to image.

Any help would be greatly appreciated.


Sample code is given below.

import SwiftUI

struct PageSetup: View {

  @State private var tabSelection = 0

  var body: some View {
    ZStack {
      TabView(selection: $tabSelection) {
        ForEach(0..<5) { index in
          ZStack {
            Color.red
            Text("\(index)")
          }
        }
      }
      .tabViewStyle(PageTabViewStyle())
      .onAppear {
        UIScrollView.appearance().bounces = false
      }
      .tabViewStyle(PageTabViewStyle())
    }
  }
}

Output


Solution

  • If I understood what you wanted correctly, you are using ZStack and Color in wrong place. Your body should be like this code sample.


    struct PageSetup: View {
    
      @State private var tabSelection = 0
    
      var body: some View {
        ZStack {
          getColorForPage().ignoresSafeArea()
          TabView (selection: $tabSelection) {
            ForEach(0..<5){ index in
              Text("\(index)")
            }
          }
          .tabViewStyle(PageTabViewStyle())
          .onAppear {
            UIScrollView.appearance().bounces = false
          }
        }
      }
    
      func getColorForPage() -> Color {
        if tabSelection == 0 {
          return Color.red
        } else if tabSelection == 1 {
          return Color.blue
        } else {
          return Color.orange
        }
      }
    }