Language: HTML | XAML

How to rotate captured video (XAML)

Applies to Windows only

You can rotate video captured from a camera by using the SetPreviewRotation and SetRecordRotation methods on the MediaCapture class.

Roadmap: How does this topic relate to others? See:

The full code for setting the rotation on the capture preview is listed at the end of this how-to.

Prerequisites

This topic assumes that you can create a basic Windows Store app using C++, C#, or Visual Basic. For help creating your first app, see Create your first Windows Store app using C# or Visual Basic.

Instructions

Step 1: Create a CaptureElement

Create a CaptureElement in Extensible Application Markup Language (XAML).This will be used to render the video to the display. This example creates a basic CaptureElement with a Height of 400.


<CaptureElement Name="capturePreview" Height="400" />


Step 2: Create the MediaCapture object

The MediaCapture class contains methods and properties for managing captured video. To capture and rotate video from a camera, you will need to use InitializeAsync, StartPreviewAsync, and SetPreviewRotation. Use SetRecordRotation to set the rotation for video that is being recorded.

This example instantiates a new MediaCapture object and calls InitializeAsync to initializes the MediaCapture object to the default settings. You can pass in a MediaCaptureInitializationSettings object into InitializeAsync to specify settings.


MediaCapture captureMgr = new MediaCapture();

// Set the MediaCapture to a variable in App.xaml.cs to handle suspension.
(App.Current as App).MediaCapture = captureMgr;

await captureMgr.InitializeAsync();


Caution  If your app creates a new MediaCapture object, you must always make sure you dispose of it properly. For instructions on cleaning up the MediaCapture object and related objects, see Quickstart: capturing video by using the MediaCapture api.

Step 3: Set the video rotation

To set the rotation of the video for previewing, pass a Windows.Media.Capture.VideoRotation enumeration value to SetPreviewRotation. The VideoRotation enumeration specifies the amount by which to rotate the video. It contains values for None (0), 90, 180, and 270 degrees.


captureMgr.SetPreviewRotation(VideoRotation.Clockwise90Degrees);


To set the rotation of the video for recording, there is a SetRecordRotation method, but rotating the video in this way is inefficient. Instead, you should use the MediaEncodingProfile to encode the rotation within the video stream. The example below creates a MediaEncodingProfile. Next it creates the GUID for the MF_MT_VIDEO_ROTATION attribute. The helper method ConvertVideoRotationToMFRotation converts the requested VideoRotation value into a value that can be used with MF_MT_VIDEO_ROTATION. The GUID and the rotation value are then added to the encoding profile's Video property list. Finally, when you call StartRecordToStorageFileAsync the rotation is encoded in the video.


public async void StartRecordWithRotation(Windows.Storage.StorageFile videoFile)
{

    var mediaEncodingProps = Windows.Media.MediaProperties.MediaEncodingProfile.CreateMp4(
        Windows.Media.MediaProperties.VideoEncodingQuality.Auto);

    System.Guid MFVideoRotationGuid =
    new System.Guid("C380465D-2271-428C-9B83-ECEA3B4A85C1"); // MF_MT_VIDEO_ROTATION in Mfapi.h

    int MFVideoRotation = ConvertVideoRotationToMFRotation(VideoRotation.Clockwise90Degrees);

    mediaEncodingProps.Video.Properties.Add(MFVideoRotationGuid, PropertyValue.CreateInt32(MFVideoRotation));

    await captureMgr.StartRecordToStorageFileAsync(mediaEncodingProps, videoFile);
}
 
int ConvertVideoRotationToMFRotation(VideoRotation rotation)
{
    int MFVideoRotation = 0; // MFVideoRotationFormat::MFVideoRotationFormat_0 in Mfapi.h
    switch(rotation)
    {
    case VideoRotation.Clockwise90Degrees:
        MFVideoRotation = 90; // MFVideoRotationFormat::MFVideoRotationFormat_90;
        break;
    case VideoRotation.Clockwise180Degrees:
        MFVideoRotation = 180; // MFVideoRotationFormat::MFVideoRotationFormat_180;
        break;
    case VideoRotation.Clockwise270Degrees:
        MFVideoRotation = 270; // MFVideoRotationFormat::MFVideoRotationFormat_270;
        break;
    }
 
    return MFVideoRotation;
}


Step 4: Get the rotation value

To get the rotation value that will be used for previewing, call GetPreviewRotation. This method returns a VideoRotation enumeration value.

This example gets the preview rotation value.


VideoRotation previewRotation = captureMgr.GetPreviewRotation();


Related topics

Roadmaps
Roadmap for Windows Runtime apps using C# and Visual Basic
Roadmap for Windows Runtime apps using C++
Designing UX for apps
Adding multimedia
Samples
Media capture sample
Camera capture UI sample
Camera options UI sample
Device enumeration sample
Media extension sample
Real-Time communication sample
Tasks
Quickstart: video and audio
How to select audio tracks in different languages
Reference
Windows.Media.Capture
CaptureElement
Other resources
Optimize media resources

 

 

Show:
© 2014 Microsoft