So I have two struct views located in different files. The first view is like a home screen. The second view is like a chat dialogue box. There is a button on the first home screen view that when it gets clicked I want the chat box view to appear on top of the home screen view.

Pictures:

1. Home screen view Issue discussion button that when clicked it will open chat box view
2. Issue discussion button clicked and is showing chat box view on top of home screen view

//Home Screen View

var body: some View {
    ZStack (alignment: .top){
        Button(action: {
            self.viewModel.toggleChatBox()
        }, label: {
            Text("Issue Discussion")
            Image(systemName: "message")
        })
        
        
        // ChatBox view that displays the chat box on the home screen
        
        ChatBox(tailNum: viewModel._781formInstance.tailId, issueNum: viewModel._781formInstance.issueNum, Form781aInstance: self)
            .background(Color(UIColor.white))
            .border(.black, width: 0.7)
            .frame(width: 270)
            .offset(x: self.viewModel.chatBox ? 0  : UIScreen.main.bounds.width)
    }
}

*I've omitted a lot of extra form the home screen view that I believe wasn't needed for this question, so let me know If you have questions or need more info

I need the ChatBox view to appear and disappear when the button is clicked. I'm currently just setting the offset based on a toggle chat box boolean var. When the var is true it will set the offset to the correct location on the screen. When false it will set the offset to be off the screen (so you cant see it). I'm doing this because for some reason Apple decided to make the .hidden() method be unconditional...

My issue is I'm getting weird behavior with the send and text box of the ChatBox. When I test it putting the chatbox in a navigation link then it behaves correctly but the navigation link takes the user to a new screen rather than displaying the chatbox over the home screen.

I'm wondering the correct way to display the chatbox view onto the home screen view

CodePudding user response：

Wrapping everything in an if clause should do the trick. As long as the var that stores the state is in a @Published wrapper and your viewModel is observed:

if viewModel.whatEverYourBoolIsCalled {
    ChatBox(tailNum: viewModel._781formInstance.tailId, issueNum: viewModel._781formInstance.issueNum, Form781aInstance: self)
        .background(Color(UIColor.white))
        .border(.black, width: 0.7)
        .frame(width: 270)
        .offset(x: self.viewModel.chatBox ? 0  : UIScreen.main.bounds.width)
        .zIndex(3000)
}