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大图块外观的同时实现的其他方法或堆栈？谢谢！

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

我在上面的操场示例中进行了尝试，并且有效：

编辑：

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

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

1 个答案: