Question

我正在尝试在点击视图时移动视图。但是不幸的是没有任何反应。如何使用y轴偏移量切换位置？

    struct Test: View {
    @State var cards : [Card] = [Card(), Card(), Card(), Card(), Card(), Card()]

    var body: some View {
        VStack {
            ZStack (alignment: .top){
                ForEach (0..<cards.count) { i in
                    RoundedRectangle(cornerRadius: 10).frame(width: 250, height: 150)
                        .foregroundColor(Color.random).offset(y: self.cards[i].isFocus ? CGFloat(500) : CGFloat(i*50))
                        .zIndex(Double(i))
                        .onTapGesture {
                            self.cards[i].isFocus.toggle() // now the touched Card should move to an offset of y: 500, but nothing happens
                        }
                }
            }
            Spacer()
        }


    }
}

struct Card :Identifiable{
    @State var isFocus :Bool = false
    var id  = UUID()

}

struct Test_Previews: PreviewProvider {
    static var previews: some View {
        Test()
    }
}

extension Color {
    static var random: Color {
        return Color(red: .random(in: 0...1),
                     green: .random(in: 0...1),
                     blue: .random(in: 0...1))
    }
}

Answer 1

我看到了您的代码，很抱歉，但是在很多方面它是错误的。我建议您通览SwiftUI基础知识，并了解我们如何以及何时使用@ State，@ ObservedObject，@ Binding等。也请始终尝试将视图分解为最小的组件。以下是我认为可以满足您要求的代码。

struct Test: View {
    var cards : [Card] = [Card(), Card(), Card(), Card(), Card(), Card()]

    var body: some View {

        VStack {
            ZStack (alignment: .top){
                ForEach (0..<cards.count) { i in
                    CardView(card: self.cards[i], i: i)
                }
            }
            Spacer()
        }
    }
}

struct CardView: View {

    @ObservedObject var card: Card
    let i: Int

    var body: some View {

       RoundedRectangle(cornerRadius: 10).frame(width: 250, height: 150)
            .foregroundColor(Color.random)
            .offset(y: card.isFocus ? CGFloat(500) : CGFloat(i*10))
            .zIndex(Double(i))
            .onTapGesture {
                withAnimation {
                  self.card.isFocus.toggle()
                }
        }
    }
}

class Card: ObservableObject{
    @Published var isFocus: Bool = false
    var id  = UUID()

}

如何使用onTapGesture更改视图的偏移量？

1 个答案: