使用合成從 UWP 中的 UI 控件創建視頻

Question

我正在創建一個應用程序，該應用程序從無人機獲取視頻並覆蓋傳感器數據。

請在這里觀看它的實際操作：

https://youtu.be/eAOjImJci3M

但這不會編輯視頻，它只是在應用程序上。

我的目標是制作一個帶有疊加數據的新視頻。 如何隨着時間的推移捕獲 UI 的元素並從中制作MediaClip ？

Answer 1

簡短回答：以一定的間隔截取UI的屏幕截圖，然后將它們累積以制作視頻：

長答案：讓我們將您想要記錄的 UI 命名為myGrid ，要在一個時間間隔內獲取屏幕截圖，您可以使用DispatcerTimer ，並像這樣處理Tick事件：

private async void Tm_Tick(object sender, object e)
{
    RenderTargetBitmap rendertargetBitmap = new RenderTargetBitmap();
    await rendertargetBitmap.RenderAsync(myGrid);
    var bfr = await rendertargetBitmap.GetPixelsAsync();

    CanvasRenderTarget rendertarget = null
    using (CanvasBitmap canvas = CanvasBitmap.CreateFromBytes(CanvasDevice.GetSharedDevice(), bfr, rendertargetBitmap.PixelWidth, rendertargetBitmap.PixelHeight, Windows.Graphics.DirectX.DirectXPixelFormat.B8G8R8A8UIntNormalized))
    {
        rendertarget = new CanvasRenderTarget(CanvasDevice.GetSharedDevice(), canvas.SizeInPixels.Width, canvas.SizeInPixels.Height, 96);
        using (CanvasDrawingSession ds = rendertarget.CreateDrawingSession())
        {
            ds.Clear(Colors.Black);
            ds.DrawImage(canvas);
        }
    }
    MediaClip m = MediaClip.CreateFromSurface(rendertarget, TimeSpan.FromMilliseconds(80));
    mc.Clips.Add(m);
}

mc是我之前聲明的MediaComposition對象。

完成錄制后，停止DispatcherTimer並將視頻保存在磁盤上，如下所示：

tm.Stop();
await mc.RenderToFileAsync(file, MediaTrimmingPreference.Precise, MediaEncodingProfile.CreateMp4(VideoEncodingQuality.Vga));

tm是我之前聲明的DispatcherTimer ， file是帶有 mp4 擴展名的StorageFile 。

此過程不需要您將每個屏幕截圖保存到磁盤。

如果你想知道為什么我使用了一個額外的CanvasRenderTarget ，那是因為這個問題。

希望有幫助。