ReactVision / viro

ViroReact: The AR and VR library for React Native πŸ“³πŸ’™πŸ’›πŸ€πŸ’š
MIT License
1.36k stars 157 forks source link

Changing between ViroARImageMarker #160

Open leandro2219 opened 2 years ago

leandro2219 commented 2 years ago

Environment:

  1. Development OS: Windows,
  2. Device OS & Version: Android (8.0 and 11.0)
  3. Version: "@viro-community/react-viro": "^2.20.2", "react": "17.0.2", "react-native": "0.65.1"
  4. Device(s): Nexus 6P and Motorola Edge30

Description Hi, We are creating an App which people can use it on our magazine, pointing to some areas and hearing some sound, viewing videos and viewing 3dObject. My problem is when I point to the first ViroARImageMarker I can see the video, then I point to the second ViroARImageMarker and I can see a 3dObject + Sound and the video disappears (this is perfect), but when I tried to go back to the video I can't see it, I have to move my cell phone from the magazine from a while and then point again to see the video again (and sometimes does not work). Same problem if I start with the sound and go to the video.

Next is a example code to reproduce it (is not the same but the problem is)

Thanks.

Reproducible Demo ` import React, {useState} from 'react'; import {ViroARScene, ViroARSceneNavigator, Viro3DObject, ViroAmbientLight, ViroARTrackingTargets, ViroARImageMarker, ViroVideo, ViroNode, ViroSound, ViroImage} from '@viro-community/react-viro';

const MagazineSceneAR = () => { const [actualModal, setActualModal] = useState(null); const [initSound, setInitSound] = useState(true); const [pauseUpdates, setPauseUpdates] = useState(false);

ViroARTrackingTargets.createTargets({ sn1 : { source : {uri : 'https://www.revistalagunas.com/app/assets/1/tapa/tapa-1.jpg'}, orientation : 'Up', physicalWidth : 0.21 }, vd1 : { source : {uri : 'https://www.revistalagunas.com/app/assets/1/portada/portada.jpg'}, orientation : 'Up', physicalWidth : 0.1224 } })

function onInitialized(state, reason) {}

function _onAnchorFound(objId) { console.log(objId, actualModal); if (actualModal !== objId) { console.log('Changing to ' + objId); setActualModal(objId); setPauseUpdates(false); } }

function _startLoadingImg(){ setInitSound(true); }

function _endLoadingImg(){ setInitSound(false); setPauseUpdates(true); }

return (

_onAnchorFound('sn1')} pauseUpdates={pauseUpdates}> {actualModal == 'sn1' ? _startLoadingImg('sn1')} onLoadEnd={() => _endLoadingImg('sn1')} /> : null} _onAnchorFound('vd1')} pauseUpdates={pauseUpdates}> {actualModal == 'vd1' ? : null}

); };

export default () => { return ( <ViroARSceneNavigator autofocus={true} initialScene={{ scene: MagazineSceneAR, }} style={{flex: 1}} /> ); }; `