Skip to content

Pinch gesture and drag do not scale or move the object in ViroNode #362

@ssssssymo

Description

@ssssssymo

I'm trying to enable pinch-to-scale and drag gestures on a 3D model inside a ViroNode wrapped in a ViroARPlane. Despite implementing onDrag and onPinch handlers and updating state accordingly, the object does not scale nor move in the AR scene.

const [modelPosition, setModelPosition] = useState([0, 0, 0]);
const [modelScale, setModelScale] = useState([0.01, 0.01, 0.01]);
const [currentScale, setCurrentScale] = useState(1);

const onDrag = (dragToPos) => {
  setModelPosition(dragToPos);
};

const onPinch = (pinchState, scaleFactor, source) => {
  if (pinchState === 3) {
    setCurrentScale(currentScale * scaleFactor);
  } else {
    const newScale = currentScale * scaleFactor;
    setModelScale([newScale, newScale, newScale]);
  }
};

return (
  <ViroARScene onTrackingUpdated={onInitialized}>
    <ViroARPlane anchorId={anchorId}>
      <ViroNode
        dragType="FixedToWorld"
        position={modelPosition}
        scale={modelScale}
        onDrag={onDrag}
        onPinch={onPinch}
      >
        <ViroAmbientLight color="#ffffff" />
        <Viro3DObject
          source={modelSource}
          resources={modelResources}
          position={[0, 0, 0]}
          scale={[1, 1, 1]}
          type="GLB"
        />
      </ViroNode>
    </ViroARPlane>
  </ViroARScene>
);

using expo 50 and react viro 2.41.6

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions