如何在 SwiftUI 中重新定位导航栏按钮

Question

我已经实现了navigationBarTitle，我正在尝试实现navigationBarItem，但是默认位置看起来很奇怪。

我希望能够将“下一步”按钮与navigationBarTitle 对齐。我能够用这段代码完成一些事情：

.navigationBarTitle(Text("Names"))
.navigationBarItems(trailing:
            Button(action: {
                print("tapped")
            }) {
                Group {
                    Text("Next")
                }.position(x: 0, y: 60).background(Color.purple)

            })

但是问题在于按钮没有移动，因此在显示“下一步”的位置无法点击。 （我突出显示了紫色的位置来演示。）

有没有办法以更清洁的方式完成此任务？或者我可以在 SwiftUI 中保持 navigationBarTitle Large Tile 外观的同时实现的其他方法或堆栈？谢谢！

Answer 1

您可以将按钮包装在ZStack 中，并将Button 放置在ZStack 中，如下所示：

import UIKit
import PlaygroundSupport
import SwiftUI

 struct ContentView: View {
    var body: some View {
        NavigationView {
            Text("Names")
                .navigationBarTitle(Text("Names"))
                .navigationBarItems(trailing:
                    ZStack {
                            Button(action: {
                                print("tapped")
                            }) {
                                Group {
                                    Text("Next")
                                }.background(Color.purple)
                            }.position(x: 0, y: 60)
                        })
        }
    }
}

let viewController = UIHostingController(rootView: ContentView())

PlaygroundPage.current.liveView = viewController

我在上面的操场示例中尝试过，它成功了：

编辑：

这似乎会使按钮无响应，除非您触摸并拖动：