Как создать видео с оверлеями в UWP? - PullRequest
Новая
       97

Как создать видео с оверлеями в UWP?

0 голосов
/ 15 октября 2018

Я использую MediaComposition для создания отредактированного видео.

Составленное видео будет:

  • Один видеоклип
  • Набор изображений(оверлейные кадры), которые должны быть показаны поверх него.

Результат должен быть таким: https://www.youtube.com/watch?v=cFEkkQIYGBc

Мой текущий код выглядит следующим образом.Каждый кадр является абстракцией наложенного изображения.Я назвал это frames 

private async Task ExportFrames(IEnumerable<OverlayFrame> frames, IStorageFile inputFile,
    IStorageFile outputFile)
{
    var folder = await ApplicationData.Current.LocalFolder.CreateFolderAsync("Test", CreationCollisionOption.ReplaceExisting);
    var composition = new MediaComposition();

    foreach (var frame in frames)
    {
        var render = new RenderTargetBitmap();
        control.DataContext = convertFunc(frame.Status);

        await render.RenderAsync(control);
        var pixel = await render.GetPixelsAsync();
        var file = await folder.CreateFileAsync("overlay.png", CreationCollisionOption.GenerateUniqueName);
        using (var stream = await file.OpenAsync(FileAccessMode.ReadWrite))
        {
            var logicalDpi = DisplayInformation.GetForCurrentView().LogicalDpi;
            var encoder = await BitmapEncoder.CreateAsync(BitmapEncoder.PngEncoderId, stream);

            encoder.SetPixelData(
                BitmapPixelFormat.Bgra8,
                BitmapAlphaMode.Ignore,
                (uint)render.PixelWidth,
                (uint)render.PixelHeight,
                logicalDpi,
                logicalDpi,
                pixel.ToArray());

            await encoder.FlushAsync();
            stream.Dispose();
            var clip = await MediaClip.CreateFromImageFileAsync(file, frame.Duration);
            AddOverlay(composition, clip, 0, 0, control.ActualWidth, control.ActualHeight);
        }                
    }

    var originalVideo = await MediaClip.CreateFromFileAsync(inputFile);
    composition.Clips.Add(originalVideo);

    await composition.RenderToFileAsync(outputFile, MediaTrimmingPreference.Precise);
    await folder.DeleteAsync();
}

private void AddOverlay(MediaComposition composition, MediaClip overlayMediaClip, double left, double top, double width, double height)
{
    var overlayPosition = new Rect(left, top, width, height);

    var mediaOverlay = new MediaOverlay(overlayMediaClip)
    {
        Position = overlayPosition,                 
    };

    var mediaOverlayLayer = new MediaOverlayLayer();
    mediaOverlayLayer.Overlays.Add(mediaOverlay);

    composition.OverlayLayers.Add(mediaOverlayLayer);
}

. В foreach я генерирую png-файл, соответствующий информации наложения.Он генерируется с использованием RenderTargetBitmap из элемента управления в пользовательском интерфейсе.

После цикла foreach я добавляю исходное видео (inputFile)

Проблема заключается в том, что сгенерированное видео показывает только оригиналвидео.Там нет наложения.

Что я делаю не так?

...