AnimatedViewInScrollView-AnimatedBox.swift

struct AnimatedBox: View {
    @State var val1 = 0.0
    @State var val2 = 0.0
    
    @State var val3 = 0.5
    @State var val4 = 0.5
    
    @State var scale = 0.5
    @State var opacity = 0.0

    var body: some View {
        ZStack {
            RoundedRectangle(cornerRadius: 25)
                .trim(from: val1, to: val2)
                .stroke(.yellow.opacity(1),style: StrokeStyle(lineWidth: 6, lineCap: .round, lineJoin: .miter, miterLimit: 10))
                .frame(width: 255, height: 75)
            
            RoundedRectangle(cornerRadius: 25)
                .trim(from: val3, to: val4)
                .stroke(.yellow.opacity(1),style: StrokeStyle(lineWidth: 6, lineCap: .round, lineJoin: .miter, miterLimit: 10))
                .frame(width: 255, height: 75)
            
            RoundedRectangle(cornerRadius: 25)
                .foregroundColor(.red.opacity(opacity))
                .frame(width: 250, height: 70)
                .onAppear {
                    withAnimation(.spring(dampingFraction: 2).delay(0.1)){
                        val1 = 0.0
                        val2 = 0.5
                        val3 = 0.5
                        val4 = 1.0
                        opacity = 0.3
                        scale = 1.0
                    }
                }
            
            HStack {
                Text("HELLO!")
                    .font(.title)
                    .bold()
                    .foregroundColor(.yellow)
                
            }.scaleEffect(scale)
        }
        .modifier(AnimationModifier(positionOffset: 0))

        .frame(height: 400)
        .background(Color.red.opacity(0.5))

    }
}