Native drag-drop – первый шаг на пути к десктопу

Взаимодействие с системным drag’n'drop’ом – очень важный функционал для любого десктопного приложения, задача которого работать с файлами. Пользователь настолько привык к нему, что когда обнаруживает что его любимый способ скармливания файла приложению не работает – начинает считать это приложение ущербным, бажным, недоделаным – а потому не пригодным для использования.

Системный Drag’n'Drop - это тот-же буфер обмена, с тем же способом хранения данных, и надо полагать с такой же реализацией. В нем могут храниться любые данные, и его может использовать любое приложение системы. Соответственно можно передавать в приложение таким образом любую информацию, хоть
картинку прямо из фаерфокса. При перетаскивании чего либо в air-приложение, это что-то попадает в обьект типа Clipboard, этот обьект находится внутри перехватываемого события – event.clipboard…Air вещает события drag-drop для каждого отображаемого обьекта приложения, каждый обьект может разрешить или запретить это действо по отношению к себе или к другим обьектам - таким образом это событие нужно поймать, разрешить и дальше работать с данными.

Разрешить – значит поставить правильный системный курсор и не более того. Это конечно мало важно, как впрочем и сам drag’n'drop – но не дай бог его там не будет, это будет самый вопиющий случай введения пользователя в заблуждение и вообще неуважение. Разрешать drag-drop нужно на этапе перехвата события NativeDragEvent.NATIVE_DRAG_ENTER.

DragManager.acceptDragDrop(this);

Работа с клипбордом начинается в момент перехвата события NativeDragEvent.NATIVE_DRAG_ENTER. Технически, данные в клипборде могут храниться в каком-угодно виде, но видимо разработчики смогли как-то договориться и файлы (основное, для чего используется drag-drop) – хранятся все-же в одном формате, потому список попадаемых файлов можно легко разбить в массив, например так:

var dropfiles:Array = event.clipboard.dataForFormat(event.clipboard.formats [0]) as Array;

А теперь обозначим простую задачу – создадим приложение, которое будет через Drag-drop принимать в себя файлы и выводить их список в компонент List:

<?xml version=»1.0″ encoding=»utf-8″?>
<mx:WindowedApplication
xmlns:mx=»http://www.adobe.com/2006/mxml«
layout=»absolute«
creationComplete=»init()»>

     <mx:Script>
       <![CDATA[
           import mx.collections.ArrayCollection;
          [Bindable]
          private var fileList:ArrayCollection=new ArrayCollection();         

          private function init():void
          {
             this.addEventListener(NativeDragEvent.NATIVE_DRAG_ENTER, onDragEnter);
             this.addEventListener(NativeDragEvent.NATIVE_DRAG_DROP, onDragDrop); 
          }

          private function onDragEnter(event:NativeDragEvent):void
          {
             DragManager.acceptDragDrop(this);
          }          private function onDragDrop(event:NativeDragEvent):void
         {
            var dropfiles:Array = event.clipboard.dataForFormat(event.clipboard.formats [0]) as Array;
            for each (var file:File in dropfiles)
            {
               fileList.addItem({label: file.name.toString()});
            }
         }         private function clear():void
         {
            fileList.removeAll();
         }
       ]]>
     </mx:Script>
<mx:VBox width=»100%» height=»100%«>
<mx:Button width=»100%» label=»Очистить» click=»clear()» />
<mx:List width=»100%» height=»100%» labelField=»label» dataProvider=»{fileList}» />
</mx:VBox>
</mx:WindowedApplication>

Обратите внимание на эту строчку: file.name.toString(). Она нужна для корректной конвертации в String – иногда флекс теряется в типах данных, не всегда – но в данном случае это так. Поэтому для более четкого определения типа используется такая конструкция.