Skip to content

[iOS] ViroPortalScene interior content not rendering in v2.53.0 #452

@meianuraluca

Description

@meianuraluca

In v2.53.0, on iOS, the interior content of ViroPortalScene does not render at all.
The portal frame is visible and the stencil hole is created correctly, but through the
hole only the camera feed (AR background) is visible instead of the portal's interior
world (Viro360Image, Viro3DObject, ViroBox, etc.).

The same code worked correctly before the SDK and package update.

Environment

@reactvision/react-viro: 2.53.0
expo: 54.0.33
react-native: 0.81.5
Platform iOS only (Android ✅ works)

  <ViroARScene
    position={this.state.objectPosition}
    removeClippedSubviews={false}
    onTrackingUpdated={this._onTrackInit}
  >
    <ViroDirectionalLight color="#ffffff" direction={[0, -1, -0.2]} />

    <ViroAmbientLight color="#ffffff" intensity={200} />
    {variant === 'park' ? (
      <ViroPortalScene
        passable={true}
        visible={this.props.arSceneNavigator.viroAppProps.displayObject}
        removeClippedSubviews={false}
      >
        <ViroPortal position={[0, 0, -3]} scale={[0.1, 0.1, 0.1]} onDrag={() => { }}>
          <Viro3DObject
            position={[0, 0, 0]}
            source={{ uri: FileSystem.documentDirectory + 'portal_ship.vrx' }}
            type="VRX"
            scale={[6, 5, 0.2]}
            visible={this.props.arSceneNavigator.viroAppProps.displayObject}
            rotation={[0, 0, 0]}
          />

          <Viro3DObject
            position={[0, -18, 0]}
            source={{ uri: FileSystem.documentDirectory + 'Portal.vrx' }}
            type="VRX"
            scale={[0.1, 0.1, 0.1]}
            visible={this.props.arSceneNavigator.viroAppProps.displayObject}
          />
        </ViroPortal>
        <Viro3DObject
          visible={this.props.arSceneNavigator.viroAppProps.displayObject}
          removeClippedSubviews={false}
          source={{ uri: WORLD.model }}
          type={'VRX'}
          position={WORLD.position}
          rotation={WORLD.rotation}
          scale={WORLD.scale}
        />
        {this._getModel()}

        <Viro360Image
          source={{ uri: FileSystem.documentDirectory + '360_world.jpg' }}
          format="RGBA8"
        />
      </ViroPortalScene>
    ) : (
      this._getModel()
    )}
  </ViroARScene>

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions