如何解决将按钮放在节页眉/页脚上时,iOS 14上出现奇怪的UI渲染问题
在下面的示例代码中,(表单-)部分标题上放置了一个按钮,只要按下该按钮,它将在工作表之间切换。该工作表具有要显示的元素列表。
import SwiftUI
struct ContentView: View {
var body: some View {
vstack{
Form{
Section(header: headerView()) {
Text("Some Text")
}
}
}
}
}
struct headerView: View {
@State var showSheet = false
var body: some View {
Button(action: { self.showSheet.toggle()}){
HStack{
Spacer()
Image(systemName: "pencil.and.ellipsis.rectangle")
Text("View Sheet")
}
}.sheet(isPresented: $showSheet) {sheetView()}
}
}
struct sheetView: View {
@Environment(\.presentationMode) private var presentationMode
var body: some View {
NavigationView{
vstack(alignment: .leading) {
List() {
Text("List element 1")
Text("List element 2")
Text("List element 3")
Text("List element 4")
}
}
.navigationBarTitle(Text("Logs"),displayMode: .inline)
.navigationBarItems(leading: EditButton(),trailing: Button(action: {self.presentationMode.wrappedValue.dismiss()}) { Text("Done").bold()})
}
}
}
这在iOS 13上已经可以正常工作。但是,在iOS 14中,正如您在下面的屏幕快照中看到的那样,它完全损坏:
只要您不触摸屏幕,损坏的行为就会持续存在。当您触摸屏幕并将工作表向下拉一点时,列表外观将得到纠正。如果对NavigationBar进行相同的操作,那么它也将正确呈现。
有人也面临这个问题吗?有任何已知的修复程序吗?
解决方法
这看起来像个错误。可能的解决方法是将工作表移出Form。
通过Xcode 12.0 / iOS 14测试。
struct ContentView: View {
@State var showSheet = false
var body: some View {
VStack{
Form{
Section(header:
headerView(showSheet: $showSheet)
) {
Text("Some Text")
}
}
}.sheet(isPresented: $showSheet) {sheetView()}
}
}
struct headerView: View {
@Binding var showSheet: Bool
var body: some View {
Button(action: { self.showSheet.toggle()}){
HStack{
Spacer()
Image(systemName: "pencil.and.ellipsis.rectangle")
Text("View Sheet")
}
}
}
}
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。