Flex右键和数据拖动

1.实现两个List之间数据拖动

2.实现右键菜单项,引用RightClickManager.as类.

源码为:

drag.mxml的代码

<?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()">
<s:layout>
<s:BasicLayout/>
</s:layout>
<fx:Declarations>
<!-- 将非可视元素（例如服务、值对象）放在此处 -->
</fx:Declarations>
<fx:Script>
<![CDATA[
import mx.collections.ArrayCollection;
import mx.controls.Alert;
import mx.events.FlexEvent;
import mx.controls.Menu;
import mx.events.MenuEvent;
import mx.controls.listClasses.IListItemRenderer;


/**右键菜单相关,外部引用类*/
import com.siloon.plugin.rightClick.RightClickManager;

/**左侧List初始数据*/
[Bindable]
private var array:ArrayCollection = new ArrayCollection([{id:1,city:"北京"},{id:1,city:"天津"},{id:3,city:"上海"}]);

/**右键菜单相关，图标*/
[Embed("images/menu_SX.png")]?
private var menu_SX:Class;
[Embed("images/menu_SP_add.png")]?
private var menu_SP_add:Class;
[Embed("images/menu_SP_delete.png")]?
private var menu_SP_delete:Class;
[Embed("images/menu_SP_edit.png")]?
private var menu_delete:Class;
[Embed("images/menu_view.png")]?
private var menu_view:Class;

/**右键菜单相关，文字描述*/
private static var menu_SX_String:String="刷新";
private static var menu_SP_add_String:String="添加";
private static var menu_SP_delete_String:String="删除";
private static var menu_SP_edit_String:String="修改";
private static var menu_view_String:String="查看";

protected var rightClickRegisted:Boolean = false;
private var menu:Menu;

private function init() : void
{
/**右键菜单相关*/
if (!rightClickRegisted) ??
{ ??
RightClickManager.regist();//外部引用类 ??
rightClickRegisted = true; ??
} ?

/**右键菜单相关,为leftList添加右键事件监听*/
leftList.addEventListener(RightClickManager.RIGHT_CLICK,listRightClickHandler);?
}
/**右击触发事件*/
private function listRightClickHandler(event:ContextMenuEvent):void
{
list_onRightClicked(event);?
list_removeMenu();
list_InitMenu();
}
//mx:list控件右击自动选择
private function list_onRightClicked(e:ContextMenuEvent):void?
{ ?
var rightClickItemRender:IListItemRenderer; ? ?

var rightClickIndex:int; ?

if(e.mouseTarget is IListItemRenderer)
{ ? ? ? ? ?
rightClickItemRender = IListItemRenderer(e.mouseTarget); ? ? ??
}
else if(e.mouseTarget.parent is IListItemRenderer)
{ ? ? ? ? ?
rightClickItemRender = IListItemRenderer(e.mouseTarget.parent); ? ?
} ? ?

if(rightClickItemRender != null)
{ ? ?
rightClickIndex = leftList.itemRendererToIndex(rightClickItemRender); ? ?

if(leftList.selectedIndex != rightClickIndex)
{ ? ?
leftList.selectedIndex = rightClickIndex; ??
} ??
}?
}

//删除右键菜单
private function list_removeMenu():void?
{ ?
if(menu!=null) ?
{ ?
menu.hide();
menu.removeEventListener(MenuEvent.ITEM_CLICK,list_MenuItemSelected); ?
menu=null; ?
} ?
}

//生成右键菜单
private function list_InitMenu():void
{
menu = Menu.createMenu(this,list_createMenuItems(),false);

menu.iconField="itemIcon";//右键菜单的图标
menu.labelField="label"; ?//右键菜单的名称?
menu.variableRowHeight = true; ? ??
menu.addEventListener(MenuEvent.ITEM_CLICK,list_MenuItemSelected); ?//右键菜单的事件

var point:Point = new Point(mouseX,mouseY); ?
point = localToGlobal(point); ??
menu.show(point.x,point.y); ?//显示右键菜单
}
private function list_createMenuItems():Array ?
{ ?
var menuItems:Array = new Array();
RefreshRightMenu(menuItems);//生成对应菜单项
AddRightMenu(menuItems);//生成对应菜单项
return menuItems; ?
}?
//生成刷新具体菜单项
private function RefreshRightMenu(menuItems:Array):void
{
var menuItem:Object = new Object; ?
menuItem.label = menu_SX_String; //菜单项名称
menuItem.itemIcon = this.menu_SX;//菜单项图标
menuItems.push(menuItem);
}
//生成添加具体菜单项
private function AddRightMenu(menuItems:Array):void
{
var menuItem:Object = new Object; ?
menuItem.label = menu_SP_add_String; //菜单项名称
menuItem.itemIcon = this.menu_SP_add;//菜单项图标
menuItems.push(menuItem);
}
//菜单项点击事件
private function list_MenuItemSelected(event:MenuEvent):void
{
var menuItem:Object = event.menu.selectedItem as Object;

switch(menuItem.label)
{
case menu_SX_String:
Alert.show("Refresh Menu click");
break;
case menu_SP_add_String:
Alert.show("Add Menu click");
break;
}
}
]]>
</fx:Script>
<s:Panel width="500" height="500" title="拖拽实例" x="20" y="20">
<s:HGroup>
<s:VGroup>
<mx:Label text="左列表"/>
<mx:List id="leftList" width="200" height="350" allowMultipleSelection="true" dataProvider="{array}" labelField="city"?
?dragEnabled="true" dropEnabled="true" dragMoveEnabled="true"/>
</s:VGroup>
<s:VGroup>
<mx:Label text="右列表"/>
<mx:List id="rightList" width="200" height="350" allowMultipleSelection="true" labelField="city"?
?dragEnabled="true" dropEnabled="true" dragMoveEnabled="true"/>
</s:VGroup>
</s:HGroup>
</s:Panel>
</s:Application>

