- Drag and Drop in an Application (DragManager Class)
- Drag and Drop Between the OS and the Application (NativeDragManager)
- Drag and Drop Items into an AIR Application from the OS
- Drag Items into the dpTimeTracker Application
- Drag Items from an AIR Application to the OS
- Drag Items into the OS
- Next Steps
This chapter is from the book
This chapter is from the book
This chapter is from the book
Drag Items into the OS
If you examine the code for the dpTimeTracker application, you will see that it uses a technique similar to the one described in the previous section. Examine the ListToExcelClipboardDragDropHandler class in the net/digitalprimates/dragDrop directory. The function startDragging() is called in response to the DRAG_START event.
Listing 9.
private function startDragging(event:MouseEvent):void
{
if (!event.buttonDown)
{
return;
}
var options:NativeDragOptions = new NativeDragOptions();
options.allowCopy = true;
options.allowLink = true;
options.allowMove = false;
var clipboard:Clipboard = new Clipboard();
clipboard.setDataHandler(ClipboardFormats.HTML_FORMAT, dgToHTML );
clipboard.setDataHandler(ClipboardFormats.FILE_LIST_FORMAT, createXLS );
NativeDragManager.doDrag(_list, clipboard, dragIcon, null, options);
}
The NativeDragOptions is set to allowCopy = true, allowLink = true, and allowMove = false. Next a new clipboard is created, and two formats are added using the clipboard.setDataHandler method: ClipboardFormats.HTML_FORMAT and ClipboardFormats.FILE_LIST_FORMAT, indicating that we can provide either an HTML-based representation of our data or a file list. The setDataHandler() method defers creation of the dragged data until it is dropped successfully. This can become very important if the operation to produce this data is processor- or memory-intensive.
For ClipboardFormats.TEXT_FORMAT, the dgToHTML() function grabs the selected rows in the datagrid and returns a String formatted into an HTML table using <table>, <tr>, (table row), and <td> (table data) tags.
The ClipboardFormats.FILE_LIST_FORMAT has the function createXLS() assigned to it. This function will open a file stream and actually create a properly formatted Excel file with the word data- followed by the current date. Both dgToHTML() and createXLS() are in the same class as the startDragging() function.
Listing 10.
private function createXLS():Array {
var file:File = File.createTempDirectory().resolvePath(
"data-"+dateFormatter.format(new Date())+".xls");
var excelFile:ExcelFile = dgToExcel();
var fileStream:FileStream = new FileStream();
fileStream.open(file, FileMode.WRITE);
fileStream.writeBytes( excelFile.saveToByteArray() );
fileStream.close();
return new Array(file);
}
private function dgToExcel():ExcelFile{
var xls:ExcelFile = new ExcelFile();
var rows:Array = _list.selectedItems;
if (!rows || rows.length == 0)
{
return xls;
}
// Set up the Excel sheet and size it to the same number of rows and
// columns as our datagrid
var sheet:Sheet = new Sheet();
sheet.resize(rows.length, _list.columnCount );
// Loop over the DataGrid's dataprovider and set each cell
for(var i:uint = 0; i < sheet.rows; i++) {
var row:Object = rows[i];
for(var j:uint = 0; j < sheet.cols; j++) {
var cellData:Object = DataGridColumn(
DataGrid(_list).columns[j] ).itemToLabel( row );
sheet.setCell(i, j, cellData );
}
}
// Add the sheet to the Excel file
xls.sheets.addItem( sheet );
return xls;
}
The ClipboardFormats.FILE_LIST_FORMAT requires that the data be formatted into objects of type File and that each File be stored inside an array. That is the function of the createXLS() function. It will be called only if the drop operation occurs, as it is assigned as the data handler function for ClipboardFormats.FILE_LIST_FORMAT.
Listing 11.
private function dgToHTML():String {
var rows:Array = _list.selectedItems;
if (!rows || rows.length == 0)
{
return "";
}
var html:String = "<table>";
for (var j:int = 0; j<rows.length; j++)
{
var row:Object = rows[j];
html += "<tr>";
for (var k:int = 0; k<_list.columnCount; k++)
{
var data:Object = DataGridColumn(
DataGrid(_list).columns[k] ).itemToLabel( row );
if (data)
{
html += "<td>" + data + "</td>";
}
}
html += "</tr>";
}
html += "</table>";
return html;
}
The ClipboardFormats.HTML_FORMAT requires that the data be formatted into a String. The dgToHTML() function formats the data grid information into HTML style in a String variable. By using the HTML tags <table>, <tr>, and <td>, the data can be formatted in such a way that when dropped onto a spreadsheet application it will populate the correct rows and columns. The <tr> tags are responsible for keeping track of the current row, and the <td> tag indicates that the data be displayed in that row.