4

I want to implement a custom ActionSheet, everything works fine except one thing, when getting in split view with the action sheet opened the touch area of the button from my custom action sheet is wrongly positioned. As you can see in the demo(at the end of it) I press on the button but nothing happens, but if I press a little bit higher the button is pressed, it looks somehow the touch area of the button is not over the button as it is supposed to be.

Here is a demo representing the problem:

enter image description here

Here is my code:

import SwiftUI

struct ContentView: View {
    var body: some View {
        ModalContent()
    }
}

struct ModalContent: View {
    @ObservedObject var actionSheetViewModel = ActionSheetViewModel.sharedInstance
    
    @Environment(\.horizontalSizeClass) var horizontalSizeClass
    
    var body: some View {
        if horizontalSizeClass == .regular {
            if actionSheetViewModel.showActionSheetCompact != false && actionSheetViewModel.showActionSheetRegular != true {
                actionSheetViewModel.showActionSheetCompact = false
                actionSheetViewModel.showActionSheetRegular = true
            }
        } else {
            if actionSheetViewModel.showActionSheetCompact != true && actionSheetViewModel.showActionSheetRegular != false {
                actionSheetViewModel.showActionSheetRegular = false
                actionSheetViewModel.showActionSheetCompact = true
            }
        }
        
        return Text("")
        .sheet(isPresented: Binding.constant(true)) {
            ZStack(alignment: .bottom) {
                Color.green.opacity(0.3)
                VStack {
                    Text("Modal").padding(.bottom, 10)
                    Button(action: {
                        self.actionSheetViewModel.showActionSheetCompact = true
                    }) {
                        Text("Show ActionSheet").frame(width: 300, height: 50).background(Color.red)
                    }
                    .popover(isPresented: self.$actionSheetViewModel.showActionSheetRegular){
                        ActionSheetRegular()
                    }
                    Color.clear
                }
                ActionSheetCompact()
            }
        }
    }
}

struct ActionSheetCompact: View {
    
    @ObservedObject var actionSheetViewModel = ActionSheetViewModel.sharedInstance
    
    var body: some View {
        if actionSheetViewModel.showActionSheetCompact == true {
            return AnyView(
                VStack {
                    Color.clear
                    Button(action: {
                        print("Action sheet button was pressed")
                    }) {
                        Text("Action Sheet").frame(width: 100, height: 45).background(Color.yellow)
                    }
            })
        } else {
            return AnyView(EmptyView())
        }
    }
}

struct ActionSheetRegular: View {
    
    @ObservedObject var actionSheetViewModel = ActionSheetViewModel.sharedInstance
    
    var body: some View {
        if actionSheetViewModel.showActionSheetRegular == true {
            return AnyView(
                VStack {
                    Color.clear
                    Button(action: {
                        print("Action sheet button was pressed")
                    }) {
                        Text("Action Sheet").frame(width: 100, height: 45).background(Color.yellow)
                    }
            })
        } else {
            return AnyView(EmptyView())
        }
    }
}

class ActionSheetViewModel: ObservableObject {
    @Published var showActionSheetCompact = false
    @Published var showActionSheetRegular = false
    
    static let sharedInstance = ActionSheetViewModel()
    
    private init() {}
}
Claudiu
  • 485
  • 1
  • 4
  • 17

0 Answers0