Guía de Uso del Bloque Overlay Manager¶

public class OverlayManagerBlock : MediaBlock, IMediaBlockInternals

public static bool IsAvailable()

public void Video_Overlay_Add(IOverlayManagerElement overlay)

public void Video_Overlay_Remove(IOverlayManagerElement overlay)

public void Video_Overlay_RemoveAt(int index)

public void Video_Overlay_Clear()

public void Video_Overlay_Update(IOverlayManagerElement overlay)

public class OverlayManagerText : IOverlayManagerElement

var text = new OverlayManagerText("¡Hola Mundo!", 100, 100);
text.Color = SKColors.White;
text.Font.Size = 48;
text.Font.Name = "Arial";
text.Shadow = new OverlayManagerShadowSettings(true, depth: 5, direction: 45);
overlayManager.Video_Overlay_Add(text);

public class OverlayManagerImage : IOverlayManagerElement, IDisposable

// Desde archivo
new OverlayManagerImage(string filename, int x, int y, double alpha = 1.0)

// Desde bitmap de SkiaSharp
new OverlayManagerImage(SKBitmap image, int x, int y, double alpha = 1.0)

// Desde System.Drawing.Bitmap (solo Windows)
new OverlayManagerImage(System.Drawing.Bitmap image, int x, int y, double alpha = 1.0)

var image = new OverlayManagerImage("logo.png", 10, 10);
image.StretchMode = OverlayManagerImageStretchMode.Letterbox;
image.Width = 200;
image.Height = 100;
overlayManager.Video_Overlay_Add(image);

public class OverlayManagerGIF : IOverlayManagerElement, IDisposable

var gif = new OverlayManagerGIF("animacion.gif", new SKPoint(150, 150));
overlayManager.Video_Overlay_Add(gif);

public class OverlayManagerImageSequence : IOverlayManagerElement, IDisposable

// Básico: solo posición
new OverlayManagerImageSequence(IEnumerable<ImageSequenceItem> items, int x, int y)

// Completo: posición, tamaño y modo de escalado
new OverlayManagerImageSequence(
    IEnumerable<ImageSequenceItem> items,
    int x, int y,
    int width, int height,
    OverlayManagerImageStretchMode stretchMode = None)

// Agregar un cuadro dinámicamente durante la reproducción
void AddFrame(string filename, TimeSpan duration)

// Iniciar animación de posición/tamaño
void StartAnimation(int targetX, int targetY, int targetWidth, int targetHeight,
    TimeSpan startTime, TimeSpan duration, OverlayManagerPanEasing easing = Linear)

// Obtener posición/tamaño interpolado en el tiempo dado
(int X, int Y, int Width, int Height) GetCurrentRect(TimeSpan currentTime)

// Efectos de desvanecimiento
void StartFadeIn(TimeSpan startTime, TimeSpan duration, OverlayManagerPanEasing easing = Linear)
void StartFadeOut(TimeSpan startTime, TimeSpan duration, OverlayManagerPanEasing easing = Linear)
double GetCurrentOpacity(TimeSpan currentTime)

// Definir imágenes con duraciones por cuadro
var items = new List<ImageSequenceItem>
{
    new ImageSequenceItem("diapositiva1.png", TimeSpan.FromSeconds(3)),
    new ImageSequenceItem("diapositiva2.png", TimeSpan.FromSeconds(2)),
    new ImageSequenceItem("diapositiva3.png", TimeSpan.FromSeconds(4))
};

// Crear secuencia en posición (100, 100), escalada a 320x240
var sequence = new OverlayManagerImageSequence(items, 100, 100, 320, 240)
{
    Loop = true,
    Opacity = 0.9,
    ZIndex = 5,
    Name = "SlideShow"
};

overlayManager.Video_Overlay_Add(sequence);

