Background color wrong when collapsed, changes tab bar color when opened and closed...

[LilMoke]

I am using the below code for the bottom sheet. With the bottom sheet, when the sheet is collapsed the background color is not set correctly. I have attached screenshots so you can see the issue.

When the bottom sheet is enlarged the background color is correct, but when it is collapsed it shows a white color. In addition, when th review is first shown it has a white background under the header.

When the bottom sheet is expanded and then collapsed it turns the tab bar white also.

1) What am I doing wrong? I believe it has something to do with the offset. And the scroll view. If I remove the scroll view the tab bar color is correct 2) or is there an issue with the package?

Bottom sheet when expanded:

Bottom Sheet after expanded then collapsed, changes tab bar:

Bottom sheet on first load of view:

Tab Bar when bottom sheet expanded:

` @EnvironmentObject var clipOfTheDayViewModel: ClipOfTheDayViewModel

@State private var opacity = 1.0
@State private var mirrored = 1.0
@State var bottomSheetPosition: BottomSheetPosition = .relativeBottom(0.175)

var body: some View {
    ZStack {
        GeometryReader { proxy in
            let size = proxy.size
            let screenWidth: CGFloat = size.width
            let imageWidth = (screenWidth)
            let imageHeight = (screenWidth * 16) / 9

            VideoPlayer(player: clipOfTheDayViewModel.cotdPlayer?.player)
                .tag(clipOfTheDayViewModel.cotdPlayer?.id)
                .frame(width: imageWidth, height: imageHeight, alignment: .top)

            Image("cotd")
                .resizable()
                .scaledToFit()
                .frame(width: imageWidth, height: 66, alignment: .center)
                .padding(.top, 56)
                .opacity(opacity)
                .onAppear {
                    Timer.scheduledTimer(withTimeInterval: 3.0, repeats: false) { _ in
                        withAnimation(.easeOut(duration: 0.5)) {
                            opacity = 0.0
                        }
                    }
                }
        }
    }
    .background(Color(UIColor(named: "MidnightDark")!))
    .edgesIgnoringSafeArea([.leading, .trailing, .bottom])
    .onAppear {
        if (clipOfTheDayViewModel.clipOfTheDay == nil) {
            clipOfTheDayViewModel.getClipOfTheDay()
        }
        if let player = clipOfTheDayViewModel.cotdPlayer {
            player.player?.play()
        }
    }
    .onChange(of: clipOfTheDayViewModel.cotdPlayer) { player in
        if let player = player {
            player.player?.play()
        }
    }
    .onDisappear {
        clipOfTheDayViewModel.cotdPlayer?.player?.pause()
    }
    .bottomSheet(
        bottomSheetPosition: $bottomSheetPosition,
        switchablePositions: [
            .relativeBottom(0.175),

// .relative(0.5), .relativeTop(1.0) ], headerContent: { VStack { Image("ic_up_chevron") .resizable() .scaledToFit() .frame(width: 46, height: 10) .scaleEffect(x: 1, y: mirrored) } .frame(maxWidth: .infinity, maxHeight: 40) .background(Color("Midnight")) }, mainContent: { VStack { ScrollView { // RisingStarList view Text("view 1").foregroundColor(Color.red) Spacer()

                    // MobileClips view for clipsPopular
                    Text("view 2").foregroundColor(Color.red)
                    Spacer()

                    // MobileClips view for clipsCreatedDate
                    Text("view3 ").foregroundColor(Color.green)
                    Spacer()

                    // MobileClips view for clipsFollowing
                    Text("view 4").foregroundColor(Color.blue)
                    Spacer()

                    Spacer(minLength: 80)
                }
                .padding(.top, 36)
            }
            .frame(maxWidth: .infinity, maxHeight: .infinity)
            .background(Color("Midnight"))
        }
    )
    .customAnimation(.easeIn)   //.speed(1.0))
    .showDragIndicator(false)
    .onDragEnded { x in
        print("onDragEnded: \(x.location.y) \(x.translation) \(x.startLocation)")
        if (x.location.y > 0) {
            //play
            clipOfTheDayViewModel.cotdPlayer?.player?.play()
        } else {
            //pause
            clipOfTheDayViewModel.cotdPlayer?.player?.pause()
        }
    }
    .background(Color("Midnight"))
}

} `

[LilMoke]

I have closed this issue as it is an issue with SwiftUI and the TabBar. The workaround was to make the tabbar not translucent and set its background color. It is not an issue with this package in case anyone else has a similar problem using it with a tabview.