1

所以我想在另一个视图的 ZStack 顶部放置一个颜色。我不想使用覆盖的原因是颜色将附加一个点击手势。下面是一个最小的可重现示例。本质上,我希望 Color.secondary 被限制在与 HStack 相同的区域(没有明确设置帧大小。这是代码:

struct ContentView: View {
    var body: some View {
        ZStack {
            HStack {
                Spacer()
                Button(action: {
                    print("tapped button")
                }, label: {
                    Text("button")
                })
            }.background(Color.red)
            Color.secondary
                .onTapGesture {
                    print("clicked color")
                }
        }
    }
}

所以我希望视图只是一个白色屏幕,HStack 看起来稍微深一点红色。

下面是我的 UI 的图片。该视图在入职期间呈灰色显示,用户基本上只需点击灰色区域即可进入入职的下一步。如果我将轻击手势附加到颜色视图,然后根据状态更改隐藏颜色视图,这不是问题。入职完成后,灰色区域将不存在,并且下方的按钮需要可交互。使用叠加层时,入职后,我不想点击视图上的任何位置来更改应用程序状态。

https://i.stack.imgur.com/lphHg.png

4

1 回答 1

1

鉴于您的进一步描述,我相信您onTapGesture(perform:)在错误的地方,在外面overlay而不是在里面。

在下面的代码中,onTapGesture(perform:)只能在灰色覆盖层显示时点击它。但是,当它附加在 之后时overlay,可以在点击按钮之类的东西时点击它。

工作代码:

struct ContentView: View {
    @AppStorage("is_onboarding") var isOnboarding = true

    var body: some View {
        HStack {
            Spacer()

            Button {
                print("tapped button")
            } label: {
                Text("button")
            }
        }
        .background(Color.red)
        .overlay {
            if isOnboarding {
                Color.secondary
                    .onTapGesture {
                        print("clicked color")
                        isOnboarding = false
                    }
            }
        }
    }
}

如果在 iOS 14+ 而不是 iOS 15+ 上,请改用以下内容overlay

.overlay(
    isOnboarding ?
        Color.secondary
            .onTapGesture {
                print("clicked color")
                isOnboarding = false
            }
    : nil
)
于 2021-12-31T01:43:02.423 回答