// Animar la secuencia desde arriba a la izquierda hacia el centro en 3 segundos
sequence.StartAnimation(
    targetX: 400, targetY: 200,
    targetWidth: 640, targetHeight: 480,
    startTime: TimeSpan.FromSeconds(2),
    duration: TimeSpan.FromSeconds(3),
    easing: OverlayManagerPanEasing.EaseInOut);

// Aparecer gradualmente durante los primeros 1.5 segundos
sequence.StartFadeIn(
    startTime: TimeSpan.Zero,
    duration: TimeSpan.FromSeconds(1.5),
    easing: OverlayManagerPanEasing.EaseOut);

// Agregar superposición de secuencia de imágenes
var element = overlayManager.Video_Overlay_AddImageSequence(
    items, x: 100, y: 100, width: 320, height: 240,
    loop: true, name: "SlideShow");

// Actualizar posición
overlayManager.Video_Overlay_UpdateImageSequencePosition(
    "SlideShow", x: 200, y: 150, width: 400, height: 300);

// Animar posición/tamaño
overlayManager.Video_Overlay_AnimateImageSequence(
    "SlideShow", targetX: 500, targetY: 300, targetWidth: 640, targetHeight: 480,
    startTime: currentPosition, duration: TimeSpan.FromSeconds(2),
    easing: OverlayManagerPanEasing.EaseInOut);

// Efectos de desvanecimiento
overlayManager.Video_Overlay_ImageSequenceFadeIn(
    "SlideShow", startTime: currentPosition, duration: TimeSpan.FromSeconds(1));
overlayManager.Video_Overlay_ImageSequenceFadeOut(
    "SlideShow", startTime: currentPosition, duration: TimeSpan.FromSeconds(1));

public class ImageSequenceItem

// Constructores
new ImageSequenceItem()
new ImageSequenceItem(string filename, TimeSpan duration)

public class OverlayManagerDateTime : IOverlayManagerElement

var dateTime = new OverlayManagerDateTime();
dateTime.Format = "yyyy-MM-dd HH:mm:ss";
dateTime.X = 10;
dateTime.Y = 30;
overlayManager.Video_Overlay_Add(dateTime);

public class OverlayManagerScrollingText : IOverlayManagerElement

// Crear un texto desplazable estilo ticker de noticias
var scrollingText = new OverlayManagerScrollingText(
    "Última hora: VisioForge Media Framework ahora soporta superposiciones de texto desplazable!",
    x: 0,
    y: 50,
    speed: 3,
    direction: ScrollDirection.RightToLeft);

scrollingText.Font.Size = 24;
scrollingText.Color = SKColors.Yellow;
scrollingText.BackgroundTransparent = false;
scrollingText.BackgroundColor = SKColors.DarkBlue;

// Establecer el ancho predeterminado para coincidir con la resolución de video
// Se usa cuando Width no está configurado explícitamente
scrollingText.DefaultWidth = 1920; // Ancho Full HD

// O configurar Width directamente para un ancho específico del área de desplazamiento
// scrollingText.Width = 1920;

// Agregar manejador de evento para cuando el texto se reinicie
scrollingText.TextRestarted += (sender, e) => {
    Console.WriteLine("El texto desplazable se reinició");
};

overlayManager.Video_Overlay_Add(scrollingText);

// Para reiniciar la posición de desplazamiento
scrollingText.Reset();

// Para actualizar después de cambiar texto o fuente
scrollingText.Text = "Texto de noticias actualizado...";
scrollingText.Update();

public class OverlayManagerVideo : IOverlayManagerElement, IDisposable

// Crear una superposición de archivo de video
var videoOverlay = new OverlayManagerVideo(
    source: "intro.mp4",
    x: 100,
    y: 100,
    width: 640,
    height: 360)
{
    Loop = true,
    Opacity = 0.9,
    StretchMode = OverlayManagerImageStretchMode.Letterbox,
    ZIndex = 5
};

