How to get the value of x and y in react-native-draggable

190 Views Asked by At

Hello I've been searching for the solution for so long and still found nothing (even asked gptChat). The problem is that I want to save the x and y position of my draggable in my props.setPositionX and props.setPositionY, I was thinking using the moveX and moveY propreties was the right way to do it. But it is not because every time my app reloads all the data from firebase all my notes are in a completely different places.

here is what console.log(y) looks like :

{"_accountsForMovesUpTo": 6859182, "dx": -7.734375, "dy": 159.8876953125, "moveX": 148.7109375, "moveY": 206.4990234375, "numberActiveTouches": 0, "stateID": 0.2076494697380279, "vx": -0.010340073529411764, "vy": 0.021254595588235295, "x0": 156.4453125, "y0": 46.611328125}```

I tried by saving dx + d0 or tried with eventGesture but was never able to find the right way to save the position of my daggable.

(I am using this npm: https://www.npmjs.com/package/react-native-draggable)

and here is my react native code : 
<Draggable
      onDragRelease={(x, y) => {
        props.settouchedId(props.id)
        console.log("id depuis note : " + props.id)
        // console.log('x:', x)
        //I think I should use only y
        console.log(y)
        console.log('MOVEX:', y['moveX'])
        console.log('MOVEY:', y['moveY'])
        console.log('NUMBERACTIVETOUCHES:', y['numberActiveTouches'])
        console.log('X0:', y['x0'])
        console.log('Y0:', y['y0'])
        console.log('DX:', y['dx'])
        console.log('DY:', y['dy'])
        console.log('x ADDITION:', y['x0'] + y['dx'])
        console.log('y ADDITION:', y['y0'] + y['dy'])
        //IL ME SEMBLE QUE C'EST MOVEX ET MOVEY QUI ME DONNE LA POSITION DE LA NOTE

        props.setpositionX(y['moveX'])
        props.setpositionY(y['moveY'])

      }}
      x={props.x}
      y={props.y}
    >
      <View style={styles.shadow}>
        <View style={{
          backgroundColor: props.color,
          width: 150,
          height: 50,
          textAlign: 'center',
          borderWidth: 2,
          borderColor: 'black',
          borderRadius: 10,
          alignItems: 'center',
          justifyContent: 'center',
        }}>
          <Text style={styles.text}>{props.text}</Text>
        </View>
      </View>
    </Draggable>
0

There are 0 best solutions below