拖放效果:
a) List組件有內置的拖放功能,只要設置dragEnabled="true",再在接受數據的List組件中設置dropEnabled="true"
<?xml version="1.0" encoding="utf-8"?>
<mx:Application layout="absolute"
xmlns:mx="http://www.adobe.com/2006/mxml"
width="450" height="350"
creationComplete="initApp();"
backgroundColor="#FFFFFF">
<mx:Script>
<![CDATA[
// setup 3 dataProviders, 2 empty
private function initApp():void{
words.dataProvider = ['Water', 'Agua', 'Car', 'Coche', 'House', 'Casa', 'Book', 'Libro', 'Music', 'Música', 'Sandwich', 'Bocadillo'];
english.dataProvider = [];
spanish.dataProvider = [];
}
]]>
</mx:Script>
<mx:Panel title="Sort Words By Language" layout="absolute" x="0" y="0" width="450" height="350">
<mx:Label text="Drag to the Correct Language" x="7" y="3"/>
<mx:List id="words" width="200" height="275"
allowMultipleSelection="true"
dragEnabled="true" y="25" x="7"/>
<mx:Label text="English" y="6" x="223"/>
<mx:List id="english" width="200" height="120"
dropEnabled="true" y="25" x="223"/>
<mx:Label text="Spanish" x="223" y="150"/>
<mx:List id="spanish" width="200" height="120"
dropEnabled="true" y="177" x="223"/>
</mx:Panel>
</mx:Application>
b) 其它組件的拖放支持
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" width="450" height="300"
creationComplete="initApp()" paddingLeft="0" paddingTop="0">
<mx:Script>
<![CDATA[
import mx.collections.ArrayCollection;
import mx.events.DragEvent;
import mx.managers.DragManager;
import mx.core.DragSource;
[Bindable]
public var total:Number = 0;
[Bindable]
public var cartContents:ArrayCollection;
private function initApp():void{
this.cartContents = new ArrayCollection();
}
private function dragIt(event:MouseEvent, name:String, price:Number):void {
// The currentTarget specifies the component initiating the drag.
var dragInitiator:Image = event.currentTarget as Image;
// Create a new DragSource object containing the data being dragged
var dragSource:DragSource = new DragSource();
// Add the data to the object.
dragSource.addData(name, 'name');
dragSource.addData(price, 'price');
// Create a copy of the image to use as a drag proxy.
var dragProxy:Image = new Image();
dragProxy.source = event.currentTarget.source;
// Call the DragManager doDrag() method to start the drag.
DragManager.doDrag(dragInitiator, dragSource, event, dragProxy);
}
// Called if the user drags a drag proxy onto the drop target.
private function dragEnterHandler(event:DragEvent):void {
// Get the drop target component from the event object.
var dropTarget:DataGrid=event.currentTarget as DataGrid;
// Accept the drag only if the object contains the correct data
if (event.dragSource.hasFormat('name') && event.dragSource.hasFormat('price')){
// Accept the drop.
DragManager.acceptDragDrop(dropTarget);
}
}
// Called if used drops the object over the target and the target accepts the object
private function dragDropHandler(event:DragEvent):void {
// Set the data from the dragSource to local vars.
var name:String = String(event.dragSource.dataForFormat('name')) ;
var price:Number = Number(event.dragSource.dataForFormat('price')) ;
this.cartContents.addItem({name:String(event.dragSource.dataForFormat('name')),price:Number(event.dragSource.dataForFormat('price'))});
// Add the price to the total
total += price;
}
]]>
</mx:Script>
<mx:Canvas width="100%" height="100%" backgroundColor="#FFFFFF">
<mx:Image source="yankee.jpg" mouseMove="dragIt(event, 'Yankee hat', 19.99);" x="23" y="35"/>
<mx:Label text="$ 19.99" x="53" y="215"/>
<mx:Image source="mets.jpg" mouseMove="dragIt(event, 'Met hat', 19.99);" x="23" y="135"/>
<mx:Label text="$ 19.99" x="53" y="109"/>
<mx:Label text="Shopping Cart" x="226" y="28" fontWeight="bold"/>
<mx:DataGrid id="cart" dataProvider="{cartContents}" dragEnter="dragEnterHandler(event);" dragDrop="dragDropHandler(event);" x="175" y="50" height="165">
<mx:columns>
<mx:DataGridColumn dataField="name" headerText="Name" />
<mx:DataGridColumn dataField="price" headerText="Price" />
</mx:columns>
</mx:DataGrid>
<mx:Label text="Total: $ {total}" x="215" y="222"/>
<mx:Label x="93.5" y="2" text="Drag a product into the shopping cart"/>
<mx:HRule x="5" y="20" width="390"/>
</mx:Canvas>
</mx:Application>
| |||||||||
日 | 一 | 二 | 三 | 四 | 五 | 六 | |||
---|---|---|---|---|---|---|---|---|---|
27 | 28 | 1 | 2 | 3 | 4 | 5 | |||
6 | 7 | 8 | 9 | 10 | 11 | 12 | |||
13 | 14 | 15 | 16 | 17 | 18 | 19 | |||
20 | 21 | 22 | 23 | 24 | 25 | 26 | |||
27 | 28 | 29 | 30 | 31 | 1 | 2 | |||
3 | 4 | 5 | 6 | 7 | 8 | 9 |
長春語林科技歡迎您!
常用鏈接
留言簿(6)
隨筆分類
- ajax(2)
- android(5)
- css(2)
- db2(2)
- docker(10)
- flex(22)
- hibernate(16)
- html5(9)
- java(12)
- java8(8)
- jquery(4)
- js(30)
- jsp(2)
- jstl(3)
- linux(14)
- mongodb(1)
- mui(1)
- mysql(14)
- oracle(3)
- spring(8)
- sqlserver(4)
- struts(9)
- struts2(13)
- tomcat(6)
- UML(1)
- util(50)
- vue(1)
- weblogic(1)
隨筆檔案
- 2020年4月 (1)
- 2020年3月 (1)
- 2020年2月 (2)
- 2019年10月 (2)
- 2019年9月 (1)
- 2019年7月 (1)
- 2019年4月 (1)
- 2019年1月 (1)
- 2018年12月 (2)
- 2018年8月 (1)
- 2018年6月 (3)
- 2018年5月 (9)
- 2018年3月 (9)
- 2017年12月 (1)
- 2017年10月 (1)
- 2017年7月 (1)
- 2017年6月 (1)
- 2017年5月 (1)
- 2017年3月 (3)
- 2017年2月 (2)
- 2017年1月 (1)
- 2016年12月 (1)
- 2016年11月 (1)
- 2016年9月 (1)
- 2016年4月 (3)
- 2016年3月 (2)
- 2015年8月 (5)
- 2015年3月 (1)
- 2014年8月 (1)
- 2012年11月 (1)
- 2012年5月 (2)
- 2012年4月 (5)
- 2011年12月 (1)
- 2011年10月 (3)
- 2011年9月 (2)
- 2011年8月 (10)
- 2011年7月 (3)
- 2011年6月 (4)
- 2011年5月 (2)
- 2011年4月 (3)
- 2011年3月 (12)
- 2011年1月 (2)
- 2010年12月 (1)
- 2010年9月 (2)
- 2010年8月 (4)
- 2010年6月 (1)
- 2010年4月 (1)
- 2010年3月 (1)
- 2009年11月 (1)
- 2009年9月 (2)
- 2009年8月 (1)
- 2009年7月 (2)
- 2009年6月 (1)
- 2009年5月 (3)
- 2009年4月 (8)
- 2009年3月 (5)
- 2009年2月 (4)
- 2009年1月 (2)
- 2008年12月 (10)
- 2008年11月 (2)
- 2008年9月 (10)
- 2008年8月 (12)
- 2008年7月 (12)
- 2008年6月 (3)
- 2008年5月 (53)
文章分類
文章檔案
相冊
收藏夾
搜索
最新評論

- 1.?re: js 操作文件[未登錄]
- 00
- --00
- 2.?re: s:bean.jsp
- fdfdsa
- --dfasdf
- 3.?re: hibernate 常用標識生成器
- 藝達廣告歡迎您
- --藝達廣告
- 4.?re: linux mod_jk.so 下載[未登錄]
- 3Q!
- --me
- 5.?re: weblogic參數設置[未登錄]
- 垃圾
- --xx