// Opcionalmente habilitar salida de audio
var audioOutputs = await AudioRendererBlock.GetDevicesAsync(AudioOutputDeviceAPI.DirectSound);
videoOverlay.AudioOutput = audioOutputs[0];
videoOverlay.AudioOutput_Volume = 0.5;

// Inicializar y agregar al overlay manager
if (videoOverlay.Initialize(autoStart: true))
{
    overlayManager.Video_Overlay_Add(videoOverlay);
}

// Controlar reproducción en tiempo de ejecución
videoOverlay.Pause();
videoOverlay.Seek(TimeSpan.FromSeconds(10));
videoOverlay.Play();

// Cambiar fuente dinámicamente
videoOverlay.UpdateSource("outro.mp4");

// Limpiar cuando termine
videoOverlay.Stop();
videoOverlay.Dispose();

// Crear un video PiP pequeño en la esquina
var pipVideo = new OverlayManagerVideo(
    source: "camera_feed.mp4",
    x: 20,
    y: 20,
    width: 240,
    height: 135)
{
    Loop = true,
    Opacity = 0.9,
    StretchMode = OverlayManagerImageStretchMode.Letterbox,
    ZIndex = 100,
    Shadow = new OverlayManagerShadowSettings
    {
        Enabled = true,
        Color = SKColors.DarkGray,
        Opacity = 0.7,
        BlurRadius = 8,
        Depth = 3,
        Direction = 45
    }
};

if (pipVideo.Initialize(autoStart: true))
{
    overlayManager.Video_Overlay_Add(pipVideo);
}

// Superponer un stream de red
var streamOverlay = new OverlayManagerVideo(
    source: "rtsp://192.168.1.21:554/Streaming/Channels/101",
    x: 400,
    y: 50,
    width: 320,
    height: 240)
{
    Loop = false,
    StretchMode = OverlayManagerImageStretchMode.Letterbox,
    ZIndex = 10
};

if (streamOverlay.Initialize(autoStart: true))
{
    overlayManager.Video_Overlay_Add(streamOverlay);
}

public class OverlayManagerDecklinkVideo : IOverlayManagerElement

// Obtener dispositivos Decklink
var devices = await DecklinkVideoSourceBlock.GetDevicesAsync();
var decklinkSettings = new DecklinkVideoSourceSettings(devices[0]);
decklinkSettings.Mode = DecklinkMode.HD1080p2997;

// Crear superposición Decklink
var decklinkOverlay = new OverlayManagerDecklinkVideo(
    decklinkSettings, 
    x: 10, 
    y: 10, 
    width: 640, 
    height: 360);

// Inicializar y agregar al overlay manager
if (decklinkOverlay.Initialize(autoStart: true))
{
    overlayManager.Video_Overlay_Add(decklinkOverlay);
}

// Limpiar cuando termine
decklinkOverlay.Stop();
decklinkOverlay.Dispose();

public class OverlayManagerNDIVideo : IOverlayManagerElement

// Descubrir fuentes NDI en la red
var ndiSources = await DeviceEnumerator.Shared.NDISourcesAsync();
var ndiSettings = await NDISourceSettings.CreateAsync(
    null, 
    ndiSources[0].Name, 
    ndiSources[0].URL);

// Crear superposición NDI
var ndiOverlay = new OverlayManagerNDIVideo(
    ndiSettings, 
    x: 10, 
    y: 10, 
    width: 640, 
    height: 360);

// Inicializar y agregar al overlay manager
if (ndiOverlay.Initialize(autoStart: true))
{
    overlayManager.Video_Overlay_Add(ndiOverlay);
}

// Limpiar cuando termine
ndiOverlay.Stop();
ndiOverlay.Dispose();

public class OverlayManagerWPFControl : IOverlayManagerElement, IDisposable

public OverlayManagerWPFControl Video_Overlay_AddWPFControl(
    Func<FrameworkElement> elementFactory,
    int x, int y, int width, int height,
    int refreshRate = 15,
    string name = null)

