Telling a View to show a Dialog from Another

Question

Created Mar ’22

Replies 3

Boosts 0

Participants 2

I was quite active in writing code in SwiftUI several months ago. I've forgotten how to use an ObservedObject object to channel a variable between two Views.

Anyway, I need to show a dialog over ContentView when I tap a button that is shown over another (RightView).

The following is my code.

// ContentView.swift //
import SwiftUI

class ObserveMonster: ObservableObject {
	@Published var showDialog = false
}

struct ContentView: View {
	@ObservedObject var observeManiac: ObserveMonster
	
	var body: some View {
		GeometryReader { geo in
			ZStack {
				HStack(spacing: 0.0) {
					LeftView()
						.frame(width: geo.size.width / 2.0, height: geo.size.height, alignment: .leading)
					RightView()
						.frame(width: geo.size.width / 2.0, height: geo.size.height, alignment: .trailing)
				}
				ShowDialogView(isShowing: observeManiac.showDialog) {
					
				}
				.frame(width: 500, height: 600, alignment: .center)
				.cornerRadius(10.0)
			}
		}
	}
}

struct ShowDialogView<Content: View>: View {
	let isShowing: Bool
	@ViewBuilder let content: () -> Content
	
	var body: some View {
		Group {
			if isShowing {
				Color.blue
			}
		}
		.animation(.default, value: isShowing)
	}
}

// RightView.swift //
import SwiftUI

struct RightView: View {
	@StateObject var observeManiac = ObserveMonster()
	
	var body: some View {
		ZStack {
			Color.red
			Button {
				observeManiac.showDialog.toggle()
			} label: {
				Text("Tap me")
					.font(.largeTitle)
			}
		}
	}
}

When I tap the button, the dialog (ShowDialogView) is no show. Does anybody now what I'm doing wrong? Thanks a million.

Answered by Tomato in 708508022

I guess I've solved my question as follows.

import SwiftUI

struct ContentView: View {
	@ObservedObject var monster: MonsterObservable
	
    var body: some View {
		GeometryReader { geo in
			ZStack {
				HStack(spacing: 0.0) {
					LeftView()
						.frame(width: geo.size.width / 2.0, height: geo.size.height, alignment: .leading)
					RightView(showMe: $monster.showDialog)
						.frame(width: geo.size.width / 2.0, height: geo.size.height, alignment: .trailing)
				}
				
				ShowDialogView(isShowing: monster.showDialog) {
					
				}
				.frame(width: 500, height: 600, alignment: .center)
				.cornerRadius(10.0)
			}
		}
	}
}

class MonsterObservable: ObservableObject {
	@Published var showDialog = false
}

import SwiftUI

struct RightView: View {
	@Binding var showMe: Bool
	
	var body: some View {
		ZStack {
			Color.red
			Button {
				showMe = true
			} label: {
				Text("Tap me")
					.font(.largeTitle)
			}
		}
	}
}

Boost

Answer 1

Claude31 OP

Mar ’22

How is LeftView defined ?

0

Answer 2

Tomato OP

Mar ’22

It's trivial as follows.

import SwiftUI

struct LeftView: View { var body: some View { ZStack { Color.green } } }

0

Answer 3

Tomato OP

Mar ’22

Accepted Answer

I guess I've solved my question as follows.

import SwiftUI

struct ContentView: View {
	@ObservedObject var monster: MonsterObservable
	
    var body: some View {
		GeometryReader { geo in
			ZStack {
				HStack(spacing: 0.0) {
					LeftView()
						.frame(width: geo.size.width / 2.0, height: geo.size.height, alignment: .leading)
					RightView(showMe: $monster.showDialog)
						.frame(width: geo.size.width / 2.0, height: geo.size.height, alignment: .trailing)
				}
				
				ShowDialogView(isShowing: monster.showDialog) {
					
				}
				.frame(width: 500, height: 600, alignment: .center)
				.cornerRadius(10.0)
			}
		}
	}
}

class MonsterObservable: ObservableObject {
	@Published var showDialog = false
}

import SwiftUI

struct RightView: View {
	@Binding var showMe: Bool
	
	var body: some View {
		ZStack {
			Color.red
			Button {
				showMe = true
			} label: {
				Text("Tap me")
					.font(.largeTitle)
			}
		}
	}
}

0