OK button in a dialog popup not working in flex - actionscript-3

I am new to learning flex and I have this application which opens up a popup displays some checkbox values and the once the user clicks the OK button populates an array and then closes. But in my code, when I click the OK button nothing happens.
private function closeDialog(event : CloseEvent) : void {
PopUpManager.removePopUp(this); // close this dialog
}
private function onClickOK (event : CloseEvent) : void {
var values:ArrayCollection = new ArrayCollection();
for (i = 0; i < table.length; i++) {
var row:Array = table.getItemAt(i);
if (row["selected"]) {
var valueRow:Array = new Array();
arrayRow["colA"] = row["colA"];
values.addItem(valueRow);
}
}
page.model["choosenvalues"] = values;
closeDialog(event);
}
And here is the flex code
<mx:VBox paddingLeft="10" paddingRight="10">
<mx:HBox width="100%" height="100%">
<mx:Spacer width="2%" />
<mp:Table id="selectTable" dataProvider="{table}" title="" height="350">
<mp:columns>
<mx:AdvancedDataGridColumn dataField="selected" headerText=" " editable="true" textAlign="center" minWidth="36" width="36" paddingLeft="0" paddingRight="0">
<mx:itemRenderer>
<mx:Component>
<mx:CheckBox width="18" click="{data.selected = !data.selected}" label="" paddingLeft="0" paddingRight="0"/>
</mx:Component>
</mx:itemRenderer>
</mx:AdvancedDataGridColumn>
<mx:AdvancedDataGridColumn headerText="Column A" minWidth="240" dataField="colA"/>
</mp:columns>
</mp:Table>
</mx:HBox>
<mx:HBox width="100%">
<mx:Spacer width="85%" />
<mx:Button label="OK" click="onClickOK(null)" enabled="true"/>
<mx:Button label="Cancel" click="closeDialog(null)"/>
</mx:HBox>
</mx:VBox>

Try removing the event parameters from methods, since you don't use them. Anyway, the onclick handler should accept MouseEvent or just Event, not CloseEvent.
private function closeDialog() : void {
PopUpManager.removePopUp(this); // close this dialog
}
private function onClickOK () : void {
...
closeDialog();
}
MXML:
<mx:Button label="OK" click="onClickOK()" enabled="true"/>
<mx:Button label="Cancel" click="closeDialog()"/>
Note: parameterless event handlers are possible with MXML, since if you try it with AS, you'll get warnings.

Related

How to disable a component inside Datagrid which is rendered using inline item renderer

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">
<mx:Script>
<![CDATA[
import mx.controls.Alert;
private var myTimer:Timer;
[Bindable] public var isEnabled:Boolean = true;
public function getDetails():void {
Alert.show("Got it!!");
isEnabled = false;
myTimer = new Timer(5000, 1);
myTimer.addEventListener(TimerEvent.TIMER_COMPLETE, timerHandler);
myTimer.start();
}
public function timerHandler(event:TimerEvent):void {
isEnabled = true;
}
]]>
</mx:Script>
<mx:ArrayCollection id="myAc">
<mx:source>
<mx:Object version="1.0" telephone="9875454214" />
<mx:Object version="2.0" telephone="8794568784" />
<mx:Object version="3.0" telephone="8796454487" />
</mx:source>
</mx:ArrayCollection>
<mx:HBox>
<mx:DataGrid verticalScrollPolicy="on" focusEnabled="false" name="Version" id="Version" width="100%" height="65" dataProvider="{myAc}" >
<mx:columns >
<mx:DataGridColumn width="150" dataField="version" headerText="Version" />
<mx:DataGridColumn width="70" dataField="telephone" headerText="Telephone" />
<mx:DataGridColumn width="90" paddingLeft="20" headerText="Download">
<mx:itemRenderer>
<mx:Component>
<mx:Image height="10%" source="css/page_excel.png" click = "outerDocument.getDetails()" enabled = "{outerDocument.isEnabled}" />
</mx:Component>
</mx:itemRenderer>
</mx:DataGridColumn>
</mx:columns>
</mx:DataGrid>
</mx:HBox>
</mx:Application>
This application is programmed to disable the Image when it is clicked and Enable the same after 5 sec. But it is disabling whole Column. I want it to disable only the clicked Image.
Change your mxml
<!--<mx:Image height="10%" source="css/page_excel.png" click = "outerDocument.getDetails()" enabled = "{outerDocument.isEnabled}" />-->
<mx:Image height="10%" source="css/page_excel.png" click = "outerDocument.getDetails(event)" />
And here is the AS code.
public function getDetails(event: MouseEvent):void {
Alert.show("Got it!!");
//isEnabled = false;
event.target.enabled = false; // Disable clicked Object.
myTimer = new Timer(5000, 1);
//myTimer.addEventListener(TimerEvent.TIMER_COMPLETE, timerHandler);
myTimer.addEventListener(TimerEvent.TIMER_COMPLETE, nextfuncWithParams(timerHandler, event.target)); // Pass clicked object.
myTimer.start();
}
public function nextfuncWithParams(nextfunc: Function, params: Object): Function {
return function(event:TimerEvent): void{
nextfunc(event, params);
}
}
public function timerHandler(event: TimerEvent, MouseEventTarget: Object):void {
//isEnabled = true;
MouseEventTarget.enabled = true; // Enable passed object.
}
Working Example: http://wonderfl.net/c/Gv9k
Update
For using Image.
public function getDetails(event: MouseEvent):void {
//Alert.show("Got it!!");
//event.target.enabled = false; // event.target was Loader...
var obj: Object = event.target;
while (obj.parent)
{
if (obj is Image)
{
Image(obj).enabled = false;
break;
}
obj = obj.parent;
}
myTimer = new Timer(5000, 1);
//myTimer.addEventListener(TimerEvent.TIMER_COMPLETE, timerHandler);
myTimer.addEventListener(TimerEvent.TIMER_COMPLETE, nextfuncWithParams(timerHandler, obj));
myTimer.start();
}

