如何使用框架显示弯曲的视频

Question

我尝试过<a-videosphere>和<a-video>，它们很棒。

但是，如果我使用的是“普通”视频，那么a-videosphere会被难以置信地拉伸，而a-video则会被平坦地拉伸。

但是有一种方法可以使视频围绕用户弯曲吗？

就像用户是否在圆柱体内一样：与a-curvedimage类似，但用于视频。

编辑（a-curvedimage和src的问题）：

Answer 1

您可以使用src属性在任意几何图形上将视频显示为纹理：

<a-box src="#video"></a-box>
<a-curvedimage src="#video"></a-curvedimage>
<a-torus-knot src="#video"></a-torus-knot>

混合示例毛刺here。

---

如果您要问是否可以使普通的视频等角，无需提前准备或没有图像处理库，aframe就不会为您做。

Answer 2

我在使用a-curvedimage和src属性时遇到了相同的问题，而是通过使用通用的a-entity元素来解决此问题，重新创建了该对象的开放式双面圆柱a-curvedimage元素。

1280x720视频的示例：

<a-scene>
  <a-assets>
    <video id="myvideo" preload="auto" src="/path/to/video.mp4" width="1280" height="720" autoplay="true" loop="true" crossorigin="anonymous" playsinline="" webkit-playsinline=""></video>
  </a-assets>
  <a-entity material="shader: flat; side: double; src: #myvideo" geometry="primitive: cylinder; radius: 5; height: 3.6815; open-ended: true; theta-start: 142.5; theta-length: 75; position="0 1.5 0" rotation="0 0 0" scale="-1 1 1"></a-entity>
</a-scene>

其他信息： Stefie拥有great calculator，用于表示弯曲图像和视频的不同尺寸的属性。

编辑：向用户显示视频是在X轴上反转的，因此为X轴添加了带有-1的scale属性。