VideoRenderer

El componente VideoRenderer renderiza contenido de vídeo en la pantalla. Admite escalado, rotación, volteo, opacidad, máscara de color, tintado, recorte, repetición en bucle y control de volumen, y la reproducción puede controlarse mediante código. Usa el Transform de la entidad para la posición. Consulta Renderizado para una visión general.

Opciones

OpciónTipoValor por defectoDescripción
videoHTMLVideoElement | string—El vídeo a renderizar, o una cadena con la URL/nombre del recurso.
layerstring"Default"La capa de renderizado.
widthnumber—Sustituye el ancho renderizado.
heightnumber—Sustituye el alto renderizado.
sliceSlice—Región del vídeo a dibujar ({ x, y, width, height }).
offsetVector2(0, 0)Desplazamiento respecto a la posición de la entidad.
rotationnumber0Rotación en radianes.
flipHorizontallyboolean—Voltea el vídeo horizontalmente.
flipVerticallyboolean—Voltea el vídeo verticalmente.
opacitynumber—Opacidad entre 0 y 1.
tintColorstring—Color usado para tintar el vídeo.
maskColorstring—Color de máscara aplicado al vídeo.
maskColorMixnumber—Opacidad del color de máscara entre 0 y 1.
volumenumber1Volumen entre 0 y 1.
loopbooleanfalseSi el vídeo se repite.
fixedToTimeScalebooleanfalseSi la velocidad de reproducción sigue la escala de tiempo.

Propiedades de solo lectura

PropiedadTipoDescripción
playingbooleantrue mientras el vídeo se está reproduciendo.

Métodos

MétodoDescripción
play(video?)Reproduce el vídeo. Un vídeo opcional sustituye a video.
pause()Pausa la reproducción.
stop()Detiene la reproducción.

Ejemplo

import { Transform, VideoRenderer } from "angry-pixel";

this.entityManager.createEntity([
    new Transform(),
    new VideoRenderer({
        video: this.assetManager.getVideo("intro.mp4"),
        width: 1920,
        height: 1080,
        layer: "Default",
    }),
]);

El vídeo se carga a través del Asset Manager, normalmente en el método loadAssets de la escena.