How to ignore a mouse event

I have a component that is draggable. However, it cannot be dragged if the user drags while the mouse is on the text field. How can I set the Text field so the user can click-drag on that part of the interface?
<?xml version="1.0" encoding="utf-8"?>
<mx:Canvas xmlns:mx="http://www.adobe.com/2006/mxml" creationComplete="init()" width="210" height="150" styleName="noteStyle" >
<mx:Script>
<![CDATA[
public var testId:int;
public var buttonNumber:int;
public function init():void{
this.addEventListener(MouseEvent.MOUSE_DOWN, makeDraggable)
this.addEventListener(MouseEvent.MOUSE_UP, endDrag)
this.buttonMode = true;
this.useHandCursor = true;
}
public function saveButtonHandler():void{
dispatchEvent(new Event ( "noteClosed"));
}
public function cancelButtonHandler():void{
dispatchEvent(new Event ( "noteCancelled"));
}
public function makeDraggable(e:Event):void{
//If the target and the current target are the same, then it must be the background, so make it draggable.
//Stops the text field and buttons from being draggable
trace("Target= "+e.currentTarget+" "+e.target)
if(e.currentTarget==e.target){
this.startDrag();
}
}
public function endDrag(e:Event):void{
this.stopDrag();
}
]]>
</mx:Script>
<mx:Text text="Add a note: Drag to move" styleName="myriadPro14" selectable="false" />
<mx:Button id="saveButton" label="Save" x="146" y="120" click="saveButtonHandler()" />
<mx:Button id="cancelButton" label="Cancel" x="10" y="120" click="cancelButtonHandler()" />
<mx:TextArea id="noteText" width="200" height="80" horizontalCenter="0" verticalCenter="-12"/>
</mx:Canvas>
Add an event listener to the text field as well.

Export datagrid to excel