// Agregar una superposición de texto con cambio de color usando el método de conveniencia
var wpfOverlay = overlayManager.Video_Overlay_AddWPFControl(
    elementFactory: () =>
    {
        var border = new Border
        {
            Width = 350,
            Height = 60,
            Background = new SolidColorBrush(Color.FromArgb(160, 0, 0, 0)),
            CornerRadius = new CornerRadius(8),
            Padding = new Thickness(15, 5, 15, 5)
        };

        var text = new TextBlock
        {
            Text = "VisioForge Media Framework",
            FontSize = 28,
            FontWeight = FontWeights.Bold,
            VerticalAlignment = VerticalAlignment.Center,
            HorizontalAlignment = HorizontalAlignment.Center
        };

        var brush = new SolidColorBrush(Colors.Red);
        text.Foreground = brush;
        border.Child = text;

        // Animar color del texto
        var colorAnim = new ColorAnimationUsingKeyFrames
        {
            Duration = TimeSpan.FromSeconds(5),
            RepeatBehavior = RepeatBehavior.Forever
        };
        colorAnim.KeyFrames.Add(new LinearColorKeyFrame(Colors.Red, KeyTime.FromPercent(0.0)));
        colorAnim.KeyFrames.Add(new LinearColorKeyFrame(Colors.Gold, KeyTime.FromPercent(0.25)));
        colorAnim.KeyFrames.Add(new LinearColorKeyFrame(Colors.Cyan, KeyTime.FromPercent(0.5)));
        colorAnim.KeyFrames.Add(new LinearColorKeyFrame(Colors.Magenta, KeyTime.FromPercent(0.75)));
        colorAnim.KeyFrames.Add(new LinearColorKeyFrame(Colors.Red, KeyTime.FromPercent(1.0)));
        brush.BeginAnimation(SolidColorBrush.ColorProperty, colorAnim);

        return border;
    },
    x: 50, y: 300, width: 350, height: 60,
    refreshRate: 30, name: "ColorText");

if (wpfOverlay == null)
{
    // La inicialización falló
}

// Crear una superposición de reloj analógico WPF manualmente
var clockOverlay = new OverlayManagerWPFControl(
    elementFactory: () =>
    {
        var canvas = new Canvas { Width = 200, Height = 200 };

        // Esfera del reloj
        var face = new Ellipse
        {
            Width = 180, Height = 180,
            Stroke = Brushes.White, StrokeThickness = 3
        };
        Canvas.SetLeft(face, 10);
        Canvas.SetTop(face, 10);
        canvas.Children.Add(face);

        // Manecilla de segundos con animación de rotación
        var secondHand = new Line
        {
            X1 = 100, Y1 = 100, X2 = 100, Y2 = 25,
            Stroke = Brushes.Red, StrokeThickness = 1
        };
        var secondRotate = new RotateTransform(DateTime.Now.Second * 6, 100, 100);
        secondHand.RenderTransform = secondRotate;
        canvas.Children.Add(secondHand);

        var anim = new DoubleAnimation
        {
            From = DateTime.Now.Second * 6,
            To = DateTime.Now.Second * 6 + 360,
            Duration = TimeSpan.FromSeconds(60),
            RepeatBehavior = RepeatBehavior.Forever
        };
        secondRotate.BeginAnimation(RotateTransform.AngleProperty, anim);

        return canvas;
    },
    x: 20, y: 20, width: 200, height: 200, refreshRate: 30);

if (clockOverlay.Initialize())
{
    overlayManager.Video_Overlay_Add(clockOverlay);
}

// Actualizar control WPF en tiempo de ejecución (seguro entre hilos)
clockOverlay.InvokeOnUIThread(() =>
{
    // Es seguro modificar elementos WPF aquí
});

// Limpiar
clockOverlay.Dispose();

