SwiftUI View with TextField and SecureField buggy on macOS (shows strange view) - macos

On macOS I need a SwiftUI form that has a TextField (for email) and then a SecureField (for password). Seems simple, but when I start typing in the TextField a strange view appears below the field:
Some observations:
This does not happen if the SecureField is replaced by a TextField.
This does not happen if the TextField is removed.
A similar strange view will also appear when I start to type in the SecureField.
The strange views will disappear and reappear as I change focus between the fields.
Finally, this does not happen if the SecureField is placed before the TextField (maybe I should start a new trend in UI design;-).
Can somebody suggest a way to avoid or work around this issue? Here is the code (simplified as much as possible):
import SwiftUI
struct ContentView: View {
#State var emailAddress : String = ""
#State var password : String = ""
var body: some View {
Group {
TextField("Email:", text: $emailAddress)
SecureField("Password:", text: $password, prompt: nil)
}
.padding()
Spacer()
}
}
Xcode 13.4.1; macOS 12.5; MacBook Pro (2020). Also happened with Xcode 13.4 and macOS 12.4.x.
Update 2022.08.13:
Per request from Multi Media here is a screenshot with strange view that appears when typing in the SecureField. Here I've added an additional TextField, as suggested (although not with zero height, so that it is visible in the screenshot).
Also I should note that you can make the strange view disappear, e.g. by pressing the ESC key.

Had this same problem on macos 12.5.1, without changing anything else, I installed macos 13 beta 6, and the bug was fixed. It appears to be an odd interaction between SecureField and either TextField or TextEditor on macos 12.

I found how to solve the problem,just add focusable() to the secureField,you can try,it works for me!

I don't know the reason why this is happening (maybe it should give you suggestions like the SecureField), but apparently this is not the case when you have the same TextField above the real one.
This isn't perfect, since there is minimal Space on the top, but it works and is better than the strange window:
import SwiftUI
struct ContentView: View {
#State var emailAddress : String = ""
#State var password : String = ""
var body: some View {
VStack {
TextField("Email:", text: $emailAddress)
.frame(width: 0, height: 0)
TextField("Email:", text: $emailAddress)
SecureField("Password:", text: $password, prompt: nil)
}
.padding()
Spacer()
}
}
I have tested it with Xcode 14 beta 3 and my MacBook Pro M1.

Related

How to collapse sidebar with SwiftUI on Mac

I am building a full screen function which is supposed to hide the navigation bar and the side bar. However, I have only found a way to toggle the sidebar using NSApp.keyWindow?.firstResponder?.tryToPerform(#selector(NSSplitViewController.toggleSidebar(_:)), with: nil), which is not working well in my case because I cannot detect if the side bar is visible or not on mac (.onDisappear does not seem to be called on mac when the sidebar collapses).
Below is a simplified example of my NavigationView. I did not use NavigationSplitView because it does not work in my case unless I use some nasty hacks (which leads to crashes too).
let data: [String] = createData()
NavigationView {
List(data, id:\.self) { item in
NavigationLink {
DetailView(item)
} label: {
Text(item)
}
}
DetailView("Nothing Selected")
}

XCode Preview with Color Loop for SwiftUI Previews not working anymore

Before XCode 14, the following syntax was working well to loop through the different color schemes.
static var previews: some View {
ForEach(ColorScheme.allCases, id: \.self) {
MyView()
.preferredColorScheme($0)
}
}
Starting XCode 14, this results in
PreviewUpdateTimedOutError: Updating took more than 5 seconds
I suspect, this has to do with the new button in XCode to display the Color Scheme Variants in Preview now, but i rather like the old behaviour back.
Any ideas how to do that?

How do I stop double clicking a NavigationLink opening a second window view?

Writing a Macos app. The following code just puts up a simple navigation list. Everything is fine with single clicking the Row links and displaying the Detail row.
If you double click the NavigationLink, another window opens with only the Text view on it. During my testing, there was a button to dismiss the view on the detail window, and if clicked, the original window would close leaving this stripped down view open.
I have to assume that no one else is seeing this since I cannot see anything from other people.
Does anyone have any ideas what would cause this to happen?
import SwiftUI
struct ContentView: View {
var body: some View {
HStack {
NavigationView {
List(0..<100) { row in
NavigationLink(destination: Text("Detail \(row)")) {
Text("Row \(row)")
}
}
}
}
}
}
Just use sidebar list style explicitly
List(0..<100) { row in
// ... content here
}
.listStyle(SidebarListStyle()) // << here !1
Tested with Xcode 13.2 / macOS 12.1

Xcode 12.3 puts any new piece of content in a new preview

import SwiftUI
struct ContentView: View {
var body: some View {
Text("Hello")
Text("World")
}
}
struct ContentView_Previews: PreviewProvider {
static var previews: some View {
ContentView()
}
}
The code above results in two preview windows: one with text "Hello", second window holds "World"
Every time I add something like Text() or whatever, it appears in the second preview window. Adding more elements automatically leads to new preview windows. THe code in the PreviewProvider remains the same, so it's not duplicate previews, it just the separate previews for EACH element...
I tried to restart Xcode, change simulator devices, create new projects - nothing changes.
It started after I added duplicate preview in one project and then deleted it by removing appropriate lines in the PreviewProvider. After that all new projects or all new files in old projects show this strange behaviour.
The body by default is a #ViewBuilder in SwiftUI 2.0, so it just generate a group of views inline, thus having two Text element you got two previews. If you want just one Preview your body should have the one top view, like
struct ContentView: View {
var body: some View {
HStack {
Text("Hello")
Text("World")
}
}
}
You have to put the two Text elements into a Container, like e.g. a VStack.

How can I resolve this Xcode OptimizationLevelError error while previewing simple swiftui code in canvas?

I've been successful using SwiftUI for a few months with very little Xcode experience. I'm trying to add some simple help screens that I would like to preview in the SwiftUI canvas. However, I'm receiving the following error:
OptimizationLevelError: not building -Onone
The message is shown when pressing the "diagnostics" button. Problem persists after pressing "try again" button.
Xcode: Version 11.3 (11C29)
Catalina: 10.15.2 (19C57)
The code could not be simpler:
import SwiftUI
struct HelpSortView: View {
var body: some View {
VStack {
Text("You can sort the list by Name, Sail Number, Class, or Favorites.")
.lineLimit(10)
VStack(alignment: .center) {
Image("help-sort")
}
}
}
}
struct HelpSortView_Previews: PreviewProvider {
static var previews: some View {
HelpSortView()
}
}
It turns out that I had my Xcode scheme, Build Configuration set to Release instead of debug. In Xcode, select Product, Scheme, Edit Scheme, Run (on left side), Info tab, Build Configuration, set drop-down to Debug.

Resources