`
sjkgxf7191
  • 浏览: 256929 次
  • 性别: Icon_minigender_1
  • 来自: 上海
社区版块
存档分类
最新评论

Flex 拖拽功能实现的几个重要属性和事件

    博客分类:
  • flex
阅读更多

属性:

  • dragEnabled : Boolean:一个标志,指示是否可以将项目拖出此控件并放到其它控件上。
  • dragMoveEnabled : Boolean:一个标志,指示在拖放操作过程中是否可以移动控件中的项目,而不只是从控件中复制这些项目。
  • dropEnabled : Boolean:一个标志,指示是否可以将所拖动的项目放到此控件上。

事件:

  • dragComplete:在拖动操作完成时(将拖动的数据放到放置目标时或在没有执行放置操作的情况下结束拖放操作时)由拖动启动器(作为要拖动的数据源的组件)调度。
  • dragDrop:用户在放置目标上释放鼠标时由放置目标调度。
  • dragEnter:当用户在拖动操作过程中将鼠标移动到某个组件所处的位置时,由该组件调度。
  • dragExit:用户在组件外拖动但没有将数据放置到目标时,由组件调度。
  • dragOver:在拖动操作期间,当用户在鼠标位于组件上方的情况下移动鼠标时,由组件调度。
  • dragStart:启动拖动操作时,由拖动启动器调度。

如果一个View中有两个不同的拖拽 ,并且不能相互影响

需要判断拖拽的对象 是否是自己所需要

 

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical">
	<mx:ArrayCollection id="employees1">
		<mx:Object name="Christina Coenraets" phone="555-219-2270" email="ccoenraets@fictitious.com" active="true" />
		<mx:Object name="Joanne Wall" phone="555-219-2012" email="jwall@fictitious.com" active="true" />
		<mx:Object name="Maurice Smith" phone="555-219-2012" email="maurice@fictitious.com" active="false" />
		<mx:Object name="Mary Jones" phone="555-219-2000" email="mjones@fictitious.com" active="true" />
	</mx:ArrayCollection>
	<mx:ArrayCollection id="employees2">
		<mx:Object name="Christina Coenraets" phone="555-219-2270" type="0" />
		<mx:Object name="Joanne Wall" phone="555-219-2012" type="0" />
		<mx:Object name="Maurice Smith" phone="555-219-2012" type="0" />
		<mx:Object name="Mary Jones" phone="555-219-2000" type="0" />
	</mx:ArrayCollection>
    
    <mx:Script>
    	<![CDATA[
    		import mx.events.DragEvent;
    		
    		private function dg1DragOver(e:DragEvent):void
    		{
    			var dgRow:Object = new Object();
    			dgRow = e.dragSource.dataForFormat("items");
    			trace(dgRow);
    			if (dgRow.hasOwnProperty("email"))
    			{
    				dg1.dropEnabled = true;
    			}
    			else dg1.dropEnabled = false;
    		}
    		
    	]]>
    </mx:Script>
    
    <mx:DataGrid id="dg1" color="0x323232" width="100%" dataProvider="{employees1}"
    	dragEnabled="true" dragMoveEnabled="true"
    	dragEnter="dg1DragOver(event)">
        <mx:columns>
            <mx:DataGridColumn dataField="name" headerText="Name"/>
            <mx:DataGridColumn dataField="phone" headerText="Phone"/>
            <mx:DataGridColumn dataField="email" headerText="Email"/>
        </mx:columns>
    </mx:DataGrid>
    
    <mx:DataGrid id="dg2" color="0x323232" width="100%" dataProvider="{employees2}"
    	dragEnabled="true" dragMoveEnabled="true">
        <mx:columns>
            <mx:DataGridColumn dataField="name" headerText="Name"/>
            <mx:DataGridColumn dataField="phone" headerText="Phone"/>
        </mx:columns>
    </mx:DataGrid>
    
</mx:Application>
 
0
0
分享到:
评论

相关推荐

    支持手动拖拽缩放flex组件的组件

    拖拽缩放功能的实现通常涉及以下几个关键知识点: 1. **事件监听**:首先,组件需要监听鼠标事件,如mousedown、mousemove和mouseup,以便在用户开始拖动或缩放时触发相应的行为。 2. **坐标系统**:理解Flex中的...

    Flex拖拽

    ### Flex拖拽技术详解 #### 一、Flex拖拽概述 在Adobe Flex应用程序开发中,拖拽(Drag and Drop)是一种非常实用的功能,它允许用户将数据或对象从一个位置移动到另一个位置。这种功能在视觉应用中尤其有用,比如...

    Flex 拖拽图片代码

    本文主要解析一份关于Flex 3.0中实现图片拖拽功能的代码。通过详细分析这份代码,可以帮助读者更好地理解Flex中的拖拽机制以及如何在实际项目中应用这一功能。 #### 二、Flex与拖拽功能简介 Flex是一款用于构建高...

    flex tree 拖拽

    综上所述,实现 Flex Tree 的拖拽功能需要理解 Flex 的 DragManager 机制,掌握 Tree 控件的拖放属性和事件,以及如何处理数据模型的变化。通过精心设计和优化,可以创建出交互性强、易用性好的树形数据操作界面。在...

    Flex2开发的Web拖拽开发工具

    Flex2是Adobe公司推出的基于ActionScript 3.0的富互联网应用(Rich Internet Application, RIA)开发框架,它极大地提升了Flash Player的功能和性能,使得开发者可以构建具有复杂交互和动态UI的Web应用程序。"Flex2...

    flex特效 不错的flex样式生成器

    7. `flex-grow`、`flex-shrink` 和 `flex-basis`:这三个属性共同决定了子元素在主轴上的大小。`flex-grow`定义放大比例,`flex-shrink`定义缩小比例,`flex-basis`定义初始大小。 这个“flex特效”生成器很可能...

    Flex第一步

    由于Flex具有强大的功能和良好的用户界面表现力,在Web开发领域得到了广泛应用。 Flex的主要特性包括: - **跨平台性**:Flex编写的程序可以在不同的操作系统(如Windows、Mac OS、Linux等)上运行。 - **组件化...

    flex4做的MP3播放器

    在这个“flex4做的MP3播放器”项目中,我们可以探讨几个关键的技术点和知识点。 1. **Flex SDK与Flash Player**: Flex SDK是Adobe提供的开发工具,包含了编译Flex应用程序所需的编译器和框架。编译后的Flex应用通过...

    基于vue实现一个禅道主页拖拽效果

    在介绍如何基于Vue实现禅道主页拖拽效果时,首先需要了解几个核心知识点:Vue、vuedraggable插件、Flex布局以及组件的配置方法。 Vue是一种用于构建用户界面的渐进式JavaScript框架。它将用户界面抽象为组件,允许...

    js 漂亮的横向树,支持拖拽,编辑删除添加

    4. **事件处理**:为了实现拖拽、编辑和删除功能,你需要监听并处理用户的交互事件。例如,`mousedown`、`mousemove`和`mouseup`事件用于拖拽操作,`click`事件用于编辑和删除。这些事件的处理函数需要更新树的数据...

    flex组态软件安装配置文档

    1. 访问上述URL后,用户可以在Web页面上看到Flex组态软件的界面,通过拖放组件,设置属性,实现远程监控和控制功能。 2. Flex组态软件的Web特性使得用户可以通过任何支持Web浏览器的设备,如PC、平板电脑或智能手机...

    Flex4 自定义组件皮肤小结

    在Flex4中,自定义组件皮肤是提升应用界面美观度和用户体验的重要手段。Flex4引入了全新的皮肤架构,使得开发者可以更加灵活地控制组件的外观和交互效果。本篇文章将围绕Flex4自定义组件皮肤进行深入讲解,并结合...

    twaver for flex 开发手册

    除了上述内容之外,TWaverFlex 还提供了一些实用的功能和技巧,例如: - **自定义样式**:可以通过修改 CSS 样式表来自定义各种组件的外观。 - **性能优化**:针对大规模图形数据的应用场景,TWaverFlex 提供了...

    jQuery实现公司组织结构图

    为了实现这一目标,你需要了解以下几个关键点: 1. **HTML结构**:构建组织结构的基础是HTML元素,通常使用`&lt;ul&gt;`和`&lt;li&gt;`标签来创建层级结构。每个`&lt;li&gt;`代表一个职位,包含职位名称和其他相关信息。可以通过添加...

    opanscacle 地图基本操作

    这些功能可以通过监听地图事件和调用相应方法实现。 5. **标记与标注**:在地图上添加点、线、面标记以及文本标注,是常见需求。OpenScale提供图形对象和文本对象类,可以自定义样式和行为。 6. **地理编码与反...

    精通GUI图形界面编程

    MATLAB作为一款强大的数值计算和数据分析工具,同时也提供了强大的GUI设计功能,使得用户可以创建自定义的图形界面,从而实现更加便捷的数据可视化和用户控制。 在MATLAB中,GUI编程主要依赖于GUIDE(Graphical ...

    matlab gui经典例子

    下面我们将深入探讨几个关键的知识点: 1. **GUI组件**:MATLAB GUI包含多种组件,如按钮(Buttons)、文本框(Edit Text)、滑块(Slider)、列表框(List Box)、图像显示区(Image)、进度条(ProgressBar)等。...

Global site tag (gtag.js) - Google Analytics