1

我想构建一个组件，用户可以在其中播放 Flex Spark VideoDisplay 中的视频。会有一个按钮，每当按下按钮时，我都想保存 VideoDisplay 的当前时间和屏幕截图。屏幕截图需要以某种方式保存，因为我想在 DataGrid 中显示所有时间和屏幕截图（当用户将时间悬停在 DataGrid 中时，屏幕截图应该出现）。

那么，如何截取 Spark VideoDisplay 的屏幕截图并保存/显示它们？

4

2 回答 2

3

您可以通过几种方式拍摄快照，这种方式只使用 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-02T10:12:40.860 回答
1

使用 flex 中的 JPEGEncoder 将其转换为 bytearray，然后使用 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();

现在您可以通过 HTTP post 方法将 b64String 传递给您的服务器 :)

于 2010-10-20T03:17:46.187 回答