I created a datagrid and also created some text box and a submit button outside the datagrid.. if we entered some data's into the text box and then click the submit button the data's are stored into the datagrid.. i want to export these data from the data grid is export into excel.How it possiple?How can i create a excel sheet and how it connect with my datagrid?
My code is given below
<?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="application1_creationCompleteHandler(event)">
<fx:Declarations>
<!-- Place non-visual elements (e.g., services, value objects) here -->
</fx:Declarations>
<fx:Script>
<![CDATA[
import com.as3xls.xls.Sheet;
import mx.collections.ArrayCollection;
import mx.controls.Alert;
import mx.effects.easing.Exponential;
import mx.events.FlexEvent;
[Bindable]
public var dgItems_client:ArrayCollection = new ArrayCollection();
public var dgItems_admin:ArrayCollection = new ArrayCollection();
public var temp_client:Object = new Object();
public var temp_admin:Object = new Object();
private var fileRef:FileReference=new FileReference;
private var sheet:Sheet;
// public var imagegrid:Image;
private function tabChange():void
{
errorAdmin.visible=false;
errorClient.visible=false;
if(gh.selectedChild.name=='clientTab')
{
details.dataProvider=dgItems_client;
arrayName.headerText="Client_Name";
}
else
{
details.dataProvider=dgItems_admin;
arrayName.headerText="Admin_Name";
}
}
private function submitClick():void
{
if(name_client.text!="" && address_client.text!="" && phone_client.text!="")
{
temp_client = ({Name:name_client.text, Address:address_client.text,Phone_Number:phone_client.text});
dgItems_client.addItem(temp_client);
name_client.text="";
address_client.text="";
phone_client.text="";
clientClick();
errorClient.visible=false;
}
else
{
errorClient.visible=true;
}
if(name_admin.text!=""&&address_admin.text!=""&&phone_admin.text!="")
{
temp_admin = ({Name:name_admin.text, Address:address_admin.text,Phone_Number:phone_admin.text});
dgItems_admin.addItem(temp_admin);
name_admin.text="";
address_admin.text="";
phone_admin.text="";
errorAdmin.visible=false;
}
else
{
errorAdmin.visible=true;
}
}
private function clientClick():void
{
details.dataProvider=dgItems_client;
arrayName.headerText="Client_Name";
}
private function adminClick():void
{
details.dataProvider=dgItems_admin;
arrayName.headerText="Admin_Name";
}
protected function application1_creationCompleteHandler(event:FlexEvent):void
{
fileRef.addEventListener(Event.SELECT,fileSelected);
}
private function fileSelected():void
{
}
private function executeExport():void
{
sheet=new Sheet;
// var dataProviderCollection:ArrayCollection;
var rowCount:int=details.columnsLength;
Alert.show(rowCount.toString());
}
]]>
</fx:Script>
<mx:TabNavigator x="27" y="11" width="455" height="376" id="gh" change="tabChange()" backgroundColor="#A4B6E9">
<s:NavigatorContent width="100%" height="100%" label="Client" id="clientTab">
<s:Label x="10" y="30" width="52" height="25" text="Name:"/>
<s:Label x="10" y="127" width="52" height="28" text="Address:"/>
<s:TextInput id="name_client" x="69" y="18" width="188" height="37" restrict="a-zA-Z"/>
<s:TextArea id="address_client" x="70" y="70" height="126"/>
<s:Label x="10" y="230" width="84" height="32" text="Phone:"/>
<s:TextInput id="phone_client" x="70" y="218" width="188" height="30" restrict="0-9" maxChars="10"/>
<s:Button x="100" y="291" height="28" label="Submit" click="submitClick()"/>
<s:Label id="errorClient" x="59" y="270" width="171" height="27" text="please fill the blank fields" color="red" visible="false"/>
</s:NavigatorContent>
<s:NavigatorContent width="100%" height="100%" label="Admin" id="adminTab" >
<s:Label x="23" y="48" width="52" height="25" text="Name:"/>
<s:Label x="26" y="148" width="52" height="28" text="Address:"/>
<s:TextInput id="name_admin" x="105" y="33" width="188" height="37"/>
<s:TextArea id="address_admin" x="105" y="93" height="126"/>
<s:Label x="26" y="257" width="84" height="32" text="Phone:"/>
<s:TextInput id="phone_admin" x="104" y="246" width="188" height="30" restrict="0-9" maxChars="10"/>
<s:Button x="137" y="305" height="28" label="Submit" click="submitClick()"/>
<s:Label id="errorAdmin" x="100" y="286" width="171" height="17" color="red" fontSize="14"
text="please fill the blank fields" visible="false"/>
<s:Button x="335" y="60" height="34" label="Admin Details" click="adminClick()"/>
<s:Button x="335" y="180" height="34" label="Client Details" click="clientClick()"/>
</s:NavigatorContent>
</mx:TabNavigator>
<s:TitleWindow x="521" y="84" width="377" height="234">
<s:DataGrid x="0" y="0" width="375" height="163" borderVisible="true" id="details">
<s:columns>
<s:ArrayList>
<s:GridColumn dataField="Name" id="arrayName"></s:GridColumn>
<s:GridColumn dataField="Address" headerText="Address"></s:GridColumn>
<s:GridColumn dataField="Phone_Number" headerText="Phone_Number"></s:GridColumn>
</s:ArrayList>
</s:columns>
</s:DataGrid>
<s:Button x="139" y="167" height="28" label="Export" click="executeExport()"/>
</s:TitleWindow>
</s:Application>
ok...
You can try below code: -
<?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"
>
<fx:Declarations>
<!-- Place non-visual elements (e.g., services, value objects) here -->
</fx:Declarations>
<fx:Script>
<![CDATA[
import com.as3xls.xls.Sheet;
import mx.collections.ArrayCollection;
import mx.controls.Alert;
import mx.effects.easing.Exponential;
import mx.events.FlexEvent;
[Bindable]
public var dgItems_client:ArrayCollection = new ArrayCollection();
public var dgItems_admin:ArrayCollection = new ArrayCollection();
public var temp_client:Object = new Object();
public var temp_admin:Object = new Object();
private function tabChange():void
{
errorAdmin.visible=false;
errorClient.visible=false;
if(gh.selectedChild.name=='clientTab')
{
details.dataProvider=dgItems_client;
arrayName.headerText="Client_Name";
}
else
{
details.dataProvider=dgItems_admin;
arrayName.headerText="Admin_Name";
}
}
private function submitClick():void
{
if(gh.selectedIndex == 0)
{
if(name_client.text!="" && address_client.text!="" && phone_client.text!="")
{
temp_client = ({Name:name_client.text, Address:address_client.text,Phone_Number:phone_client.text});
dgItems_client.addItem(temp_client);
name_client.text="";
address_client.text="";
phone_client.text="";
clientClick();
errorClient.visible=false;
}
else
{
errorClient.visible=true;
}
}else
{
if(name_admin.text!="" && address_admin.text!="" && phone_admin.text!="")
{
temp_admin = ({Name:name_admin.text, Address:address_admin.text,Phone_Number:phone_admin.text});
dgItems_admin.addItem(temp_admin);
name_admin.text="";
address_admin.text="";
phone_admin.text="";
errorAdmin.visible=false;
}
else
{
errorAdmin.visible=true;
}
}
}
private function clientClick():void
{
details.dataProvider=dgItems_client;
arrayName.headerText="Client_Name";
}
private function adminClick():void
{
details.dataProvider=dgItems_admin;
arrayName.headerText="Admin_Name";
}
private function executeExport():void
{
ExcelExporterUtil.dataGridExporter(this.details, "prueba_excel.xls");
}
]]>
</fx:Script>
<mx:TabNavigator x="27" y="11" width="455" height="376" id="gh" change="tabChange()" backgroundColor="#A4B6E9">
<s:NavigatorContent width="100%" height="100%" label="Client" id="clientTab">
<s:Label x="10" y="30" width="52" height="25" text="Name:"/>
<s:Label x="10" y="127" width="52" height="28" text="Address:"/>
<s:TextInput id="name_client" x="69" y="18" width="188" height="37" restrict="a-zA-Z"/>
<s:TextArea id="address_client" x="70" y="70" height="126"/>
<s:Label x="10" y="230" width="84" height="32" text="Phone:"/>
<s:TextInput id="phone_client" x="70" y="218" width="188" height="30" restrict="0-9" maxChars="10"/>
<s:Button x="100" y="291" height="28" label="Submit" click="submitClick()"/>
<s:Label id="errorClient" x="59" y="270" width="171" height="27" text="please fill the blank fields" color="red" visible="false"/>
</s:NavigatorContent>
<s:NavigatorContent width="100%" height="100%" label="Admin" id="adminTab" >
<s:Label x="23" y="48" width="52" height="25" text="Name:"/>
<s:Label x="26" y="148" width="52" height="28" text="Address:"/>
<s:TextInput id="name_admin" x="105" y="33" width="188" height="37"/>
<s:TextArea id="address_admin" x="105" y="93" height="126"/>
<s:Label x="26" y="257" width="84" height="32" text="Phone:"/>
<s:TextInput id="phone_admin" x="104" y="246" width="188" height="30" restrict="0-9" maxChars="10"/>
<s:Button x="137" y="305" height="28" label="Submit" click="submitClick()"/>
<s:Label id="errorAdmin" x="100" y="286" width="171" height="17" color="red" fontSize="14"
text="please fill the blank fields" visible="false"/>
<s:Button x="335" y="60" height="34" label="Admin Details" click="adminClick()"/>
<s:Button x="335" y="180" height="34" label="Client Details" click="clientClick()"/>
</s:NavigatorContent>
</mx:TabNavigator>
<s:TitleWindow x="521" y="84" width="377" height="234">
<mx:DataGrid x="0" y="0" width="375" height="163" borderVisible="true" id="details">
<mx:columns>
<mx:DataGridColumn dataField="Name" id="arrayName"></mx:DataGridColumn>
<mx:DataGridColumn dataField="Address" headerText="Address"></mx:DataGridColumn>
<mx:DataGridColumn dataField="Phone_Number" headerText="Phone_Number"></mx:DataGridColumn>
</mx:columns>
</mx:DataGrid>
<s:Button x="139" y="167" height="28" label="Export" click="executeExport()"/>
</s:TitleWindow>
</s:Application>
ExcelExporterUtil.as
package
{
import com.as3xls.xls.ExcelFile;
import com.as3xls.xls.Sheet;
import flash.errors.IllegalOperationError;
import flash.net.FileReference;
import flash.utils.ByteArray;
import mx.collections.ArrayCollection;
import mx.collections.ICollectionView;
import mx.collections.IViewCursor;
import mx.collections.XMLListCollection;
import mx.controls.DataGrid;
public class ExcelExporterUtil
{
public function ExcelExporterUtil()
{
throw new IllegalOperationError("Class \"ExcelExporterUtil\" is static. You can't instance this");
}
static public function dataGridExporter(dg:DataGrid, defaultName:String):void
{
if (dg == null || dg.dataProvider == null || defaultName == null || defaultName == "")
return;
var cols:Number = 0;
var colsValues:Array = [];
var cantCols:Number = dg.columnCount;
var fieldT:String;
var headerT:String;
// armo el listado de headers y variables para cada columna
for ( ; cols < cantCols; cols++)
{
headerT = (dg.columns[cols] as Object).headerText
fieldT = (dg.columns[cols] as Object).dataField;
if ( fieldT == null || fieldT == "" || headerT == null || headerT == "")
continue;
colsValues.push({
header:headerT,
value:fieldT
});
}
if ( colsValues.length == 0 )
return;
ExcelExporterUtil.export(dg.dataProvider, colsValues, defaultName);
}
static public function chartExporter(chart:ByteArray, defautlName:String):void
{
if(chart)
{
var sheet:Sheet = new Sheet();
sheet.resize(1, 1);
sheet.setCell(0, 0, "Chart Data");
sheet.setCell(0,0,chart);
var xls:ExcelFile = new ExcelFile();
xls.sheets.addItem(sheet);
var bytes:ByteArray = xls.saveToByteArray();
var fr:FileReference = new FileReference();
fr.save(bytes, defautlName);
}
}
static public function export(obj:Object, colsValues:Array, defautlName:String):void
{
var _dp:ICollectionView = ExcelExporterUtil.getDataProviderCollection(obj);
if ( _dp == null )
return;
var rows:Number = 0;
var cols:Number = 0;
var cantCols:Number = colsValues.length;
var sheet:Sheet = new Sheet();
sheet.resize(_dp.length, colsValues.length);
for ( ; cols < cantCols; cols++)
{
sheet.setCell(rows, cols, colsValues[cols].header);
}
cols = 0;
rows++;
var cursor:IViewCursor = _dp.createCursor();
while ( !cursor.afterLast )
{
for (cols = 0 ; cols < cantCols; cols++)
{
if ( (cursor.current as Object).hasOwnProperty(colsValues[cols].value) )
sheet.setCell(rows, cols, (cursor.current as Object));
}
rows++;
cursor.moveNext();
}
var xls:ExcelFile = new ExcelFile();
xls.sheets.addItem(sheet);
var bytes:ByteArray = xls.saveToByteArray();
var fr:FileReference = new FileReference();
fr.save(bytes, defautlName);
}
static private function getDataProviderCollection(obj:Object):ICollectionView
{
if ( (obj is Number && isNaN(obj as Number)) || (!(obj is Number) && obj == null))
{
return null;
}
else if ( obj is ICollectionView )
{
return obj as ICollectionView;
}
else if ( obj is Array )
{
return new ArrayCollection(obj as Array);
}
else if ( obj is XMLList )
{
return new XMLListCollection(obj as XMLList);
}
else if ( obj is XML )
{
var col:XMLListCollection = new XMLListCollection();
col.addItem(obj);
return col;
}
else if ( obj is Object )
{
return new ArrayCollection([obj]);
}
else
{
return null;
}
}
}
}
Hope may help you....
Note: - i am using ExcelExporterUtil.as from one of the post.. not created by me..
Or Other way, can refer below post: -
http://cookbooks.adobe.com/post_Import_Export_data_in_out_of_a_Datagrid_in_Flex-17223.html