public class OverlayManagerLine : IOverlayManagerElement

public class OverlayManagerRectangle : IOverlayManagerElement

public class OverlayManagerCircle : IOverlayManagerElement

public class OverlayManagerTriangle : IOverlayManagerElement

public class OverlayManagerStar : IOverlayManagerElement

public class OverlayManagerSVG : IOverlayManagerElement, IDisposable

public class OverlayManagerCallback : IOverlayManagerElement

public event EventHandler<OverlayManagerCallbackEventArgs> OnDraw;

var callback = new OverlayManagerCallback();
callback.OnDraw += (sender, e) => {
    var ctx = e.Context;
    ctx.SetSourceRGB(1, 0, 0);
    ctx.Arc(200, 200, 50, 0, 2 * Math.PI);
    ctx.Fill();
};
overlayManager.Video_Overlay_Add(callback);

public class OverlayManagerGroup : IOverlayManagerElement, IDisposable

// Crear un grupo para superposiciones que deben iniciar simultáneamente
var group = new OverlayManagerGroup("SyncGroup");

// Agregar una superposición de archivo de video
var videoOverlay = new OverlayManagerVideo(
    source: "intro.mp4",
    x: 10, y: 10, width: 640, height: 360)
{
    Loop = true,
    ZIndex = 10
};
group.Add(videoOverlay);

// Agregar una superposición de captura Decklink
var decklinkSettings = new DecklinkVideoSourceSettings(deviceNumber);
decklinkSettings.Mode = DecklinkMode.HD1080p2997;

var decklinkOverlay = new OverlayManagerDecklinkVideo(
    settings: decklinkSettings,
    x: 660, y: 10, width: 640, height: 360)
{
    ZIndex = 11
};

// Inicializar Decklink manualmente (el grupo maneja solo OverlayManagerVideo)
decklinkOverlay.Initialize(autoStart: false);
group.Add(decklinkOverlay);

// También puedes mezclar superposiciones que no son de video
var label = new OverlayManagerText("Camera 1", 10, 380);
label.Font.Size = 14;
label.Color = SKColors.White;
group.Add(label);

// Agregar grupo al overlay manager
overlayManager.Video_Overlay_Add(group);

// Iniciar todas las superposiciones OverlayManagerVideo del grupo
group.Play();
// Decklink debe iniciarse por separado (group.Play() solo maneja OverlayManagerVideo)
decklinkOverlay.Play();

// Más tarde, pausar/detener todas a la vez
group.Pause();
group.Stop();

// Limpiar
group.Dispose();

public class OverlayManagerZoom : IOverlayManagerElement

// Crear zoom 1.5x centrado en el cuadro
var zoom = new OverlayManagerZoom
{
    ZoomFactor = 1.5,
    CenterX = 0.5,
    CenterY = 0.5,
    Name = "VideoZoom"
};
zoom.ZIndex = -1000; // Procesar antes de otras superposiciones
overlayManager.Video_Overlay_Add(zoom);

public class OverlayManagerPan : IOverlayManagerElement

// Panorámica de video 100 píxeles a la derecha y 50 hacia abajo
var pan = new OverlayManagerPan
{
    OffsetX = 100,
    OffsetY = 50,
    Name = "VideoPan"
};
pan.ZIndex = -1000; // Procesar antes de otras superposiciones
overlayManager.Video_Overlay_Add(pan);

public class OverlayManagerFade : IOverlayManagerElement

public class OverlayManagerSqueezeback : IOverlayManagerElement

// Crear squeezeback con video en esquina inferior derecha
var squeezeback = new OverlayManagerSqueezeback
{
    BackgroundImageFilename = "marco.png", // PNG con centro transparente
    VideoRect = new Rect(960, 540, 1920, 1080), // Cuadrante inferior derecho
    Name = "Squeezeback"
};
squeezeback.ZIndex = -2000; // Procesar primero
overlayManager.Video_Overlay_Add(squeezeback);

