视频材质
该材质继承于 UnLit 材质,同样不计算光照,仅通过视频像素颜色渲染的基础材质,不同的是,可以自动同步视频播放的帧内容,另外,也增加了空间裁剪 (clip)
的设置,可以更自由的进行裁剪。
视频材质支持以下属性:
属性 | 描述 |
---|---|
baseColor | 基础颜色 |
uv_offsetX | x方向位移 |
uv_offsetY | y方向位移 |
uv_scaleX | x方向缩放 |
uv_scaleY | y方向缩放 |
clip_left | 左方裁剪 |
clip_top | 上方裁剪 |
clip_right | 右方裁剪 |
clip_bottom | 下方裁剪 |
用法
ts
import {VideoMaterial, VideoTexture} from '@orillusion/media-extention'
// 创建视频纹理
let videoTexture = new VideoTexture();
await videoTexture.load('https://cdn.orillusion.com/videos/bunny.mp4')
// 创建视频材质
let mat = new VideoMaterial();
mat.baseMap = videoTexture;
import {VideoMaterial, VideoTexture} from '@orillusion/media-extention'
// 创建视频纹理
let videoTexture = new VideoTexture();
await videoTexture.load('https://cdn.orillusion.com/videos/bunny.mp4')
// 创建视频材质
let mat = new VideoMaterial();
mat.baseMap = videoTexture;
ts
import { Engine3D, Vector3, Scene3D, Object3D, Camera3D, View3D, MeshRenderer, HoverCameraController, PlaneGeometry } from '@orillusion/core'
import { VideoTexture, VideoMaterial } from '@orillusion/media-extention'
await Engine3D.init()
let scene = new Scene3D()
let camera = new Object3D()
scene.addChild(camera)
let mainCamera = camera.addComponent(Camera3D)
mainCamera.perspective(60, Engine3D.aspect, 0.1, 10000.0)
let hc = camera.addComponent(HoverCameraController)
hc.setCamera(0, 0, 2)
// create a video texture
let videoTexture = new VideoTexture()
await videoTexture.load('https://cdn.orillusion.com/videos/bunny.mp4')
// create a video material
let mat = new VideoMaterial()
mat.baseMap = videoTexture
// create a 2D plane to play the video
let planeObj = new Object3D()
let mr = planeObj.addComponent(MeshRenderer)
mr.geometry = new PlaneGeometry(2, (2 * 9) / 16, 1, 1, Vector3.Z_AXIS)
mr.material = mat
scene.addChild(planeObj)
let view = new View3D()
view.scene = scene
view.camera = mainCamera
// start render
Engine3D.startRenderView(view)
import { Engine3D, Vector3, Scene3D, Object3D, Camera3D, View3D, MeshRenderer, HoverCameraController, PlaneGeometry } from '@orillusion/core'
import { VideoTexture, VideoMaterial } from '@orillusion/media-extention'
await Engine3D.init()
let scene = new Scene3D()
let camera = new Object3D()
scene.addChild(camera)
let mainCamera = camera.addComponent(Camera3D)
mainCamera.perspective(60, Engine3D.aspect, 0.1, 10000.0)
let hc = camera.addComponent(HoverCameraController)
hc.setCamera(0, 0, 2)
// create a video texture
let videoTexture = new VideoTexture()
await videoTexture.load('https://cdn.orillusion.com/videos/bunny.mp4')
// create a video material
let mat = new VideoMaterial()
mat.baseMap = videoTexture
// create a 2D plane to play the video
let planeObj = new Object3D()
let mr = planeObj.addComponent(MeshRenderer)
mr.geometry = new PlaneGeometry(2, (2 * 9) / 16, 1, 1, Vector3.Z_AXIS)
mr.material = mat
scene.addChild(planeObj)
let view = new View3D()
view.scene = scene
view.camera = mainCamera
// start render
Engine3D.startRenderView(view)