如何截取Flex Spark VideoDisplay的截圖？

我想要構建一個組件，用戶可以在Flex Spark VideoDisplay中播放視頻。將會有一個按鈕，每當按下按鈕時，我想保存VideoDisplay的當前時間以及屏幕截圖。因爲我想在DataGrid中顯示所有時間和截圖（當用戶在DataGrid中逗留一段時間時應該顯示屏幕截圖），屏幕截圖需要保存一些。如何截取Flex Spark VideoDisplay的截圖？

所以，我怎麼能走星火的VideoDisplay的截屏並保存/顯示它們？

來源

2010-03-02 Thomas

您可以拍攝快照的幾種方式，這種方式只採用將ImageSnapshot類，但你可以通過手動繪製視頻顯示的位圖，如果你想做到這一點。這裏有一個例子：

渲染

<?xml version="1.0" encoding="utf-8"?> 
<s:ItemRenderer 
    xmlns:fx="http://ns.adobe.com/mxml/2009" 
    xmlns:s="library://ns.adobe.com/flex/spark" 
    xmlns:mx="library://ns.adobe.com/flex/mx" 
    width="100" height="100" creationComplete="trace(data)"> 

    <mx:Image source="{this.data}" width="100%" height="100%"/> 

</s:ItemRenderer>

示例應用程序

<?xml version="1.0" encoding="utf-8"?> 
<s:Application 
    xmlns:fx="http://ns.adobe.com/mxml/2009" 
    xmlns:s="library://ns.adobe.com/flex/spark" 
    xmlns:mx="library://ns.adobe.com/flex/mx"> 

    <fx:Script> 
     <![CDATA[ 

      import mx.graphics.ImageSnapshot; 

      public function takeSnapshot():void 
      { 
       var snapshot:BitmapData = ImageSnapshot.captureBitmapData(videoDisplay); 
       var bitmap:Bitmap = new Bitmap(snapshot); 
       list.dataProvider.addItem(bitmap); 
      } 
     ]]> 
    </fx:Script> 

    <s:layout> 
     <s:VerticalLayout horizontalAlign="center"/> 
    </s:layout> 

    <s:VideoDisplay id="videoDisplay" 
     source="video.mov" 
     width="400" height="300"/> 

    <s:Button id="button" click="takeSnapshot()"/> 

    <s:List id="list" horizontalCenter="0" width="100%" itemRenderer="SnapshotRenderer"> 
     <s:dataProvider> 
      <mx:ArrayList/> 
     </s:dataProvider> 
     <s:layout> 
      <s:TileLayout/> 
     </s:layout> 
    </s:List> 
</s:Application>

要完成你描述什麼（拍攝快照，並保存快照），你可以存儲那些在在那個數組中takeSnapshot方法，或者你可以通過list.dataProvider循環獲取位圖。然後你只需要將它們傳遞給後端語言（ruby，python，php ...）來保存。

希望幫助，蘭斯

來源

2010-03-02 10:12:40

感謝您的服務器！我實際上並不想保存它們。用戶在播放視頻時應該可以使用它們。 – Thomas 2010-03-08 08:05:23

使用JPEGEncoder在彎曲將其轉換爲字節組，然後編碼使用b64encoder如下字節數組：

var jpg:JPEGEncoder = new JPEGEncoder(); 
var ba:ByteArray = jpg.encode(bitmapData);   

var b64encoder:Base64Encoder = new Base64Encoder(); 
b64encoder.encodeBytes(ba); 
var b64String:String = b64encoder.flush();

現在，你可以通過你的b64String通過HTTP POST方法:)

來源

2010-10-20 03:17:46 Jeannius

如何截取Flex Spark VideoDisplay的截圖？

回答

相關問題