index.wxml 4.7 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798
  1. <xr-scene ar-system="modes:Plane" id="xr-scene" bind:ready="handleReady" bind:ar-ready="handleARReady" bind:pause="handlePause" bind:resume="handleResume">
  2. <xr-assets bind:loaded="handleAssetsLoaded">
  3. <xr-asset-load type="gltf" asset-id="loading" src="https://mmbizwxaminiprogram-1258344707.cos.ap-guangzhou.myqcloud.com/xr-frame/demo/xr-frame-team/loading.glb" />
  4. <xr-asset-load type="gltf" asset-id="sky" src="https://mmbizwxaminiprogram-1258344707.cos.ap-guangzhou.myqcloud.com/xr-frame/demo/xr-frame-team/sky.gltf" />
  5. <xr-asset-load type="gltf" asset-id="office" src="https://mmbizwxaminiprogram-1258344707.cos.ap-guangzhou.myqcloud.com/xr-frame/demo/ggj2023-scene.glb" />
  6. <xr-asset-load type="gltf" asset-id="hikari" src="https://mmbizwxaminiprogram-1258344707.cos.ap-guangzhou.myqcloud.com/xr-frame/demo/xr-frame-team/hikari-unlit.glb" />
  7. <xr-asset-load type="gltf" asset-id="roam" src="https://mmbizwxaminiprogram-1258344707.cos.ap-guangzhou.myqcloud.com/xr-frame/demo/xr-frame-team/roam-unlit.glb" />
  8. <xr-asset-load type="gltf" asset-id="xinyi" src="https://mmbizwxaminiprogram-1258344707.cos.ap-guangzhou.myqcloud.com/xr-frame/demo/xr-frame-team/xinyi-unlit.glb" />
  9. <xr-asset-load type="texture" asset-id="particle-point" src="https://mmbizwxaminiprogram-1258344707.cos.ap-guangzhou.myqcloud.com/xr-frame/demo/particles/point.png" />
  10. </xr-assets>
  11. <xr-node>
  12. <xr-node id="setitem" node-id="setitem" visible="false">
  13. <xr-gltf
  14. id="sky" model="sky"
  15. states="cullOn: false"
  16. />
  17. <xr-gltf
  18. id="scene-mesh" model="office"
  19. />
  20. <xr-node wx:if="{{step === 0}}" position="5.6 -0.5 2.27">
  21. <xr-node
  22. id="wine" wx:if="{{!subStep}}"
  23. cube-shape="size:0.2 0.4 1.6" bind:touch-shape="handleTouchObj"
  24. />
  25. <xr-gltf id="xinyi" wx:if="{{subStep}}"
  26. position="-1.2 -1.8 -0.5" rotation="0 80 0" model="xinyi"
  27. anim-autoplay="clip:Idle" capsule-shape="height:1;raduis:0.2;center:0 0.7 0"
  28. bind:touch-shape="handleTouchChar"
  29. />
  30. </xr-node>
  31. <xr-node wx:if="{{step === 1}}" position="-3.2 -1.3 -5" >
  32. <xr-node
  33. id="vending" wx:if="{{!subStep}}" rotation="0 0 0"
  34. cube-shape="size:2 2 0.4" bind:touch-shape="handleTouchObj"
  35. />
  36. <xr-gltf id="roam" wx:if="{{subStep}}"
  37. position="-0.4 -1 0.6" rotation="0 180 0" model="roam"
  38. anim-autoplay="clip:Idle" capsule-shape="height:1;raduis:0.2;center:0 0.7 0"
  39. bind:touch-shape="handleTouchChar"
  40. />
  41. </xr-node>
  42. <xr-node wx:if="{{step === 2}}" position="-5.7 -1.17 4.47">
  43. <xr-node
  44. id="corner" wx:if="{{!subStep}}"
  45. cube-shape="size:1 1 1" bind:touch-shape="handleTouchObj"
  46. />
  47. <xr-gltf id="hikari" wx:if="{{subStep}}"
  48. position="1.5 -0.6 -0.6" rotation="0 90 0" model="hikari"
  49. anim-autoplay="clip:Idle" capsule-shape="height:1;raduis:0.2;center:0 0.7 0"
  50. bind:touch-shape="handleTouchChar"
  51. />
  52. </xr-node>
  53. <xr-node wx:if="{{step === 3}}" position="0 -2 -4.5">
  54. <xr-node
  55. id="sofa" wx:if="{{!subStep}}" rotation="0 16 0"
  56. cube-shape="size:2 0.6 1" bind:touch-shape="handleTouchObj"
  57. />
  58. <xr-node wx:if="{{subStep}}" position="0 -0.4 0.2">
  59. <xr-gltf id="xinyi"
  60. position="-0.6 0 0" rotation="0 180 0" model="xinyi"
  61. anim-autoplay="clip:Sitting" capsule-shape="height:1;raduis:0.2;center:0 0.7 0"
  62. bind:touch-shape="handleTouchChar"
  63. />
  64. <xr-gltf id="roam"
  65. position="0.6 0 0" rotation="0 180 0" model="roam"
  66. anim-autoplay="clip:Sitting" capsule-shape="height:1;raduis:0.2;center:0 0.7 0"
  67. bind:touch-shape="handleTouchChar"
  68. />
  69. <xr-gltf id="hikari"
  70. position="0 0 0" rotation="0 180 0" model="hikari"
  71. anim-autoplay="clip:Sitting" capsule-shape="height:1;raduis:0.2;center:0 0.7 0"
  72. bind:touch-shape="handleTouchChar"
  73. />
  74. </xr-node>
  75. </xr-node>
  76. </xr-node>
  77. <xr-asset-post-process asset-id="blur" type="blur" data="radius:0" />
  78. <xr-camera
  79. id="main-camera" node-id="main-camera"
  80. background="ar" is-ar-camera
  81. near="0.1" far="2000"
  82. is-ar-camera clear-color="0 0 0 1" post-process="blur"
  83. >
  84. <xr-gltf wx:if="{{arReady && !loaded}}" position="0 0 10" model="loading" anim-autoplay />
  85. </xr-camera>
  86. </xr-node>
  87. <xr-node node-id="lights">
  88. <xr-light type="ambient" color="1 1 1" intensity="{{ambient}}" />
  89. <xr-light node-id="light" type="spot" color="1 1 1" intensity="4" inner-cone-angle="5" outer-cone-angle="25" range="4" wx:if="{{step < 3}}" />
  90. </xr-node>
  91. </xr-scene>