flex 从tree和List的相互拖动问题

目前遇到一个很头疼的问题,flex中有一个属性叫做“dropEnabled”,根据官方文档的介绍,
是指示被拖起来的项能否被放到该控件上的标志,那么该属性的使用方式就很明确了,但是实际使用貌似有点出入。
Flex中任何组件如group、panel等等都可以用来设置,另外需要做的一步就是在dragEnter中用DragManage来接受数据,
这样就可以把拖动的项拖进目标组件中而不出现“禁止”符号。
但是问题来了,
问题1:“dropEnabled”属性对List的作用刚好相反(指的是从Tree拖动到List中),不设置该属性时可以从Tree中拖入List中,
更加诡异的是在dragEnter的响应函数中获取该属性的值竟然是“true”;
问题2:设置Tree的“dropEnabled”属性为“true”,在多个Tree之间可以轻松拖放,但是却不能从List拖入Tree中,
即便是通过DragManage设置了接受数据也不行。
Tree作为List的子类,两者应该可以很方便的进行交互操作,但是目前遇到的问题实在令人费解。
示例代码如下,有兴趣的人可以研究一下。

<?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" width="800" height="500"
			   xmlns:list="list.*"
			   dragEnter="application1_dragEnterHandler(event)">
	<fx:Script>
		<![CDATA[
			import mx.events.DragEvent;
			import mx.core.UIComponent;
			import mx.events.CollectionEvent;
			import mx.events.DragEvent;
			import mx.events.FlexEvent;
			import mx.managers.DragManager;
			protected function application1_dragEnterHandler(event:DragEvent):void
			{
				// TODO Auto-generated method stub
				DragManager.showFeedback(DragManager.COPY);
				DragManager.acceptDragDrop(UIComponent(event.currentTarget)); 
			}
			
			protected function list1_dragEnterHandler(event:DragEvent):void
			{
				// TODO Auto-generated method stub
				DragManager.showFeedback(DragManager.COPY);
				DragManager.acceptDragDrop(UIComponent(event.currentTarget)); 
			}
			
			protected function panel1_dragEnterHandler(event:DragEvent):void
			{
				// TODO Auto-generated method stub
				DragManager.showFeedback(DragManager.COPY);
				DragManager.acceptDragDrop(UIComponent(event.currentTarget)); 
			}
			
			protected function list2_dragEnterHandler(event:DragEvent):void
			{
				// TODO Auto-generated method stub
				DragManager.showFeedback(DragManager.COPY);
				DragManager.acceptDragDrop(UIComponent(event.currentTarget)); 
			}
			
			protected function tree1_dragEnterHandler(event:DragEvent):void
			{
				// TODO Auto-generated method stub
				DragManager.showFeedback(DragManager.COPY);
				DragManager.acceptDragDrop(UIComponent(event.currentTarget)); 
			}
			
		]]>
	</fx:Script>
	<fx:Declarations>
		<!-- 将非可视元素(例如服务、值对象)放在此处 -->
	</fx:Declarations>
	
	<fx:Declarations>
		<s:ArrayList id="arr1">
			<fx:String>Orange</fx:String>
			<fx:String>Apple</fx:String>
			<fx:String>Pear</fx:String>
		</s:ArrayList>
		
		<s:ArrayList id="arr2">
			<fx:String>Banana</fx:String>
		</s:ArrayList>
		
		<s:ArrayList id="arr3">
			<fx:Object label="Orange"/>
			<fx:Object label="Apple"/>
			<fx:Object label="Pear"/>
		</s:ArrayList>
		
		<fx:XMLList id="treeData">
			<node label="Mail Box">
				<node label="Inbox">
					<node label="Marketing"/>
					<node label="Product Management"/>
					<node label="Personal"/>
				</node>
				<node label="Outbox">
					<node label="Professional"/>
					<node label="Personal"/>
				</node>
				<node label="Spam"/>
				<node label="Sent"/>
			</node>	
		</fx:XMLList>
	</fx:Declarations>
	
	<s:Panel title="Drag and Drop Samples" width="100%" height="100%" dragEnter="panel1_dragEnterHandler(event)">
		
		<s:layout>
			<s:HorizontalLayout paddingLeft="10" paddingRight="10" paddingTop="10" paddingBottom="10"/>
		</s:layout>
		<mx:Tree dropEnabled="true" dragEnabled="true" dragMoveEnabled="true" labelField="@label" dataProvider="{treeData}">
		</mx:Tree  >
		
		<mx:Tree dropEnabled="true"  dragEnter="tree1_dragEnterHandler(event)"/>
		
		<s:List allowMultipleSelection="true"  dragEnabled="true" dragMoveEnabled="true" 
							dataProvider="{arr1}" dragEnter="list2_dragEnterHandler(event)"></s:List>
		
		<s:Label text="Drag Items between lists" color="0x000000"/>
		
		<s:List allowMultipleSelection="true" dropEnabled="true"  dragEnabled="true" dragMoveEnabled="true" 
				dragEnter="list1_dragEnterHandler(event)"></s:List>
	</s:Panel>
	
</s:Application>


  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值