mirror of
https://github.com/troisjs/trois.git
synced 2024-11-24 04:12:02 +08:00
simple xr support
This commit is contained in:
parent
c900286de8
commit
8eff7c1728
@ -1,4 +1,5 @@
|
|||||||
import { defineComponent, h } from 'vue';
|
import { defineComponent, h } from 'vue';
|
||||||
|
import { VRButton } from 'three/examples/jsm/webxr/VRButton.js';
|
||||||
import useThree from './useThree';
|
import useThree from './useThree';
|
||||||
|
|
||||||
export default defineComponent({
|
export default defineComponent({
|
||||||
@ -13,6 +14,7 @@ export default defineComponent({
|
|||||||
shadow: Boolean,
|
shadow: Boolean,
|
||||||
width: String,
|
width: String,
|
||||||
height: String,
|
height: String,
|
||||||
|
xr: Boolean,
|
||||||
},
|
},
|
||||||
setup() {
|
setup() {
|
||||||
return {
|
return {
|
||||||
@ -44,8 +46,16 @@ export default defineComponent({
|
|||||||
if (this.three.init(params)) {
|
if (this.three.init(params)) {
|
||||||
this.renderer = this.three.renderer;
|
this.renderer = this.three.renderer;
|
||||||
this.renderer.shadowMap.enabled = this.shadow;
|
this.renderer.shadowMap.enabled = this.shadow;
|
||||||
|
|
||||||
|
if (this.xr) {
|
||||||
|
this.renderer.domElement.parentNode.appendChild(VRButton.createButton(this.renderer));
|
||||||
|
this.renderer.xr.enabled = true;
|
||||||
|
if (this.three.composer) this.renderer.setAnimationLoop(this.animateXRC);
|
||||||
|
else this.renderer.setAnimationLoop(this.animateXR);
|
||||||
|
} else {
|
||||||
if (this.three.composer) this.animateC();
|
if (this.three.composer) this.animateC();
|
||||||
else this.animate();
|
else this.animate();
|
||||||
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
this.onMountedCallbacks.forEach(c => c());
|
this.onMountedCallbacks.forEach(c => c());
|
||||||
@ -72,6 +82,8 @@ export default defineComponent({
|
|||||||
if (this.raf) requestAnimationFrame(this.animateC);
|
if (this.raf) requestAnimationFrame(this.animateC);
|
||||||
this.three.renderC();
|
this.three.renderC();
|
||||||
},
|
},
|
||||||
|
animateXR() { this.three.render(); },
|
||||||
|
animateXRC() { this.three.renderC(); },
|
||||||
},
|
},
|
||||||
render() {
|
render() {
|
||||||
return h('canvas', {}, this.$slots.default());
|
return h('canvas', {}, this.$slots.default());
|
||||||
|
Loading…
Reference in New Issue
Block a user