如何旋轉拍攝的視訊 (HTML)

[ 本文的目標對象是撰寫 Windows 執行階段 App 的 Windows 8.x 和 Windows Phone 8.x 開發人員。如果您正在開發適用於 Windows 10 的 App，請參閱 最新文件 ]

您可以在 MediaCapture 類別上使用 SetPreviewRotation 和 SetRecordRotation 方法，以旋轉從相機拍攝的視訊。

這個範例的完整程式碼將列於這個 How-to 的結尾。

先決條件

這個主題假設您可以利用 JavaScript，以適用於 JavaScript 的 Windows Library 範本建立基本的 Windows 市集應用程式。如果建立您的第一個應用程式時需要協助，請參閱使用 JavaScript 建立您的第一個 Windows 市集應用程式。

指示

步驟 1: 建立 MediaCapture 物件

MediaCapture 類別包含用來管理所拍攝視訊的方法和屬性。若要從相機拍攝視訊並加以旋轉，您需要使用 InitializeAsync、StartPreviewAsync 及 SetPreviewRotation。使用 SetRecordRotation 可為正在錄製的視訊設定旋轉角度。

這個範例會將一個新的 MediaCapture 物件具現化，並呼叫 InitializeAsync 將 MediaCapture 物件初始化為預設設定。您可以將 MediaCaptureInitializationSettings 物件傳入到 InitializeAsync 來指定設定。

    oMediaCapture = new Windows.Media.Capture.MediaCapture();
    oMediaCapture.initializeAsync().then(function (result) {

步驟 2: 設定錄製的視訊旋轉

將 Windows.Media.Capture.VideoRotation 列舉值傳遞到 MediaCapture 物件的 SetRecordRotation 方法，即可設定錄製時使用的視訊影像旋轉角度。VideoRotation 列舉會指定旋轉視訊的角度大小。其中包含 0、90、180 及 270 度等值。

        oMediaCapture.setRecordRotation(Windows.Media.Capture.VideoRotation.clockwise90Degrees);         

若要取得錄製時將使用的旋轉值，請呼叫 GetRecordRotation 方法。這個方法會傳回 VideoRotation 列舉值。

    var videoRotation = oMediaCapture.getRecordRotation();   

同樣地，呼叫 GetPreviewRotation 和 SetPreviewRotation 方法就可以設定預覽視訊時所使用的旋轉角度。這些方法也會使用 VideoRotation 列舉值來指定視訊的旋轉角度。

步驟 3: 錄製視訊

設定新的視訊旋轉值之後，您可以按照如何錄製到檔案主題所列的步驟，錄製旋轉的視訊。通常會在初始化 MediaCapture 物件之前先設定視訊旋轉。

var oMediaCapture;

function setRotation() {
    oMediaCapture = new Windows.Media.Capture.MediaCapture();
    oMediaCapture.initializeAsync().then(function (result) {
        // Set the video rotation value.
        oMediaCapture.setRecordRotation(Windows.Media.Capture.VideoRotation.clockwise90Degrees);         
    }, errorHandler);

    //Check rotation value;
    var videoRotation = oMediaCapture.getRecordRotation();   
    
    // Ready to start the capture session   
}

相關主題

媒體擷取範例