| <?xml version="1.0"?> |
| <!-- |
| Licensed to the Apache Software Foundation (ASF) under one or more |
| contributor license agreements. See the NOTICE file distributed with |
| this work for additional information regarding copyright ownership. |
| The ASF licenses this file to You under the Apache License, Version 2.0 |
| (the "License"); you may not use this file except in compliance with |
| the License. You may obtain a copy of the License at |
| |
| http://www.apache.org/licenses/LICENSE-2.0 |
| |
| Unless required by applicable law or agreed to in writing, software |
| distributed under the License is distributed on an "AS IS" BASIS, |
| WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. |
| See the License for the specific language governing permissions and |
| limitations under the License. |
| --> |
| |
| <mx:Module xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:mx="library://ns.adobe.com/flex/mx" |
| paddingBottom="0" paddingTop="0" paddingLeft="0" paddingRight="0" |
| height="100%" width="100%"> |
| |
| <fx:Script> |
| <![CDATA[ |
| import mx.effects.easing.Elastic; |
| import mx.collections.ArrayCollection; |
| |
| [Bindable] |
| private var myDP:ArrayCollection = new ArrayCollection( |
| ['A','B','C','D','E','F','G','H','I','J','K','L','M','N','O','P']); |
| |
| private function deleteItem():void { |
| // As each item is removed, the index of the other items changes. |
| // So first get the items to delete, then determine their indices |
| // as you remove them. |
| var toRemove:Array = []; |
| for (var i:int = 0; i < tlist0.selectedItems.length; i++) |
| toRemove.push(tlist0.selectedItems[i]); |
| for (i = 0; i < toRemove.length; i++) |
| myDP.removeItemAt(myDP.getItemIndex(toRemove[i])); |
| } |
| |
| private var zcount:int = 0; |
| private function addItem():void { |
| // Always add the new item after the third item, |
| // or after the last item if the length is less than 3. |
| myDP.addItemAt("Z"+zcount++,Math.min(3,myDP.length)); |
| } |
| ]]> |
| </fx:Script> |
| |
| <fx:Declarations> |
| <!-- Define a custom data effect as a Sequence effect. --> |
| <mx:Sequence id="itemsChangeEffect1"> |
| <mx:Blur |
| blurYTo="12" blurXTo="12" |
| duration="300" |
| perElementOffset="150" |
| filter="removeItem"/> |
| <mx:Parallel> |
| <mx:Move |
| duration="750" |
| easingFunction="{Elastic.easeOut}" |
| perElementOffset="20"/> |
| <mx:RemoveItemAction |
| startDelay="400" |
| filter="removeItem"/> |
| <mx:AddItemAction |
| startDelay="400" |
| filter="addItem"/> |
| <mx:Blur |
| startDelay="410" |
| blurXFrom="18" blurYFrom="18" blurXTo="0" blurYTo="0" |
| duration="300" |
| filter="addItem"/> |
| </mx:Parallel> |
| </mx:Sequence> |
| </fx:Declarations> |
| |
| <mx:Panel title="AddItemEffect/RemoveItemEffect Example" |
| paddingBottom="10" paddingTop="10" paddingLeft="10" paddingRight="10" |
| height="100%" width="100%"> |
| |
| <!-- This TileList uses a custom data change effect --> |
| <mx:TileList id="tlist0" |
| height="100%" width="100%" |
| fontSize="18" fontWeight="bold" |
| columnCount="4" rowCount="4" |
| direction="horizontal" |
| dataProvider="{myDP}" |
| allowMultipleSelection="true" |
| offscreenExtraRowsOrColumns="4" |
| itemsChangeEffect="{itemsChangeEffect1}"/> |
| |
| <mx:Button |
| label="Delete selected item(s)" |
| click="deleteItem()"/> |
| <mx:Button |
| label="Add item" |
| click="addItem()"/> |
| |
| </mx:Panel> |
| </mx:Module> |