Code a custom button to go back to 2D view

MinhazMM commented 4 years ago

Environment

Please provide the following information about your environment:

Development OS: Mac
Device OS & Version: iOS 13
Version: ViroReact version: 2.17.0 and React Native version: 0.59.0
Device(s): iPhone 11 and Huawei Nova 2i

Description

I am trying to code a custom button in the VR 360 video because on Android the "X" button that is on the top left of the VR layout. I tried to accomplish it via the Scene Navigation's replace and pop but nothing worked.

Reproducible Demo

var SomeScreen = require('../screens/RandomScreen');

<ViroButton
            position={[buttonSize + 0.1, -0.75, -2]}
            scale={[1, 1, 1]}
            width={buttonSize}
            height={buttonSize}
            source={require("../images/res/left_arrow.png")}
            gazeSource={require("../images/res/left_arrow_hover.png")}
            tapSource={require("../images/res/left_arrow_hover.png")}
            onClick={this._exitVideo.bind(this)} />

  _exitVideo() {
    // this.props.sceneNavigator.replace({scene:SomeScreen});
    this.props.sceneNavigator.pop()
  }

jpudysz commented 4 years ago

I think you need to go back with navigation not a scene.

So try to use this.props.navigation.pop()

MinhazMM commented 4 years ago

@jpudysz I changed it from this.props.sceneNavigator.pop() to this.props.navigation.pop() as you suggested and now I am getting the following error

jpudysz commented 4 years ago

Navigation will be available only for the views registered directly inside Navigation's Stack. Apparently your view is nested somewhere deeper so you can use hook useNavigation if you're using v5, if not pass navigation down with props.

MinhazMM commented 4 years ago

Oh, I actually use the VR navigation to go to the VR view:

<ViroVRSceneNavigator {...this.state.sharedProps}
        initialScene={
          { scene: VRVideoScreen, passProps: { videoURL: this.state.videoURL, videoID: this.state.specificVideoID } }} vrModeEnabled={true} onExitViro={this._exitViro.bind(this)}/>

jpudysz commented 4 years ago

Do you use react-navigation or @react-navigation/native at all?

MinhazMM commented 4 years ago

Nope, these are the dependancies I have on the project:

"dependencies": {
    "expo": "^36.0.2",
    "expo-cli": "^3.16.1",
    "expo-file-system": "^8.1.0",
    "react": "16.8.3",
    "react-native": "0.59.9",
    "react-native-orientation": "^3.1.3",
    "react-native-paper": "^3.6.0",
    "react-native-responsive-fontsize": "^0.4.3",
    "react-native-responsive-screen": "^1.4.1",
    "react-native-unimodules": "^0.7.0",
    "react-native-vector-icons": "^6.6.0",
    "react-viro": "2.17.0",
    "rn-bottom-drawer": "^1.4.3"
  },

viromedia / viro