joogps / SlideOverCard

A SwiftUI card view, made great for setup interactions.
MIT License
1.07k stars 43 forks source link

Card hidden behind tab bar. #2

Closed Andreasgejlm closed 3 years ago

Andreasgejlm commented 3 years ago

When using a tab bar, and showing a SlideOverCard on a subview, the card is hidden behind the tab bar. Is there any way that the y offset could take into account the height of the tab bar?

Code to reproduce:

import SwiftUI
import SlideOverCard

struct ContentView: View {
    @State var tab: Int = 0

    var body: some View {
        TabView(selection: $tab) {
            View1()
                .tabItem { Image(systemName: "rectangle") }
                .tag(0)
            View2()
                .tag(1)
                .tabItem { Image(systemName: "rectangle") }
        }
    }
}

struct View1: View {
    var body: some View {
        Text("View 1")
    }
}
struct View2: View {
    @State var showCard: Bool = false

    var body: some View {
        ZStack {
            VStack {
                Text("View 2")
                    .font(.largeTitle)
                Button(action: { self.showCard = true }) {
                    Text("Show card!")
                }
                ScrollView() {
                    ForEach(0..<100) { i in
                        Text("\(i)")
                            .font(.caption)
                    }
                }
            }
        }
        .slideOverCard(isPresented: $showCard) {
            VStack {
                Image(systemName: "clock")
                    .font(.largeTitle)
                Text("Card is showing, but is cut off ...")
                    .font(.subheadline)
            }
        }

    }
}

struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}
joogps commented 3 years ago

Hi! I don't think there would be a simple way of detecting tab bars, specially because I don't think making the card higher would be a great design choice. Instead, I would suggest adding making the card to a "toast" view, or anything that comes over the TabView in your hierarchy... who knows, maybe I could even implement it to the library itself...

joogps commented 3 years ago

@Andreasgejlm okay so I know it's late but!!!! I think I fixed this

joogps commented 3 years ago

fixed in 2.0.0 :) sorry for being so late, but I finally did it!

sidkamaria1337 commented 3 years ago

fixed in 2.0.0 :) sorry for being so late, but I finally did it!

I'm still having trouble getting it in front of the tab bar. Would really appreciate a small example with v2.0.0 :)

joogps commented 3 years ago

hey @sidkamaria1337! take a look at the SOCManager class: https://github.com/joogps/SlideOverCard#manager