我正在尝试使用React VR创建一个Web应用程序并使用Samsung Gear VR运行它. 在我的场景中处于VR模式时,我看不到默认的白点(VR指针).因此,诸如“onInput”和“onClick”之类的方法不起作用.如果我
在我的场景中处于VR模式时,我看不到默认的白点(VR指针).因此,诸如“onInput”和“onClick”之类的方法不起作用.如果我在VR模式之外查看相同的场景,即使使用Gear VR中提供的浏览器,相同的方法也能正常工作.
我错过了什么吗?如何在Gear VR中以VR模式访问这些方法?
在普通Web浏览器(包括Gear VR中的浏览器)中正常工作的示例代码,但不适用于我在VR中.
<Text style={{ // backgroundColor: '#777879', fontSize: 0.2, transform: [{translate: [0, 0, -5]}], color: this.state.textColor }} onEnter={() => this.setState({textColor: 'gold'})} onExit={() => this.setState({textColor: 'white'})}> This text will turn gold when you look at it. </Text>你需要添加一个raycaster:
为此,您需要执行以下操作:
在您的项目中,转到< project root> /vr/client.js.
在init方法之前,添加一个SimpleRaycaster常量.
const SimpleRaycaster = { getType: () => "simple", getRayOrigin: () => [0, 0, 0], getRayDirection: () => [0, 0, -1], drawsCursor: () => true }; function init(bundle, parent, options) { //...
然后,在init方法中,设置cursorVisibility:visible并将raycaster添加到raycasters数组:
function init(bundle, parent, options) { const vr = new VRInstance(bundle, 'Example', parent, { raycasters: [ SimpleRaycaster // Add SimpleRaycaster to the options ], cursorVisibility: "visible", // Add cursorVisibility enableHotReload: true, ...options, }); vr.render = function() { // Any custom behavior you want to perform on each frame goes here }; // Begin the animation loop vr.start(); return vr; } window.ReactVR = {init};
而已.现在你应该在视图中间有一个白点.