在Flex / Actionscript中捕获视频缩略图

时间:2011-11-29 00:48:29

标签: flex video actionscript air thumbnails

我正在撰写Adobe Air应用程序。用户可以将视频导入应用程序,但为了节省应用程序的某些部分的内存,我需要先将这些视频转换为缩略图.jpgs并仅在tilelist中显示缩略图。因此,必须在运行时动态生成这些缩略图。所以我的问题是,如何将视频转换为缩略图。到目前为止,我尝试了两种不同的方法。我已经使用了我工作的ImageSnapshot类,但只有在我首先将视频添加到显示列表中时才能使用。那么我尝试使用BitmapData类绘制bitmapdata并遇到同样的问题。它只有在我首先将视频添加到显示列表时才有效。有没有人知道如何在没有首先将视频添加到屏幕的情况下从视频帧中获取bitmapdata?这是我现在正在使用的代码,它将最终的.jpg作为test.jpg写入桌面,仅适用于.mp4视频。如果你拿出说明.AddElement(vd)的行,它就不再起作用了:

<?xml version="1.0" encoding="utf-8"?>
<s:WindowedApplication 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;
                              import mx.graphics.codec.JPEGEncoder;

                              import spark.components.VideoDisplay;
                              import spark.primitives.BitmapImage;
                              private const acceptableTypes:FileFilter = new FileFilter("Media", "*.mp4");
                              private var vd:VideoDisplay;

                              protected function importVideo(event:MouseEvent):void
                              {
                                        var file:File = File.userDirectory;
                                        file.addEventListener(Event.SELECT, mediaSelectHandler);
                                        file.browseForOpen("Select File To Import", [acceptableTypes]);
                              }

                              private function mediaSelectHandler(event:Event):void {
                                        vd = new VideoDisplay();
                                        vd.autoPlay = false;
                                        vd.horizontalCenter = 0;
                                        vd.verticalCenter = 0;
                                        vd.source = event.currentTarget.nativePath;
                                        this.addElement(vd);
                              }

                              private function getSnapShot(event:MouseEvent):void{
                                        var bd:BitmapData = new BitmapData(vd.width, vd.height);
                                        var matrix:Matrix = new Matrix();
                                        bd.draw(vd, matrix);

                                        //save to hard drive
                                        var file:File = File.desktopDirectory;
                                        var imgfile:File = file.resolvePath("test.jpg");
                                        var jpegEncoder:JPEGEncoder = new JPEGEncoder(90);
                                        var jpegStream:ByteArray = jpegEncoder.encode(bd);
                                        var filestream:FileStream = new FileStream();
                                        filestream.open(imgfile, FileMode.WRITE);
                                        filestream.writeBytes(jpegStream, 0, jpegStream.length);
                                        filestream.close();
                              }
                    ]]>
          </fx:Script>

          <fx:Declarations>
                    <!-- Place non-visual elements (e.g., services, value objects) here -->
          </fx:Declarations>
          <s:HGroup width="500" height="40" horizontalCenter="0" bottom="50">
                    <s:Button width="100" height="28" label="IMPORT" click="importVideo(event)"/>
                    <s:Button width="100" height="28" label="SNAPSHOT" click="getSnapShot(event)"/>
          </s:HGroup>
</s:WindowedApplication>

1 个答案:

答案 0 :(得分:0)

您可能需要使用ffmpeg实用程序,并且可以将解决方案提升到下一级别。对于例如你上传了10分钟的视频。您可以从第1分钟开始拍摄10张快照,持续时间为1分钟。这将为您提供一系列视频快照。您可以将组件实现为时间轴,并在滚动时显示相关的快照。你可能已经在视频网站上看到过这个。