mx:TileList : Why drag doesn't works if allowMultipleSelection is activate

I work with TileList to display image like a gallery.
At start, I activate only drag option.
<mx:TileList xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx"
columnWidth="120"
rowHeight="150"
paddingLeft="2"
paddingRight="2"
paddingTop="2"
paddingBottom="2"
itemRenderer="fr.ui.display._43Imagerie.TileUnit2"
doubleClickEnabled="true"
dragEnabled="true"
dropEnabled="true"
dragMoveEnabled="true"
verticalScrollPolicy="on"
>
Now I try to add multiple selection possibility.
ItemRenderer is :
<mx:Canvas xmlns:mx="http://www.adobe.com/2006/mxml"
verticalScrollPolicy="off"
horizontalScrollPolicy="off"
width="120"
height="150"
borderVisible="false"
xmlns:s="library://ns.adobe.com/flex/spark"
creationComplete="onEvent()"
>
<mx:Script>
<![CDATA[
import fr.util.imageTransform;
import mx.controls.Image;
import mx.core.UIComponent;
import mx.events.DragEvent;
import mx.managers.DragManager;
import org.osmf.utils.URL;
import spark.effects.Rotate;
[Bindable]
[Embed(source="icon/imagerie/rotate.png")]
private var rotationArrowClass:Class;
private var _file:File;
private var _selected:Boolean;
private var _sauvBMD:BitmapData;
public var wasScaled:Boolean = false;
public var deleted:Boolean = false;
private var bgCenterX:Number;
private var bgCenterY:Number;
private var _dragDownPt:Point;
[Bindable]
public var angle:int = 0;
private var dragBitmapData : BitmapData;
private function onEvent():void
{
// iconCanvas.addEventListener(MouseEvent.DOUBLE_CLICK, onDoubleClick);
// double click gere ds wPlanchePhoto3
}
private function rotationImage(e:MouseEvent):void
{
var rot:Rotate = new Rotate();
rot.angleBy = 90;
rot.duration = 1000;
rot.autoCenterTransform = true;
rot.target = iconCanvas;
rot.play();
}
private function radiansToDegrees(radians:Number):Number {
var degrees:Number = radians * (180 / Math.PI);
return degrees;
}
private function degreesToRadians(degrees:Number):Number {
var radians:Number = degrees * (Math.PI / 180);
return radians;
}
public function set image(im:BitmapData):void
{
this._sauvBMD=im;
}
public function get image() :BitmapData
{
return this._sauvBMD;
}
protected function iconCanvas_mouseDownHandler(event:MouseEvent):void
{
// on enregistre la point de départ
_dragDownPt = new Point(mouseX,mouseY);
// puis on écoute l'éventuel déplacement de la souris
this.addEventListener(MouseEvent.MOUSE_MOVE,_onMouseMoveDuringDrag);
}
private function _onMouseMoveDuringDrag(evt:MouseEvent):void {
// astuce pour s'assurer que la souris a vraiment bougee volontairement
if(Math.abs(_dragDownPt.x - mouseX) <= 2 && Math.abs(_dragDownPt.y - mouseY) <= 2)
return;
else{
dragBitmapData = new BitmapData(iconCanvas.width, iconCanvas.height,true, 1);
dragBitmapData.draw(iconCanvas);
var transfert:Clipboard = new Clipboard();
transfert.setData(ClipboardFormats.BITMAP_FORMAT,Bitmap(iconCanvas.content).bitmapData);
// only allow the file to be copied
var dragOptions:NativeDragOptions = new NativeDragOptions();
dragOptions.allowMove=false;
dragOptions.allowCopy = true;
dragOptions.allowLink = false;
// begin the drag
NativeDragManager.doDrag(this, transfert, dragBitmapData, null, dragOptions);
}
// dispatch de l'event depuis le parent pour pouvoir écouter cet event dans l'application
}
]]>
</mx:Script>
<s:BorderContainer
id="bcImage"
width="120"
height="99%"
borderVisible="true"
borderColor="#FFFFFF"
borderWeight="1"
cornerRadius="6"
backgroundAlpha=".4"
backgroundColor="#5f5f5f"
>
<mx:Canvas id="cvsImage" width="100%">
<mx:SWFLoader id="rotationArrow" source="{rotationArrowClass}" height="18" width="18" x="3" y="3" visible="true" click="rotationImage(event);" alpha=".5"/>
<s:Label x="23" y="3" width="82" fontSize="11" fontWeight="normal" text="{data.imDate}"
textAlign="right" color="#000000"/>
<mx:Image id="iconCanvas" x="10" y="20" width="99" height="99" horizontalAlign="center"
maintainAspectRatio="true" scaleContent="true"
source="{data.imURL}"
verticalAlign="middle" mouseDown="iconCanvas_mouseDownHandler(event)"
>
</mx:Image>
</mx:Canvas>
<s:VGroup width="100%" y="124" height="25" bottom="1" left="3" right="3" paddingBottom="0" paddingTop="4" gap="0">
<s:Label text="{data.imType}" height="50%" fontSize="10" paddingBottom="1"
fontWeight="normal" width="99%" textAlign="center" color="#000000"/>
<s:Label text="{data.imStade}" fontSize="10" textAlign="center" paddingTop="1"
fontWeight="normal" width="99%" color="#000000"/>
</s:VGroup>
</s:BorderContainer>
If this option is true (allowMultipleSelection), drag stop to work, do you know why?
Thanks for helping.
Adding allowMultipleSelection="true" worked just fine for me. I am running on a Mac with latest version of Flash Player. It seemed a bit flaky at first but after refreshing the page it worked just fine. Only thing I didn't have in my project was your data provider and item renderer. I really doubt your item renderer would cause an issue unless you are doing something crazy in there. Check to see if you have the latest Flash Player.

