控制視訊檢視的位置和大小

您可以使用MediaPlayerView物件來控制視訊檢視的位置和大小。

依預設,當視訊的大小或位置因應用程式、描述檔開關、內容開關等變更而變更時,瀏覽器TVSDK會嘗試維持視訊檢視的外觀比例。

通過指定不同的​比例策略,可以覆蓋預設長寬比行為。 使用MediaPlayerView物件的scalePolicy屬性指定縮放原則。 預設縮放原則MediaPlayerView是以MaintainAspectRatioScalePolicy類別的例項設定。 若要重設比例原則,請以您自己的原則取代MediaPlayerView.scalePolicy上的預設例項MaintainAspectRatioScalePolicy

重要

不能將scalePolicy屬性設定為空值。

非Flash備援藍本

在非Flash的備援藍本中,為使縮放原則正常運作,View建構函式中提供的視訊div元素應傳回offsetWidthoffsetHeight的非零值。 若要提供不正確的函式範例,有時在css中未明確設定視訊div元素的寬度和高度時,View建構函式會針對offsetWidthoffsetHeight傳回零。

注意

CustomScalePolicy對一些瀏覽器的支援有限,尤其是IE、Edge和Safari 9。 對於這些瀏覽器,視訊的原生外觀比例無法變更。 不過,視訊的位置和尺寸會根據縮放原則強制執行。

  1. 實作MediaPlayerViewScalePolicy介面以建立您自己的縮放原則。

    MediaPlayerViewScalePolicy有一個方法:

    /** 
    * Adjust the specified rectangle to match the new video dimensions. 
    * @param viewPort {AdobePSDK.Rectangle}The video rectangle as absolute position. 
    * @param videoWidth {Number}The video width. 
    * @param videoHeight {Number} The video height. 
    * @return {AdobePSDK.Rectangle} an adjusted rectangle. 
    */ 
    function adjustCallbackFunc(viewPort, videoWidth, videoHeight);
    

    例如:

    /** 
    Default Constructor 
    */ 
    MediaPlayerViewCustomScalePolicy = function() { 
        return this; 
    }; 
    MediaPlayerViewCustomScalePolicy.prototype = { 
        constructor: MediaPlayerViewScalePolicy, 
        adjustCallbackFunc: function(viewPort, videoWidth, videoHeight) { 
            /* Your Custom Adjustment here. */ 
            [...] 
            return adjustedRectangle; 
        } 
    };
    
  2. 將實施指派給MediaPlayerView屬性。

    var view = new AdobePSDK.MediaPlayerView(videoDiv); 
    view.scalePolicy= new MediaPlayerViewCustomScalePolicy();
    
  3. 將您的檢視新增至Media Player的view屬性。

    mediaplayer.view = view;
    

例如:縮放視訊以填滿整個視訊檢視,而不需維持外觀比例:

/** 
 * Default constructor. 
 */ 
MediaPlayerViewCustomScalePolicy = function() { 
    return this; 
}; 
MediaPlayerViewCustomScalePolicy.prototype = { 
    constructor: MediaPlayerViewScalePolicy, 
    /** 
    * A very simple custom scale policy - the video will fill the entire 
    * allocated space. The aspect ratio will not be kept. 
    */ 
    adjustCallbackFunc: function(viewPort, videoWidth, videoHeight) { 
        return viewPort; 
    } 
}; 
var view = new AdobePSDK.MediaPlayerView(videoDiv); 
view.scalePolicy = new MediaPlayerViewCustomScalePolicy (); 
mediaPlayer.view = view;

本頁內容