6

ユーザーが Flex ツリー フォルダ内のアイテムを並べ替えられるようにしたいのですが、それらのアイテムをフォルダの外に移動することはできません。外部ドロップが成功するのを防ぐことはできますが、ドロップが成功しないことを (ドロップする前に) ユーザーにフィードバックしたいと思います。ドロップ アクションに関する多くの例を見つけましたが、ユーザーに正しいフィードバックを示すものはありません。

Tree のドキュメントによると、イベントDragManager.showFeedback(DragManager.NONE)中に電話できるはずですが、うまくいきません。dragOver短いサンプル プロジェクトを以下に示します。ドラッグ イベント中にドロップが成功しないことをユーザーに示す方法はありますか?

解決策を事前にありがとう!

<?xml version="1.0" encoding="utf-8"?>
<s:WindowedApplication xmlns:fx="http://ns.adobe.com/mxml/2009"
                       xmlns:s="library://ns.adobe.com/flex/spark"
                       xmlns:mx="library://ns.adobe.com/flex/mx"
                       width="354"
                       height="480">
    <fx:Script>
        <![CDATA[
            import mx.collections.ArrayCollection;
            import mx.core.IUIComponent;
            import mx.core.mx_internal;
            import mx.events.DragEvent;
            import mx.events.FlexEvent;
            import mx.managers.DragManager;

            protected function tree_dragEnterHandler(event:DragEvent):void {
                // only items can be dragged - not folders
                if (tree.selectedItem.@type == "item") {
                    DragManager.acceptDragDrop(IUIComponent(event.currentTarget));
                } else {
                    event.preventDefault();
                    DragManager.showFeedback(DragManager.NONE);
                }
            }

            protected function tree_dragOverHandler(event:DragEvent):void {
                var dropData:Object = tree.mx_internal::_dropData;
                var dragItem:XML = event.dragSource.dataForFormat("treeItems")[0];
                if (!dropData || !dropData.parent || !dragItem.parent() || dragItem.parent() != dropData.parent) {
                    trace("preventing drop");
                    DragManager.showFeedback(DragManager.NONE);
                    return;
                }
                trace("allowing drop");
                DragManager.showFeedback(DragManager.MOVE);
            }

            protected function tree_dragDropHandler(event:DragEvent):void {
            }
        ]]>
    </fx:Script>
    <fx:Declarations>
        <fx:XML id="treeData">
            <folder id="root"
                    label="root"
                    type="root">
                <folder id="folder1"
                        label="Folder 1"
                        type="folder">
                    <folder id="folder2"
                            label="Folder 2"
                            type="folder">
                        <item id="item1"
                              label="Item 1"
                              type="item"/>
                        <item id="item2"
                              label="Item 2"
                              type="item"/>
                        <item id="item3"
                              label="Item 3"
                              type="item"/>
                        <item id="item4"
                              label="Item 4"
                              type="item"/>
                        <item id="item5"
                              label="Item 5"
                              type="item"/>
                    </folder>
                </folder>
                <folder id="folder3"
                        label="Folder 3"
                        type="folder"/>
                <folder id="folder4"
                        label="Folder 4"
                        type="folder"/>
                <folder id="folder5"
                        label="Folder 5"
                        type="folder"/>
            </folder>
        </fx:XML>
    </fx:Declarations>
    <mx:Tree id="tree"
             left="29"
             right="28"
             top="28"
             bottom="27"
             dragEnabled="true"
             dropEnabled="true"
             dragMoveEnabled="true"
             dataProvider="{treeData}"
             labelField="@label"
             dragEnter="tree_dragEnterHandler(event)"
             dragOver="tree_dragOverHandler(event)"
             dragDrop="tree_dragDropHandler(event)"
             showRoot="false">
    </mx:Tree>
</s:WindowedApplication>
4

1 に答える 1