使用偏移量时剪切导航栏项目的可点击区域

Question

在SwiftUI中，请考虑以下导航栏：

以下是声明尾随.navigationBarItems的方式：

HStack(spacing: 0) {
    Button(action: {
        self.addListModal = true
    }, label: {
        NavBarImage(image: "plus")
    })
    // more buttons here

这是NavBarImage结构：

struct NavBarImage: View {
    var image: String

    var body: some View {
        ZStack {
            Rectangle().foregroundColor(Color.red).frame(width: 40, height: 45)
            Image(systemName: image)
        }
    }
}

红色在那里，所以我可以看到每个按钮的可点击区域应该是什么。我将这个带有ZStack想法的Rectangle引入到我的视线中，以使其更易于点击。

现在，我想将项目向右移动，使它们更符合下面的列表内容。我尝试将.offset添加到HStack：

HStack(spacing: 0) {
    // buttons
}
.offset(x: 15, y: 0)

哪个会产生以下结果：

所以这对我来说看起来很完美。但是，问题是最右边的导航按钮的可点击区域在右边被切除了。

我在这里用绿色说明了可轻击区域的切除：

该按钮的绿色区域不再注册点击。

我尝试在.padding上使用负尾随HStack，但这没什么区别。我是否可以通过在内容视图的UINavigationBar中使用一些init()声明来纠正此问题？

编辑：

我刚刚尝试将.accessibility添加到Rectangle，结果是相同的：

Rectangle().foregroundColor(Color.red)
    .accessibility(label: Text(image))
    .frame(width: 40, height: 45)

Answer 1

尝试使用

HStack(spacing: 0) {
    // buttons
}
.padding(.trailing, 15)