Show snapshots from camera Flex

I created a flex application that snapshot a picture of the webcam. Im trying now to save every snapshop and display it directly when the image has been capture. But I cant seems to understand how to.
I want the images to be display in the Thumbnail box.
Any help ? or any sites I can found some help on ?
This is what I have for the moment
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical" verticalAlign="top"
horizontalAlign="center" paddingTop="0" viewSourceURL="srcview/index.html">
<mx:Script>
<![CDATA[
import mx.controls.Alert;
import mx.core.UIComponent;
private function videoDisplay_creationComplete() : void
{
var camera:Camera = Camera.getCamera();
if (camera)
{
videoDisplay.attachCamera(camera);
}
else
{
Alert.show("Oops, we can't find your camera.");
}
}
private function capture_click() : void
{
var snap:BitmapData = new BitmapData(320, 240, true);
var snapBmp:Bitmap = new Bitmap(snap);
snapBmp.width = 320;
snapBmp.height = 240;
if(snapshotHolder.numChildren > 0)
snapshotHolder.removeChildAt(0);
snapshotHolder.addChild(snapBmp);
snap.draw(videoDisplay);
}
]]>
</mx:Script>
<mx:HBox>
<mx:Panel title="Video">
<mx:VideoDisplay id="videoDisplay" creationComplete="videoDisplay_creationComplete();" width="320" height="240" />
</mx:Panel>
<mx:Panel title="Snapshot">
<mx:UIComponent id="snapshotHolder" width="320" height="240" />
</mx:Panel>
</mx:HBox>
<mx:HBox>
<mx:Button label="reload camera" click="videoDisplay_creationComplete();"/>
<mx:Button label="capture" click="capture_click();"/>
</mx:HBox>
<mx:HBox>
<mx:Panel title="Thumbnails">
<mx:UIComponent id="snapshotHolderTN" width="128" height="96" />
</mx:Panel>
</mx:HBox>
</mx:Application>
Pls try with this when u click for image snaps.
var bmp:BitmapData = new BitmapData(videodisplay.width,videodisplay.height);
bmp.draw(drawArea);
var jpgEncode:JPEGEncoder = new JPEGEncoder(50);
var imageByte:ByteArray = jpgEncode.encode(bmp);
var fileRef:FileReference = new FileReference;
fileRef.save(imageByte);