I created a new Single View App in Xcode 11.4.1 that uses Swift and SwiftUI. The project has 2 buttons with the options to show either popover 1 or popover 2. I don't receive any errors but only popover 2 works. My code is below.
I tried rearranging the position of the popover code but it did not make a difference. If the popover 1 code appears after the popover 2 code then only popover 1 works (instead of only having popover 2 work).
import SwiftUI
struct ContentView: View {
#State var popover1IsVisible = false
#State var popover2IsVisible = false
var body: some View {
VStack {
Button(action: {
self.popover1IsVisible = true
}) {
Text("Show Popover 1")
}
Button(action: {
self.popover2IsVisible = true
}) {
Text("Show Popover 2")
}
}
.popover(isPresented: $popover1IsVisible) {
VStack {
Text("Popover1")
Button(action: {
self.popover1IsVisible = false
}) {
Text("OK")
}
}
}
.popover(isPresented: $popover2IsVisible) {
VStack {
Text("Popover 2")
Button(action: {
self.popover2IsVisible = false
}) {
Text("OK")
}
}
}
}
}
struct ContentView_Previews: PreviewProvider {
static var previews: some View {
ContentView()
}
}
You can not add .popover twice to the view. Try to use it once and build the popover view dynamically depending on which button was clicked.
struct ContentView: View {
#State var showPopover = false
#State var popover1IsVisible : Bool = false
#State var popover2IsVisible : Bool = false
var body: some View {
VStack {
Button(action: {
self.showPopover = true
self.popover1IsVisible = true
}) {
Text("Show Popover 1")
}
Button(action: {
self.showPopover = true
self.popover2IsVisible = true
}) {
Text("Show Popover 2")
}
}
.popover(isPresented: $showPopover) {
VStack {
if (self.popover1IsVisible)
{
//Show first view
Text("Popover1")
Button(action: {
self.showPopover = false
self.popover1IsVisible = false
}) {
Text("OK")
}
}
else
{
//Show secondview
Text("Popover 2")
Button(action: {
self.showPopover = false
self.popover2IsVisible = false
}) {
Text("OK")
}
}
}
}
}
}
You can't attach two popovers to one view (VStack). Attach each popover to different views. You can attach .popover to Button.
Related
I have an issue with NavigationLinks with conditions. It doesn't react what I'm expected. When a user click on the button the function "test" must be called and give a return value. If the return value is true the "SheetView" must be openend directly without clicking on the NavigationLink text. Please could someone give me a help on this one. Thanks in advance
I made a small (sample) program for showing the issue.
import SwiftUI
struct LoginView: View {
#State var check = false
#State var answer = false
var body: some View {
NavigationView {
VStack{
Text("it doesn't work")
Button(action: {
answer = test(value: 2)
if answer {
//if the return value is true then directly navigate to the sheetview
NavigationLink(
destination: SheetView(),
label: {
Text("Navigate")
})
}
}, label: {
Text("Calculate")
})
}
}
}
func test(value: Int) -> Bool {
if value == 1 {
check = false
} else {
print("Succes")
check = true
}
return check
}
}
struct SheetView: View {
var body: some View {
NavigationView {
VStack{
Text("Test")
.font(.title)
}
}
}
}
The answer from Yodagama works if you were trying to present a sheet (because you called your navigation destination SheetView), but if you were trying to navigate to SheetView instead of present a sheet, the following code would do that.
struct LoginView: View {
#State var check = false
#State var answer = false
var body: some View {
NavigationView {
VStack{
Text("it doesn't work")
NavigationLink(destination: SheetView(), isActive: $answer, label: {
Button(action: {
answer = test(value: 2)
}, label: {
Text("Calculate")
})
})
}
}
}
func test(value: Int) -> Bool {
if value == 1 {
check = false
} else {
print("Succes")
check = true
}
return check
}
}
struct SheetView: View {
var body: some View {
NavigationView {
VStack{
Text("Test")
.font(.title)
}
}
}
}
struct LoginView: View {
#State var check = false
#State var answer = false
var body: some View {
NavigationView {
VStack{
Text("it doesn't work")
Button(action: {
answer = test(value: 2)
//<= here
}, label: {
Text("Calculate")
})
}
.sheet(isPresented: $answer, content: { //<= here
SheetView()
})
}
}
...
I have a form that I want to change views from if a Bool is false:
var body: some View {
NavigationView {
Form {
Section {
Toggle(isOn: $ClientAnswer) {
Text("Client answer")
}
if ClientAnswer {
Toggle(isOn: $submission.fieldOne ) {
Text("Field One")
}
Toggle(isOn: $submission.fieldTwo ) {
Text("Field Two")
}
}
}
Section {
Button(action: {
if self.ClientAnswer{
self.placeSubmission()
}
else {
ShowRS() //**change views here.**
print("test")
}
}){
Text("Submit")
}
}.disabled(!submission.isValid)
}
}
}
The code is being executed as print("test") works, but it doesn't change view it just stays on the same view?
The view I am trying to switch to is:
struct ShowRS: View {
var body: some View {
Image("testImage")
}
}
You have to include ShowRS in your view hierarchy -- right now, it's just in your Buttons action callback. There are multiple ways to achieve this, but here's one option:
struct ContentView : View {
#State private var moveToShowRSView = false
var body: some View {
NavigationView {
Button(action: {
if true {
moveToShowRSView = true
}
}) {
Text("Move")
}.overlay(NavigationLink(destination: ShowRS(), isActive: $moveToShowRSView, label: {
EmptyView()
}))
}
}
}
struct ShowRS: View {
var body: some View {
Image("testImage")
}
}
I've simplified this down from your example since I didn't have all of your code with your models, etc, but it demonstrates the concept. In the Button action, you test a boolean (in this case, it'll always return true) and then set the #State variable moveToShowRSView.
If moveToShowRSView is true, there's an overlay on the Button that has a NavigationLink (which is invisible because of the EmptyView) which will only be active if moveToShowRSView is true
I´m new in SwiftUI and I have the following problem. When I click the button on the iPhone the following comes up
but when I press the button on the iPad the following comes up
The picker is not on the whole sheet. How can I show the picker on the iPad on the whole sheet like on the iPhone?
struct ContentView: View {
#State var value_2 = 1
#State var show_1 = false
var body: some View {
VStack {
Button(action: {
self.show_1.toggle()
}) {
Text("Push")
}
.sheet(isPresented: $show_1) {
Sheet(show_0: self.$show_1, value_1: self.$value_2)
}
}
}
}
struct Sheet: View {
#Binding var show_0: Bool
#Binding var value_1: Int
var body: some View {
NavigationView {
number(value_0: $value_1)
.navigationBarTitle(Text("Enter number"), displayMode: .inline)
.navigationBarItems(trailing: Button(action: {
self.show_0 = false
}) {
Text("Done").bold()
})
}
}
}
struct number: View {
#Binding var value_0: Int
var body: some View {
Section {
Text("Headline")
Picker("",selection: $value_0)
{
ForEach(1..<101) { value in
Text("\(value)")
}
}
}
.labelsHidden()
}
}
As far as I understood your intention, you need just change a style of navigation view, like
var body: some View {
NavigationView {
number(value_0: $value_1)
.navigationBarTitle(Text("Enter number"), displayMode: .inline)
.navigationBarItems(trailing: Button(action: {
self.show_0 = false
}) {
Text("Done").bold()
})
}
.navigationViewStyle(StackNavigationViewStyle()) // << here !!
}
I am trying to navigate to another View when sheet is dismissed, but not to the original
#State var showOnboarding: Bool = false
Button(action: {
self.showOnboarding.toggle()
}) {
Text("Click me")
}.sheet(isPresented: $showOnboarding) {
DiscoverView(showOnboarding: self.$showOnboarding)
}
My question: It is possible to put something like .onDissapear{ NewView() } ?
If I understood your question correctly you can use onDismiss to perform actions when a sheet is dismissed:
.sheet(isPresented: $showOnboarding, onDismiss: {
// on dismiss
// here you can set some variables for presenting another sheet or navigating to some other views
}) {
DiscoverView(showOnboarding: self.$showOnboarding)
}
You can present another View programmatically using a NavigationLink with an isActive parameter:
NavigationLink(destination: NewView(), isActive: $linkActive) {
EmptyView()
}
Summing up your code can look like this:
struct ContentView: View {
#State var showOnboarding: Bool = false
#State var linkActive: Bool = false
var body: some View {
NavigationView {
VStack {
Button(action: {
self.showOnboarding.toggle()
}) {
Text("Click me")
}
NavigationLink(destination: NewView(), isActive: $linkActive) {
EmptyView()
}
}
}.sheet(isPresented: $showOnboarding, onDismiss: {
self.linkActive = true
}) {
DiscoverView(showOnboarding: self.$showOnboarding)
}
}
}
I have FavoritesView set with a navigationBarItem Button to display SettingsView as a modal sheet. However, both this button, and the Done button in the sheet only register and respond to some taps. I can't see any pattern to when the buttons will respond, but sometimes it can take 4 or 5 taps before the app responds! Any way to fix this behaviour?
FavoritesView:
import SwiftUI
enum ActiveSheet {
case details, settings
}
struct FavoritesView: View {
let speakers: [Speaker] = Bundle.main.decode("SpeakerTestData.json")
#State private var selectedModel: Speaker?
#State private var showingSheet = false
#State private var activeSheet: ActiveSheet = .settings
#EnvironmentObject var favorites: Favorites
#EnvironmentObject var settings: UserSettings
var filteredFavorites: [Speaker] {
let allSpeakers = speakers
var filteredItems: [Speaker] = []
for entry in allSpeakers {
if favorites.contains(entry) {
filteredItems.append(entry)
}
}
let sorted = filteredItems.sorted {
$0.model.localizedStandardCompare($1.model) == .orderedAscending
}
return sorted
}
var body: some View {
NavigationView {
List {
if filteredFavorites.count == 0 {
Text("Items you favourite will appear here.")
.foregroundColor(.secondary).padding(5)
} else {
Section(header: Text("Speakers")) {
ForEach(filteredFavorites) { speaker in
HStack {
Button(action: {
self.activeSheet = .details
self.selectedModel = speaker
self.showingSheet = true
}) {
SpeakerModelRow(speaker: speaker).contentShape(Rectangle())
}
.buttonStyle(PlainButtonStyle())
Spacer()
Button(action: {
if self.favorites.contains(speaker) {
self.favorites.remove(speaker)
} else {
self.favorites.add(speaker)
}
}, label: {
if self.favorites.contains(speaker) {
Image(systemName: "star.fill")
.foregroundColor(.blue)
.font(Font.title.weight(.ultraLight))
} else {
Image(systemName: "star")
.foregroundColor(.gray)
.font(Font.title.weight(.ultraLight))
}
}
).padding(5)
}
}
}
}
}
.navigationBarTitle("Favourites")
.navigationBarItems(trailing:
Button(action: {
self.activeSheet = .settings
self.showingSheet = true
}){
Image(systemName: "gear").font(Font.title.weight(.ultraLight)).padding(.trailing, 5).foregroundColor(.primary)
})
.sheet(isPresented: self.$showingSheet) {
if self.activeSheet == .details {
SpeakerDetailView(speaker: self.selectedModel!, showSheet: self.$showingSheet).environmentObject(self.favorites).environmentObject(self.settings)
} else {
SettingsView(showSheet: self.$showingSheet).environmentObject(self.settings)
}
}
}
}
}
SettingsView presented as a sheet:
struct SettingsView: View {
#EnvironmentObject var settings: UserSettings
#Binding var showSheet: Bool
#State var result: Result<MFMailComposeResult, Error>? = nil
#State var isShowingMailView = false
var body: some View {
NavigationView {
VStack {
//SettingsView Window
}.navigationBarTitle("Settings")
.navigationBarItems(leading: Button("Done") {
self.showSheet = false
})
}
}
}
It is known issue, try to use internal button content padding (either default or more), like
.navigationBarItems(leading: Button(action: {
self.showSheet = false
}) { Text("Done").padding() }