Flex 4 文件参考选定的图像文件尺寸（宽度和高度）

Posted 2023-03-06

【中文标题】Flex 4 文件参考选定的图像文件尺寸（宽度和高度）

【英文标题】：Flex 4 fileReference selected image file dimmensions (width and height)

【发布时间】：2011-03-27 06:07:01

【问题描述】：

我使用 fileReference.browse() 从硬盘中选择一个图像文件。

请问如何查看所选图片文件的宽度和高度？

谢谢！

【参考方案1】：

使用 loadBytes() 将 fileReference.data 加载到加载器中。然后你就会有：sourceBMP:Bitmap = loader.content as Bitmap;

这是一个示例代码：

MXML 部分：

<fx:Declarations>
    <net:FileReference id="fileReference"
        select="fileReference_select(event);"
        complete="fileReference_complete(event);" />
</fx:Declarations>
<s:Button id="uplaodImageBtn"
    label="Upload Image"
    click="uplaodImageBtn_clickHandler()"/>

AS3 部分：

private function uplaodImageBtn_clickHandler() : void 
    var arr:Array = [];
    arr.push(new FileFilter("Images", ".gif;*.jpeg;*.jpg;*.png"));
    fileReference.browse(arr);


private function fileReference_select(evt:Event):void 
    fileReference.load();


private function fileReference_complete(event:Event):void 
    var loader:Loader = new Loader();
    loader.contentLoaderInfo.addEventListener(Event.COMPLETE, loader_complete);
    loader.loadBytes(fileReference.data);


public function loader_complete (event:Event) : void 
    var sourceBMP:Bitmap = event.currentTarget.loader.content as Bitmap;
    Alert.show(sourceBMP.width + ', ' +sourceBMP.height);

【讨论】：

谢谢你，安迪！我想知道这种技术会给应用程序增加多少开销。但是很好的答案。谢谢！

我看到您选择了不同的解决方案，将图像添加到显示列表中。根据您在 8 月 10 日的评论，我认为您不想这样做。

确实如此。我没有看到下面的 MXML 部分：<s:Image id="image" maxHeight="200" maxWidth="200"/>。在想image 只是一个没有添加到阶段的 AS 变量。

【参考方案2】：

从 Flex 的上下文来看，我很确定一旦您从浏览器中返回结果，它只是一个 byteArray。从理论上讲，如果您使用该 byteArray 作为图像标签的来源，一旦将该图像添加到容器中，您就可以通过这种方式获得高度和宽度。

否则，我认为没有一种简单的方法可以使用 Flex 从本地文件中获取此类元数据信息。

【讨论】：

这是一个字节数组，是的。我考虑过以编程方式创建一个 Image 对象，但担心这样做的开销。你是说即使我这样做我也必须使用 addChild 才能测量它的内容维度？我不关心容器的大小，只关心所选图片的宽度和高度。谢谢！

是的，创建图像对象可能会有开销。我确实相信在使用 AddChild 方法将图像添加到其父级之前不会对其进行测量，因此除非您明确设置它们，否则高度和宽度将为零。

【参考方案3】：

如果您等待图像源属性更新，您应该能够读取 image.sourceWidth 和 image.sourceHeight。这将为您提供未缩放的原始值。

<fx:Script>
    <![CDATA[

        import mx.events.FlexEvent;     

        private function browseImage(event:MouseEvent):void 
            var arr:Array = [];
            arr.push(new FileFilter("Images", ".gif;*.jpeg;*.jpg;*.png"));
            imageFileReference.browse(arr);         
        

        private function imageSelect(evt:Event):void 
            imageFileReference.load();
        

        private function imageComplete(evt:Event):void 
            image.source = smallImageFileReference.data;
            image.addEventListener(FlexEvent.UPDATE_COMPLETE, getImageSize);                
        

        private function getImageSize(evt:FlexEvent):void 
            image.removeEventListener(FlexEvent.UPDATE_COMPLETE, getImageSize);         
            imageWidth.text = image.sourceWidth + "px";
            imageHeight.text = image.sourceHeight + "px";
        
    ]]>

</fx:Script>

<fx:Declarations>
    <net:FileReference id="imageFileReference" 
        select="imageSelect(event)" 
        complete="imageComplete(event)"/>
</fx:Declarations>

<s:VGroup  >

    <s:HGroup  verticalAlign="middle">
        <s:Label fontWeight="bold" text="Width:" />
        <mx:Text id="imageWidth" />
    </s:HGroup> 

    <s:HGroup  verticalAlign="middle">
        <s:Label fontWeight="bold" text="Height:" />
        <mx:Text id="imageHeight" />
    </s:HGroup>

    <s:Image id="image" maxHeight="200" maxWidth="200" />
    <s:Button label="Browse for Image" click="browseImage(event)" />

</s:VGroup>