如何修改Swiftui页面左上角的 < Back 按钮?

在 SwiftUI 中,可以使用 navigationBarBackButtonHidden(_:) 方法来隐藏返回按钮的文字,并在其位置上添加一个新的视图,例如一个图片或自定义的文本。

下面是一个示例代码,将返回按钮的文本修改为“返回”:

struct ContentView: View {
    var body: some View {
        NavigationView {
            Text("Hello World")
                .navigationBarTitle("My App")
                .navigationBarBackButtonHidden(true)
                .navigationBarItems(leading:
                    Button(action: {
                        // Navigate back to the previous view
                    }, label: {
                        HStack {
                            Image(systemName: "chevron.left")
                            Text("返回")
                        }
                    })
                )
        }
    }
}

在这个示例中,我们首先使用 .navigationBarBackButtonHidden(true) 将默认的返回按钮的文本隐藏掉,然后使用 .navigationBarItems(leading:) 在左边的导航栏位置添加一个按钮。这个按钮使用了一个包含图片和自定义文本的水平堆栈(HStack)来模拟默认的返回按钮样式,并将自定义文本设置为“返回”。当用户点击该按钮时,可以执行所需的操作来导航回到上一个视图。

庄朋龙
庄朋龙

一个爱生活的技术菜鸟

留下评论

您的电子邮箱地址不会被公开。 必填项已用 * 标注