英文:
No tap animation when clicking a Button inside a Form in SwiftUI
问题
I am using a Form in SwiftUI based on a tutorial from YouTube, and I have placed some components inside it. However, when I tap the button, it doesn't show the tap animation (For example, when I tap a Button in the iOS settings app the button background will change) when I lightly tap it once. Here is my code:
var body: some View {
Form {
Section(header: Text("Input:")) {
TextField("Add Some text here", text: $text)
}
Section(header: Text("Letter: Count")) {
let charCount = text.filter({ $0 != " " }).count
if (charCount > 30) {
Text(String(charCount)).foregroundColor(.red)
} else {
text == "" ? Text("Empty") : Text(String(charCount))
}
}
Section(header: Text("actions")) {
Button("Save Data") {
UserDefaults.standard.set(text, forKey: "TEXT_Key")
}
// When I lightly clicked it, the inner code will be executed, but no visual effect will be shown.
}
}
}
If this question seems silly, please forgive me
My Xcode version: 14.3 (14E222b).
Target device: iPhone 14 Pro Simulator and iOS 16.5 for True Device
I have searched Google and found no explanations or solutions regarding this specific issue. I have tried compiling the code using the Release configuration, but the issue still persists.
The expected result is that my button should behave like the buttons in the iOS Settings app, where even a light tap triggers a background color change.
英文:
I am using a Form in SwiftUI based on a tutorial from YouTube, and I have placed some components inside it. However, when I tap the button, it doesn't show the tap animation (For example, when I tap a Button in the iOS settings app the button background will change) when I lightly tap it once. Here is my code:
var body: some View {
Form {
Section(header: Text("Input:")) {
TextField("Add Some text here", text: $text)
}
Section(header: Text("Letter: Count")) {
let charCount = text.filter({ $0 != " " }).count
if (charCount > 30) {
Text(String(charCount)).foregroundColor(.red)
} else {
text == "" ? Text("Empty") : Text(String(charCount))
}
}
Section(header: Text("actions")) {
Button("Save Data") {
UserDefaults.standard.set(text, forKey: "TEXT_Key")
}
// When I lightly clicked it, the inner code will be executed, but no visual effect will be shown.
}
}
}
If this question seems silly, please forgive me
My Xcode version: 14.3 (14E222b).
Target device: iPhone 14 Pro Simulator and iOS 16.5 for True Device
I have searched Google and found no explanations or solutions regarding this specific issue. I have tried compiling the code using the Release configuration, but the issue still persists.
The expected result is that my button should behave like the buttons in the iOS Settings app, where even a light tap triggers a background color change.
答案1
得分: 1
这是一个已知的表单问题，按钮无法正常工作，目前没有真正的解决方法（据我所知），部分单元格会覆盖按钮点击，导致你观察到的奇怪行为。
你可以尝试一个“干净”的解决方法，就像我将要发布的这个，但这可能不是你所寻找的：
Section(header: Text("操作")) {
HStack { // 使父视图处理按钮点击，而不是部分单元格
Button(
action: {
UserDefaults.standard.set(text, forKey: "TEXT_Key")
},
label: {
Text("保存数据")
.frame(maxWidth: .infinity, alignment: .leading) // 将按钮点击区域应用于整个堆栈
})
}
}.buttonStyle(.borderless) // 在部分上设置一个按钮样式，以正确显示动画
// 轻击按钮将不会产生经典的部分动画（变为灰色），但文本会像经典按钮一样切换不透明度。
英文:
This is a know issue with Forms, Buttons are not working properly and there is no real fix (as far as I know), Section cells will override the Button click with the weird behaviour you are observing.
You can try a "clean" workaround like the one I'll post but this may not be what you are seeking for:
Section(header: Text("actions")) {
HStack { // A that superView will handle the button click instead of the Section cell
Button(
action: {
UserDefaults.standard.set(text, forKey: "TEXT_Key")
},
label: {
Text("Save Data")
.frame(maxWidth: .infinity, alignment: .leading) //frame to infinity inside label will apply the button click area to the whole stack
})
}
}.buttonStyle(.borderless) //set a buttonStyle on the Section to display the animation correctly
// Clicking the button lightly will not make the classic section animation (turning to gray) but the text will toggle opacity as classic button do.
</details>
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论