SwiftUI按钮的可触摸区域

Question

我正在尝试增加NavigationView内部按钮的可触摸区域。即使面积变大，它也不起作用。我的代码如下：

var body: some View {
NavigationView {
    List(taskStore.tasks) { tasks in
        Text(tasks.name)
    }
.navigationBarTitle("Tasks")
.navigationBarItems(
    trailing: Button(action: { 
    self.modalIsPresented = true 
}){
     Image(systemName: "plus")
    .frame(width: 200, height: 200)
    .contentShape(Rectangle())
    .background(Color.yellow)
})}

绿色区域是可触摸的，红色区域是不可触摸的。

我在网上找到了可行的解决方案。但是，此解决方案仅适用于NavigationView中没有的按钮。因此，如果我将按钮放置在如下所示的“某些视图”中，则按解决方案可以正常工作：

var body: some View {
Button(action: {self.modalIsPresented = true} ) {
Text("Default padding")
.padding(50)
.background(Color.yellow)
}}}

但是，当我将按钮放入代码中的导航视图时，黄色区域是不可触摸的。如何使整个黄色区域（红色框）像解决方案一样可触摸？

谢谢：D

解决方案示例：

Answer 1

如果您使用var selectedAttrs = {"mattress_size_variation ":{"displayName":"Mattress Size","value":"Twin","displayValue":"Twin"}}; var selectedAttributes = JSON.parse(selectedAttrs); return selectedAttributes.mattress_size_variation.value.toLowerCase(); TypeError: Cannot read property "value" from undefined 修饰符，我想您可能会在.navigationBarItems(trailing:)内找到所需的效果。或者您可以使用其他形状来满足您的需求。然后调整.contentShape(Rectangle())的大小以根据需要调整可点击区域。这是一个快速的代码示例。

.frame

我希望这会有所帮助。

Answer 2

如果您想要导航栏中的按钮，则无论您尝试将图像的帧设置在什么位置，都只能在导航栏中单击该按钮，无论孩子是什么孩子，NavigationView都会确定该高度，按钮，在这种情况下-可能需要。

从历史上看，不支持更改NavigationBar的高度：请参见注释here

现在，您可以使用ZStacks做一些时髦的事情-在导航视图的顶部放置一个按钮-也许-但您将无法在导航栏中放置大于设置高度的任何东西。