RightClickManager.as代码.注意引用路径:com.siloon.plugin.rightClick

package com.siloon.plugin.rightClick
{
import flash.display.DisplayObject;
import flash.display.InteractiveObject;
import flash.events.ContextMenuEvent;
import flash.events.MouseEvent;
import flash.external.ExternalInterface;

import mx.core.Application;
import mx.core.FlexGlobals;

public class RightClickManager
{
static private var rightClickTarget:*;?
static public const RIGHT_CLICK:String = "rightClick";
static private const javascript:XML =?
<script>
<![CDATA[
/**
?*?
?* Copyright 2007
?*?
?* Paulius Uza
?* http://www.uza.lt
?*?
?* Dan Florio
?* http://www.polygeek.com
?*?
?* Project website:
?* http://code.google.com/p/custom-context-menu/
?*?
?* --
?* RightClick for Flash Player.?
?* Version 0.6.2
?*?
?*/
function(flashObjectId)
{
var RightClick = {
/**
?* ?Constructor
?*/?
init: function (flashObjectId) {
this.FlashObjectID = flashObjectId;
this.Cache = this.FlashObjectID;
if(window.addEventListener){
?window.addEventListener("mousedown",this.onGeckoMouse(),true);
} else {
document.getElementById(this.FlashObjectID).parentNode.onmouseup = function() { document.getElementById(RightClick.FlashObjectID).parentNode.releaseCapture(); }
document.oncontextmenu = function(){ if(window.event.srcElement.id == RightClick.FlashObjectID) { return false; } else { RightClick.Cache = "nan"; }}
document.getElementById(this.FlashObjectID).parentNode.onmousedown = RightClick.onIEMouse;
}
},
/**
?* GECKO / WEBKIT event overkill
?* @param {Object} eventObject
?*/
killEvents: function(eventObject) {
if(eventObject) {
if (eventObject.stopPropagation) eventObject.stopPropagation();
if (eventObject.preventDefault) eventObject.preventDefault();
if (eventObject.preventCapture) eventObject.preventCapture();
if (eventObject.preventBubble) eventObject.preventBubble();
}
},
/**
?* GECKO / WEBKIT call right click
?* @param {Object} ev
?*/
onGeckoMouse: function(ev) {
return function(ev) {
if (ev.button != 0) {
RightClick.killEvents(ev);
if(ev.target.id == RightClick.FlashObjectID && RightClick.Cache == RightClick.FlashObjectID) {
RightClick.call();
}
RightClick.Cache = ev.target.id;
}
??}
},
/**
?* IE call right click
?* @param {Object} ev
?*/
onIEMouse: function() {
if (event.button > 1) {
if(window.event.srcElement.id == RightClick.FlashObjectID && RightClick.Cache == RightClick.FlashObjectID) {
RightClick.call();?
}
document.getElementById(RightClick.FlashObjectID).parentNode.setCapture();
if(window.event.srcElement.id)
RightClick.Cache = window.event.srcElement.id;
}
},
/**
?* Main call to Flash External Interface
?*/
call: function() {
document.getElementById(this.FlashObjectID).rightClick();
}
}

RightClick.init(flashObjectId);
}
]]>
</script>;

public function RightClickManager()
{
return;
}

static public function regist() : Boolean
{
if (ExternalInterface.available)
{
ExternalInterface.call(javascript,ExternalInterface.objectID);
ExternalInterface.addCallback("rightClick",dispatchRightClickEvent);
FlexGlobals.topLevelApplication.addEventListener(MouseEvent.MOUSE_OVER,mouSEOverHandler);
}// end if
return true;
}

static private function mouSEOverHandler(event:MouseEvent) : void
{
rightClickTarget = InteractiveObject(event.target); ??
return; ??
}

static private function dispatchRightClickEvent() : void
{
var event:ContextMenuEvent;?
if (rightClickTarget != null) ??
{ ??
event = new ContextMenuEvent(RIGHT_CLICK,true,false,rightClickTarget as InteractiveObject,rightClickTarget as InteractiveObject); ??
rightClickTarget.dispatchEvent(event); ??
}// end if ??
return;?
}

}

}

文件目录

效果图:

素材: