我尝试构建一个多图像上传器。在图像上传工作正常,其进度条工作正常..但它的关闭按钮不起作用。如果我点击关闭按钮,图像和细节将从file..but它也上传并显示在progres栏..我怎么能保持这个问题?任何人都可以帮助我吗??请... 我的演示是http://demo.enfintech.net/MultipleFileUpload/ 我的代码在下面给出
<?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" minWidth="955" minHeight="600" creationComplete="init()" xmlns:aaronhardy="aaronhardy.*">
<fx:Declarations>
<!-- Place non-visual elements (e.g., services, value objects) here -->
</fx:Declarations>
<fx:Style>
@namespace s "library://ns.adobe.com/flex/spark";
@namespace mx "library://ns.adobe.com/flex/mx";
global
{
font-weight: bold;
}
</fx:Style>
<fx:Script>
<![CDATA[
import aaronhardy.ProgressBar;
import flash.sampler.NewObjectSample;
import flash.utils.flash_proxy;
import flash.utils.setTimeout;
import mx.charts.renderers.AreaRenderer;
import mx.collections.ArrayCollection;
import mx.controls.Alert;
import mx.events.Request;
import mx.geom.RoundedRectangle;
import mx.utils.OnDemandEventDispatcher;
private var refAddFiles:FileReferenceList=new FileReferenceList;
private var fileReference:FileReference=new FileReference;
private var serverSideUrl:String="http://demo.enfintech.net/MultipleFileUpload/fileUploader/uploadFile.php";
// private var serverSideUrl:String="http://192.168.1.60/fileUploader/uploadFile.php";
private var list:Array=new Array();
public var urlReq:URLRequest;
private var initial:int=0;
private var totalSize:Number=0;
private var isSelected:Boolean=false;
private var images:Object;
private var fileSizeArray:Array=new Array();
private var temp:Number=0;
public var fileListLength:int;
public var loaded:int;
public var totalUploaded:int;
[Bindable] private var files:ArrayCollection = new ArrayCollection();
private function init():void
{
Security.loadPolicyFile("http://demo.enfintech.net/crossdomain.xml");
progressBar2.visible=false;
refAddFiles.addEventListener(Event.SELECT,fileRefSelect);
urlReq = new URLRequest(serverSideUrl);
}
private function fileRefSelect(event:Event):void
{
progressBar2.visible=false;
upload1();
isSelected=true;
}
private function uploadFiles():void
{
if(files.length==0)
{
Alert.show("Please Select file(s)");
}
else
{
gotoMultipleUpload();
}
}
public function gotoMultipleUpload():void
{
// var fileReference:FileReference;
fileReference = FileReference(list[initial]);
fileReference.addEventListener(Event.COMPLETE, uploadCompleteHandler);
fileReference.addEventListener(ProgressEvent.PROGRESS,progressBarEvent);
fileReference.addEventListener(IOErrorEvent.IO_ERROR,uploadFails);
fileReference.upload(urlReq);
}
private function uploadFails(event:IOErrorEvent):void
{
Alert.show("Error");
}
private function uploadCompleteHandler(event:Event):void
{
totalUploaded=totalUploaded+list[initial].size;
if(initial<fileListLength-1)
{
initial++;
gotoMultipleUpload();
}
else
{
progressBar2.label="Upload Completed ("+(initial+1)+"/"+fileListLength+")";
Alert.show("File Uploaded Completed");
upload0.enabled=false;
cancel.enabled=false;
select.enabled=true;
}
}
private function progressBarEvent(event:ProgressEvent):void
{
files[initial].currentValue=event.bytesLoaded;
progressBar2.visible=true;
var numPerc:Number=Math.round(((event.bytesLoaded+totalUploaded)/totalSize)*100);
progressBar2.setProgress(event.bytesLoaded+totalUploaded,totalSize);
progressBar2.label="Uploading "+numPerc+"% ("+(initial+1)+"/"+fileListLength+")";
}
public function upload1():void
{
try
{
initial=0;
loaded=0;
totalUploaded=0;
list=new Array();
list=refAddFiles.fileList;
fileListLength=list.length;
fileSizeArray.push(list[0].size);
for(var i:int=0;i<fileListLength;i++)
{
totalSize+=list[i].size;
list[i].addEventListener(Event.COMPLETE, fileRefCompleted);
list[i].load();
}
}
catch(e:Error)
{
Alert.show(e.message);
}
}
public function fileRefCompleted(event:Event):void
{
loaded=loaded+1;
if(loaded==fileListLength)
addFilesToDatagrid();
}
public function addFilesToDatagrid():void
{
var temp:Number;
for(var i:int=0;i<list.length;i++)
{
images=new Object();
images["fileName"]=list[i].name;
images["size"]=list[i].size;
images["preview"]=list[i].data as ByteArray;
images["currentValue"]=0;
if(list[i].size/1024>=1)
{
temp=list[i].size/1024;
if(temp/1024>=1)
{
temp=temp/1024;
images["sizeconverted"]=String(temp.toFixed(1))+"Mb";
}
else
{
images["sizeconverted"]=String(temp.toFixed(1))+"Kb";
}
}
files.addItem(images);
}
select.enabled=false;
}
public function removeItem():void
{
var item:int=dgMain.selectedIndex;
files.removeItemAt(item);
}
private function cancelClick():void
{
fileReference.cancel();
progressBar2.label="FileUpload Cancelled";
upload0.enabled=true;
}
private function browsebtn():void
{
files.removeAll();
files.refresh();
var arr:Array = [];
arr.push(new FileFilter("Images", ".gif;*.jpeg;*.jpg;*.png"));
refAddFiles.browse(arr);
upload0.enabled=true;
cancel.enabled=true;
totalUploaded=0;
totalSize=0;
}
private function titleWindowClose():void
{
var item:int=dgMain.selectedIndex;
files.removeAll();
progressBar2.visible=false;
select.enabled=true;
upload0.enabled=true;
}
]]>
</fx:Script>
<s:TitleWindow x="204" y="10" width="520" height="325" id="titleWindow"
skinClass="TitleSkin" title="File Uploader" close="titleWindowClose()">
<mx:DataGrid id="dgMain" x="0" y="0" width="518" height="237" allowMultipleSelection="true"
dataProvider="{files}" fontFamily="Arial" fontSize="12" headerHeight="0"
horizontalScrollPolicy="off" variableRowHeight="true">
<mx:columns>
<mx:DataGridColumn dataField="preview" headerText="Preview" width="40" paddingLeft="5" itemRenderer="ImageDatagrdItmRndr"/>
<mx:DataGridColumn dataField="fileName" headerText="Name" width="380" itemRenderer="itmRndrPrgrsBar"/>
<mx:DataGridColumn dataField="sizeconverted" headerText="Size" width="60"/>
<mx:DataGridColumn id="close" headerText="Size" width="40" itemRenderer="buttonClose"/>
</mx:columns>
</mx:DataGrid>
<mx:ProgressBar id="progressBar2" x="-1" y="237" width="518" barColor="haloblue"
labelPlacement="center" mode="manual" themeColor="#eaeaea"
trackColors="[white,halosilver]"/>
<s:Button id="select" bottom="5" width="87" height="30" label="Select files"
click="browsebtn()" fontFamily="Arial" fontSize="12" horizontalCenter="-91" skinClass="Skin.setButtonSkin"
/>
<s:Button id="upload0" bottom="5" width="79" height="30" label="Upload" click="uploadFiles()"
fontFamily="Arial" fontSize="12" horizontalCenter="0" skinClass="Skin.setButtonSkin"/>
<s:Button id="cancel" bottom="5" width="79" height="30" label="Cancel" fontFamily="Arial" click="cancelClick()"
fontSize="12" horizontalCenter="91" skinClass="Skin.setButtonSkin"/>
</s:TitleWindow>
<s:Label id="tet" color="red" x="468" y="394" width="130"/>
<s:Label id="tet2" x="236" y="394" width="93" color="red"/>
</s:Application>
和关闭按钮的项呈现
<?xml version="1.0" encoding="utf-8"?>
<s:MXDataGridItemRenderer xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx"
focusEnabled="true">
<fx:Script>
<![CDATA[
import mx.core.FlexGlobals;
]]>
</fx:Script>
<mx:Image horizontalCenter="0" source="dialog-close.png"
verticalCenter="0" click="FlexGlobals.topLevelApplication.removeItem();"/>
</s:MXDataGridItemRenderer>
答案 0 :(得分:0)
尝试下面的代码: - 我已经删除了一些皮肤和渲染器,因为它显示错误,请在下面找到修改后的代码,我已经更改了一些逻辑,使它有点工作: -
<?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" minWidth="955" minHeight="600" creationComplete="init()" xmlns:aaronhardy="aaronhardy.*">
<fx:Declarations>
<!-- Place non-visual elements (e.g., services, value objects) here -->
</fx:Declarations>
<fx:Style>
@namespace s "library://ns.adobe.com/flex/spark";
@namespace mx "library://ns.adobe.com/flex/mx";
global
{
font-weight: bold;
}
</fx:Style>
<fx:Script>
<![CDATA[
import flash.sampler.NewObjectSample;
import flash.utils.flash_proxy;
import flash.utils.setTimeout;
import mx.charts.renderers.AreaRenderer;
import mx.collections.ArrayCollection;
import mx.controls.Alert;
import mx.events.Request;
import mx.geom.RoundedRectangle;
import mx.utils.OnDemandEventDispatcher;
private var refAddFiles:FileReferenceList=new FileReferenceList;
private var fileReference:FileReference=new FileReference;
private var serverSideUrl:String="http://demo.enfintech.net/MultipleFileUpload/fileUploader/uploadFile.php";
// private var serverSideUrl:String="http://192.168.1.60/fileUploader/uploadFile.php";
[Bindable]
private var list:Array=new Array();
public var urlReq:URLRequest;
private var initial:int=0;
[Bindable]
private var totalSize:Number=0;
private var isSelected:Boolean=false;
private var images:Object;
private var fileSizeArray:Array=new Array();
private var temp:Number=0;
[Bindable]
public var fileListLength:int;
public var loaded:int;
public var totalUploaded:int;
[Bindable] private var files:ArrayCollection = new ArrayCollection();
private function init():void
{
Security.loadPolicyFile("http://demo.enfintech.net/crossdomain.xml");
progressBar2.visible=false;
refAddFiles.addEventListener(Event.SELECT,fileRefSelect);
urlReq = new URLRequest(serverSideUrl);
}
private function fileRefSelect(event:Event):void
{
progressBar2.visible=false;
upload1();
isSelected=true;
}
private function uploadFiles():void
{
if(files.length==0)
{
Alert.show("Please Select file(s)");
}
else
{
gotoMultipleUpload();
}
}
public function gotoMultipleUpload():void
{
// var fileReference:FileReference;
fileReference = FileReference(list[initial]);
fileReference.addEventListener(Event.COMPLETE, uploadCompleteHandler);
fileReference.addEventListener(ProgressEvent.PROGRESS,progressBarEvent);
fileReference.addEventListener(IOErrorEvent.IO_ERROR,uploadFails);
fileReference.upload(urlReq);
}
private function uploadFails(event:IOErrorEvent):void
{
Alert.show("Error");
}
private function uploadCompleteHandler(event:Event):void
{
totalUploaded=totalUploaded+list[initial].size;
files.refresh();
if(initial<fileListLength-1)
{
initial++;
gotoMultipleUpload();
}
else
{
progressBar2.label="Upload Completed ("+(initial+1)+"/"+fileListLength+")";
Alert.show("File Uploaded Completed");
upload0.enabled=false;
cancel.enabled=false;
select.enabled=true;
}
}
private function progressBarEvent(event:ProgressEvent):void
{
files[initial].currentValue=event.bytesLoaded;
progressBar2.visible=true;
var numPerc:Number=Math.round(((event.bytesLoaded+totalUploaded)/totalSize)*100);
progressBar2.setProgress(event.bytesLoaded+totalUploaded,totalSize);
progressBar2.label="Uploading "+numPerc+"% ("+(initial+1)+"/"+fileListLength+")";
}
public function upload1():void
{
try
{
initial=0;
loaded=0;
totalUploaded=0;
list=new Array();
list=refAddFiles.fileList;
fileListLength=list.length;
fileSizeArray.push(list[0].size);
for(var i:int=0;i<fileListLength;i++)
{
totalSize+=list[i].size;
list[i].addEventListener(Event.COMPLETE, fileRefCompleted);
list[i].load();
}
}
catch(e:Error)
{
Alert.show(e.message);
}
}
public function fileRefCompleted(event:Event):void
{
loaded=loaded+1;
if(loaded==fileListLength)
addFilesToDatagrid();
}
public function addFilesToDatagrid():void
{
var temp:Number;
for(var i:int=0;i<list.length;i++)
{
images=new Object();
images["fileName"]=list[i].name;
images["size"]=list[i].size;
images["preview"]=list[i].data as ByteArray;
images["currentValue"]=0;
if(list[i].size/1024>=1)
{
temp=list[i].size/1024;
if(temp/1024>=1)
{
temp=temp/1024;
images["sizeconverted"]=String(temp.toFixed(1))+"Mb";
}
else
{
images["sizeconverted"]=String(temp.toFixed(1))+"Kb";
}
}
files.addItem(images);
}
select.enabled=false;
}
public function removeItem(event:MouseEvent):void
{
var item:int=dgMain.selectedIndex;
files.getItemAt(item)
totalSize -= files.getItemAt(item).size;
files.removeItemAt(item);
fileListLength = list.length = files.length;
}
private function cancelClick():void
{
fileReference.cancel();
progressBar2.label="FileUpload Cancelled";
upload0.enabled=true;
}
private function browsebtn():void
{
files.removeAll();
files.refresh();
var arr:Array = [];
arr.push(new FileFilter("Images", ".gif;*.jpeg;*.jpg;*.png"));
refAddFiles.browse(arr);
upload0.enabled=true;
cancel.enabled=true;
totalUploaded=0;
totalSize=0;
}
private function titleWindowClose():void
{
var item:int=dgMain.selectedIndex;
files.removeAll();
progressBar2.visible=false;
select.enabled=true;
upload0.enabled=true;
}
]]>
</fx:Script>
<s:TitleWindow x="204" y="10" width="520" height="325" id="titleWindow"
title="File Uploader" close="titleWindowClose()">
<mx:DataGrid id="dgMain" x="0" y="0" width="518" height="237" allowMultipleSelection="true"
dataProvider="{files}" fontFamily="Arial" fontSize="12" headerHeight="0"
horizontalScrollPolicy="off" variableRowHeight="true">
<mx:columns>
<mx:DataGridColumn dataField="preview" headerText="Preview" width="40" paddingLeft="5"/>
<mx:DataGridColumn dataField="fileName" headerText="Name" width="380"/>
<mx:DataGridColumn dataField="sizeconverted" headerText="Size" width="60"/>
<mx:DataGridColumn id="close" headerText="Size" width="40" itemRenderer="buttonClose"/>
</mx:columns>
</mx:DataGrid>
<mx:ProgressBar id="progressBar2" x="-1" y="237" width="518"
labelPlacement="center" mode="manual"
/>
<s:Button id="select" bottom="5" width="87" height="30" label="Select files"
click="browsebtn()" fontFamily="Arial" fontSize="12" horizontalCenter="-91"
/>
<s:Button id="upload0" bottom="5" width="79" height="30" label="Upload" click="uploadFiles()"
fontFamily="Arial" fontSize="12" horizontalCenter="0" />
<s:Button id="cancel" bottom="5" width="79" height="30" label="Cancel" fontFamily="Arial" click="cancelClick()"
fontSize="12" horizontalCenter="91" />
</s:TitleWindow>
<s:Label id="tet" color="red" x="468" y="394" width="130"/>
<s:Label id="tet2" x="236" y="394" width="93" color="red"/>
</s:Application>
buttonClose.mxml : -
<?xml version="1.0" encoding="utf-8"?>
<s:MXDataGridItemRenderer xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx"
focusEnabled="true">
<fx:Script>
<![CDATA[
import mx.core.FlexGlobals;
override public function set data(value:Object):void
{
super.data = value;
if(value.currentValue >0)
closeImage.visible = false;
}
]]>
</fx:Script>
<mx:Image id="closeImage" horizontalCenter="0" source="dialog-close.png"
verticalCenter="0" click="FlexGlobals.topLevelApplication.removeItem(event);"/>
</s:MXDataGridItemRenderer>
希望这可以帮助你...