SwiftUI动画onLongPressGestureminimumDuration：0.5自动启动

问题描述

我创建了一个圆形按钮，指定将其显示为.onLongPressGesture上的比例动画（最小持续时间：0.5） 代码如下：

struct PlayerTouch: View {
   @State private var animationAmount: CGFloat = 1
   @State var animationEffect   = false
   
   var outerColor: Color
   var innerColor: Color

   let touchpulse = Animation.linear.repeatForever(autoreverses: true)

   private var outerBorderCirle: some View {
    let side:  CGFloat = Device.model == device.Six_6S_7_8_SE ? 108.6 : 146
 
    return Circle()
        .stroke(outerColor,linewidth: 6)
        .frame(width: side,height: side)
        .shadow(color: Color.black.opacity(0.3),radius: 8,x: 0,y: 0)
        
    
}
   private var innerBorderCirle: some View {
    let side:  CGFloat = Device.model == device.Six_6S_7_8_SE ? 80.3 : 108
   
    return Circle()
        .stroke(innerColor,linewidth: 20)
        .frame(width: side,height: side)
        .scaleEffect(animationEffect ? 0.9 : 1)
        .opacity(animationEffect ? 0.7 : 1)
        .animation(touchpulse)
                   

}
   private var touchCirle:       some View {
    let side:  CGFloat = Device.model == device.Six_6S_7_8_SE ? 71.7 : 96
    
    return Circle()
        .foregroundColor(colors.darkCream.value)
        .shadow(color: colors.touchCream.value,radius: 18,y: 6)
        .frame(width: side,height: side)
        .onLongPressGesture(minimumDuration: 0.5) {
            self.animationEffect = true
        }
}
   }



     var body: some View {
       ZStack{
        outerBorderCirle
        innerBorderCirle
        touchCirle
       }
   }}

我已经在下面的主视图中（例如波纹管）从该视图创建了4个实例：

struct GameScene: View {
    @Binding var numberOfPeople: Int
    @State var offset = 0

    private var touch1: some View {
        PlayerTouch(outerColor: outerColors[0],innerColor: innerColors[0])
    }
    private var touch2: some View {
        PlayerTouch(outerColor: outerColors[1],innerColor: innerColors[1])
    }
    private var touch3: some View {
        PlayerTouch(outerColor: outerColors[2],innerColor: innerColors[2])
    }
    private var touch4: some View {
        PlayerTouch(outerColor: outerColors[3],innerColor: innerColors[3])
    }

    var body: some View {
   vstack(spacing: Device.model! == .X_Xs_11Pro ? 20 : 40){
    
        HStack{
            Spacer()
            touch1
                
            touch2
                .offset(y: Device.model! == .Six_6S_7_8_SE &&
                numberOfPeople > 2 ? -40 : -50)
            Spacer()
        }
        HStack{
    
            if numberOfPeople > 2{
                Spacer()
                touch3
                    .offset(x: numberOfPeople == 3 ? -40 : 0,y: numberOfPeople == 3 ? -40 : 0)
            }
            if numberOfPeople > 3 {
                touch4
                .offset(y:-50)
                Spacer()
            }
    
        }
    
        }.frame(height: height)
        .padding(.leading,10)
        .padding(.trailing,10)
}}

，我有一个添加人数的按钮，该按钮导致在该视图上显示实例。 我的问题是动画添加到人数后会自动触发 这是显示问题的GIF：

The animation problem shown

显示动画的正确方法是在触摸动画0.5秒后

Animation should be like this and should be triggered after long tap

解决方法

使动画主动进行明确的按值更改，例如

return Circle()
    .stroke(innerColor,lineWidth: 20)
    .frame(width: side,height: side)
    .scaleEffect(animationEffect ? 0.9 : 1)
    .opacity(animationEffect ? 0.7 : 1)
    .animation(touchpulse,value: animationEffect)       // << here !!