// Obtener posición actual de reproducción
var position = await pipeline.Position_GetAsync();

// Animar video de pantalla completa a esquina en 2 segundos
var squeezeback = overlayManager.Video_Overlay_GetByName("Squeezeback") as OverlayManagerSqueezeback;
squeezeback.AnimateVideo(
    startRect: new Rect(0, 0, 1920, 1080),      // Pantalla completa
    targetRect: new Rect(1280, 720, 1920, 1080), // Esquina inferior derecha
    startTime: position,
    duration: TimeSpan.FromSeconds(2),
    easing: OverlayManagerPanEasing.EaseInOut
);

// Agregar squeezeback
var element = overlayManager.Video_Overlay_AddSqueezeback(
    backgroundImageFilename: "marco.png",
    videoRect: new Rect(960, 540, 1920, 1080),
    backgroundRect: null,  // Cuadro completo
    name: "Squeezeback"
);

// Actualizar posición de video
overlayManager.Video_Overlay_Squeezeback_UpdateVideoPosition("Squeezeback", newRect);

// Animar video
overlayManager.Video_Overlay_Squeezeback_AnimateVideo(
    "Squeezeback", startRect, targetRect, startTime, duration, easing);

// Controles de fade
overlayManager.Video_Overlay_Squeezeback_VideoFadeIn("Squeezeback", startTime, duration);
overlayManager.Video_Overlay_Squeezeback_VideoFadeOut("Squeezeback", startTime, duration);

// Orden de capas
overlayManager.Video_Overlay_Squeezeback_SetVideoOnTop("Squeezeback");
overlayManager.Video_Overlay_Squeezeback_SetBackgroundOnTop("Squeezeback");

public class OverlayManagerShadowSettings

var text = new OverlayManagerText("Info", 100, 100);
text.Background = new OverlayManagerBackgroundRectangle {
    Color = SKColors.Black.WithAlpha(128),
    Fill = true,
    Margin = new Thickness(5, 3, 5, 3)
};

public class FontSettings

// Crear pipeline y bloques
var pipeline = new MediaBlocksPipeline();
var fileSource = new UniversalSourceBlock(await UniversalSourceSettings.CreateAsync(videoUri));
var overlayManager = new OverlayManagerBlock();
var videoRenderer = new VideoRendererBlock(pipeline, videoView);

// Conectar pipeline
pipeline.Connect(fileSource.VideoOutput, overlayManager.Input);
pipeline.Connect(overlayManager.Output, videoRenderer.Input);

// Agregar marca de agua con logo
var logo = new OverlayManagerImage("logo.png", 10, 10);
logo.Opacity = 0.5;
logo.ZIndex = 10; // Encima
overlayManager.Video_Overlay_Add(logo);

// Agregar marca de tiempo
var timestamp = new OverlayManagerDateTime();
timestamp.X = 10;
timestamp.Y = pipeline.Height - 30;
timestamp.Font.Size = 16;
timestamp.Color = SKColors.White;
timestamp.Shadow = new OverlayManagerShadowSettings(true);
overlayManager.Video_Overlay_Add(timestamp);

// Agregar título animado (aparece después de 5 segundos)
var title = new OverlayManagerText("¡Bienvenido!", 100, 100);
title.Font.Size = 72;
title.Color = SKColors.Yellow;
title.StartTime = TimeSpan.FromSeconds(5);
title.EndTime = TimeSpan.FromSeconds(10);
title.Rotation = -10; // Ligera inclinación
title.Background = new OverlayManagerBackgroundRectangle {
    Color = SKColors.DarkBlue,
    Fill = true
};
overlayManager.Video_Overlay_Add(title);

// Iniciar reproducción
await pipeline.StartAsync();

// Actualizar superposiciones dinámicamente
title.Text = "¡Texto Actualizado!";
overlayManager.Video_Overlay_Update(title);