如何找出当前是不是在 SwiftUI 中选择了视图

Posted 2023-02-24

【中文标题】如何找出当前是不是在 SwiftUI 中选择了视图

【英文标题】：How to find out if view is currently selected in SwiftUI如何找出当前是否在 SwiftUI 中选择了视图

【发布时间】：2019-10-16 21:30:50

【问题描述】：

我想知道我的视图当前是否被选中。 我有一个代表卡片的矩形。点按卡片后，卡片应进入选中状态并更改颜色等属性。

但是一旦我点击其他地方，卡片就不会再处于那种状态了。

到目前为止，当我尝试使用 onTapGesture 属性时，我没有设法解决这个问题，但是我遇到了一个问题，即当我在该卡之外点击时，该卡不会将状态更改为 false，除非我再次点击卡片，这是有道理的，但在这种情况下似乎是错误的选择。

import SwiftUI

struct CardView: View 
    @State var selected = false
    let rectangle = Rectangle()
    @State var rectangleColor: Color = .purple


    var body: some View 
        GeometryReader  g in
            self.rectangle
                .foregroundColor(self.rectangleColor)
                .frame(width: g.size.width / 2, height: g.size.width / 2)
                .onTapGesture 
                    self.selected.toggle()
                    self.modifyColors()
                
        
    

    func modifyColors() 
        if selected 
            rectangleColor = .red
         else 
            rectangleColor = .purple
        
    

选中状态为红色，未选中状态为紫色。 所以我希望当我点击矩形时颜色变为红色，但如果我点击它外部则不会。 只有当我在矩形外部而不是在矩形内部点击时，它才会再次变为紫色。 示例：卡片是紫色的。我选择它，它变成红色。当我再次点击它时，它应该保持红色。当我点击卡片外部而不是卡片内部的某个位置时，它应该只变成紫色（未选中）。

---

包含此矩形的视图：

import SwiftUI
struct ContentView: View 
    var body: some View 
        CardView()
    


struct ContentView_Previews: PreviewProvider 
    static var previews: some View 
        ContentView()
    

视图实际上在哪里并不重要 - 我想知道该视图周围的空间是否被挖掘。因此，如果它位于模态框或 ZStack 的顶视图中，则行为应该是相同的。

【问题讨论】：

您必须在包含卡片的视图中实现选择手势。

那么，行为还是和以前一样。我编辑了最初的答案，希望问题变得更加清晰。

能否将包含 CardView 的视图也包含在内？

做到了。但实际上它是否存在于内容视图或模式等中应该没有任何区别。

【参考方案1】：

实现这一点的方法是让父视图同时管理选择和手势。

CardView 只需要一个 @Binding 到 isSelected 并相应地更改颜色：

struct CardView: View 

    @Binding var isSelected: Bool

    var body: some View 
        Rectangle()
            .fill(self.isSelected ? Color.red : Color.purple)
            .aspectRatio(1.0, contentMode: .fit)
    

虽然父级管理@State 并使用手势更新它。

struct ContentView: View 

    @State var isCardSelected = false

    var body: some View 
        ZStack 
            Color.white
                .onTapGesture 
                    self.isCardSelected = false
                
            CardView(isSelected: $isCardSelected)
                .onTapGesture 
                    self.isCardSelected = true
                
        
    

【讨论】：

非常感谢您的帮助:)