11 Replies Latest reply on Dec 17, 2008 10:46 AM by Newsgroup_User

    Explain This Code for ItemChangeEffect Please

    manofspirit Level 1
      Hello All
      itemChangeEffect was so easy to implement in Flex 2, But in 3 It is not dt easy.

      A very good programmer wrote an example for implementing it in Flex 3
      http://astrois.info/Article_ItemsChangeEffect/

      Please see the Application Source
      I couldnt understand its reconstructCopyColl()
      Please Explain it


      2ndly
      I want to use this method in my image gallery
      And i need your help to add this itemChangeEffect method in it

      I have an ArrayCollection which holds data of my images.
      I use filter function to display images according to my category.

      So please guide me, how can i do the above thing for my tilelist?


      Thanks in advance
        • 1. Re: Explain This Code for ItemChangeEffect Please
          Level 7

          "manofspirit" <webforumsuser@macromedia.com> wrote in message
          news:gi5krt$hue$1@forums.macromedia.com...
          > Hello All
          > itemChangeEffect was so easy to implement in Flex 2, But in 3 It is not dt
          > easy.
          >
          > A very good programmer wrote an example for implementing it in Flex 3
          > http://astrois.info/Article_ItemsChangeEffect/
          >
          > Please see the Application Source
          > I couldnt understand its reconstructCopyColl()
          > Please Explain it
          >
          >
          > 2ndly
          > I want to use this method in my image gallery
          > And i need your help to add this itemChangeEffect method in it
          >
          > I have an ArrayCollection which holds data of my images.
          > I use filter function to display images according to my category.
          >
          > So please guide me, how can i do the above thing for my tilelist?
          >
          >
          > Thanks in advance

          Are you talking about a dataChange effect?


          • 2. Re: Explain This Code for ItemChangeEffect Please
            manofspirit Level 1
            Actually, That given example is open source.
            Please see Its source Code and you will find a function named
            "reconstructCopyColl()"

            i couldnt understand its code! how does it work.
            Please see and explain so i will be able to implement it in my own gallery.
            • 3. Re: Explain This Code for ItemChangeEffect Please
              Level 7

              "manofspirit" <webforumsuser@macromedia.com> wrote in message
              news:gi7mrf$8k3$1@forums.macromedia.com...
              > Actually, That given example is open source.
              > Please see Its source Code and you will find a function named
              > "reconstructCopyColl()"
              >
              > i couldnt understand its code! how does it work.
              > Please see and explain so i will be able to implement it in my own
              > gallery.

              It loops through two collections. If the label of the first collection item
              is less than the label of the second collection item, then it deletes the
              item from the first collection. If the label of the item in the first
              collection is greater than the label of the item of the second collection,
              it adds the item from from the second collection into the first collection
              at the index where the loop is. If they are equal, it does nothing.

              If the second collection is longer than the first collection is at this
              point, we continue looping and copy the remaining items from collection 2
              into collection 1.

              If the first collection is now longer than the second collection, snip off
              any extra items at the end.

              That's really scary code...I can see a lot of points where it is likely to
              result in strange results. Also, it has nothing to do with a dataChange
              effect. Take from it the part that you were looking for, and leave the rest
              of the code on the floor ;-).

              If you're interested in duplicating what that code is supposed to do, look
              at ListCollectionView and filterFunctions.

              HTH;

              Amy


              • 4. Re: Explain This Code for ItemChangeEffect Please
                manofspirit Level 1
                Thanks for the reply Amy


                Actually Im using a Tilelist which takes data dynamically. I have also added a function which works good.
                Problem is, ItemChangeEffect doesnt work when i do Filter the ArrayCollection.
                It was previously possible in Flex2 using dataChangeEffect.
                But in Flex 3, I couldnt make it work


                Any guidance in this regard? how can i use itemChangeEffect with FilterFunction? (as i also dont want to use this scary code)

                Thanks
                • 5. Re: Explain This Code for ItemChangeEffect Please
                  manofspirit Level 1
                  Thanks for the reply Amy


                  Actually Im using a Tilelist which takes data dynamically. I have also added a function which works good.
                  Problem is, ItemChangeEffect doesnt work when i do Filter the ArrayCollection.
                  It was previously possible in Flex2 using dataChangeEffect.
                  But in Flex 3, I couldnt make it work


                  Any guidance in this regard? how can i use itemChangeEffect with FilterFunction? (as i also dont want to use this scary code)

                  Thanks
                  • 6. Re: Explain This Code for ItemChangeEffect Please
                    Level 7

                    "manofspirit" <webforumsuser@macromedia.com> wrote in message
                    news:gi8h0d$bs1$1@forums.macromedia.com...
                    > Thanks for the reply Amy
                    >
                    >
                    > Actually Im using a Tilelist which takes data dynamically. I have also
                    > added a
                    > function which works good.
                    > Problem is, ItemChangeEffect doesnt work when i do Filter the
                    > ArrayCollection.
                    > It was previously possible in Flex2 using dataChangeEffect.
                    > But in Flex 3, I couldnt make it work
                    >
                    >
                    > Any guidance in this regard? how can i use itemChangeEffect with
                    > FilterFunction? (as i also dont want to use this scary code)

                    I'm not sure what the difference is. If I get time to look at it, I'll see
                    what I can do. Do you have an Application built that I could play with
                    without having to start from scratch?

                    -Amy


                    • 7. Re: Explain This Code for ItemChangeEffect Please
                      manofspirit Level 1
                      I took a Filter Function example from blog.flexexamples
                      and i added itemChangeEffect in it.
                      Now you can see that, when we filter items, it doesnt work

                      Please check and Guide me
                      Thanks Again
                      • 8. Re: Explain This Code for ItemChangeEffect Please
                        Level 7

                        "manofspirit" <webforumsuser@macromedia.com> wrote in message
                        news:gi8pin$mh4$1@forums.macromedia.com...
                        >I took a Filter Function example from blog.flexexamples
                        > and i added itemChangeEffect in it.
                        > Now you can see that, when we filter items, it doesnt work
                        >
                        > Please check and Guide me
                        > Thanks Again
                        >
                        > <?xml version="1.0" encoding="utf-8"?>
                        > <!--
                        > http://blog.flexexamples.com/2008/09/12/using-a-slider-to-filter-items-in-a-data
                        > grid-control-in-flex/ -->
                        > <mx:Application xmlns:mx=" http://www.adobe.com/2006/mxml"
                        > layout="vertical"
                        > verticalAlign="middle"
                        > backgroundColor="white"
                        > creationComplete="init();">
                        >
                        > <mx:Script>
                        > <![CDATA[
                        > import mx.events.SliderEvent;
                        >
                        > private function init():void {
                        > if (checkBox.selected) {
                        > arrColl.filterFunction = sliderFilterFunc;
                        > arrColl.refresh();
                        > }
                        > }
                        >
                        > private function checkBox_change(evt:Event):void {
                        > if (checkBox.selected) {
                        > arrColl.filterFunction = sliderFilterFunc;
                        > } else {
                        > arrColl.filterFunction = null;
                        > }
                        > arrColl.refresh();
                        > }
                        >
                        > private function slider_change(evt:SliderEvent):void {
                        > arrColl.refresh();
                        > }
                        >
                        > private function sliderFilterFunc(item:Object):Boolean {
                        > var minSlider:uint = slider.values[0];
                        > var maxSlider:uint = slider.values[1];
                        > if ((item.value >= minSlider) &&
                        > (item.value <= maxSlider)) {
                        > return true;
                        > } else {
                        > return false;
                        > }
                        > }
                        > ]]>
                        > </mx:Script>
                        > <mx:DefaultTileListEffect id="tileEffect" fadeInDuration="500"
                        > fadeOutDuration="500" />
                        >
                        > <mx:ArrayCollection id="arrColl">
                        > <mx:source>
                        > <mx:Array>
                        > <mx:Object label="One" value="100" />
                        > <mx:Object label="Two" value="2" />
                        > <mx:Object label="Three" value="300" />
                        > <mx:Object label="Four" value="40" />
                        > <mx:Object label="Five" value="500" />
                        > <mx:Object label="Six" value="60" />
                        > <mx:Object label="Seven" value="700" />
                        > <mx:Object label="Eight" value="800" />
                        > <mx:Object label="Nine" value="90" />
                        > <mx:Object label="Ten" value="100" />
                        > </mx:Array>
                        > </mx:source>
                        > </mx:ArrayCollection>
                        >
                        > <mx:ApplicationControlBar dock="true">
                        > <mx:Form styleName="plain">
                        > <mx:FormItem label="filter:">
                        > <mx:CheckBox id="checkBox"
                        > selected="true"
                        > change="checkBox_change(event);" />
                        > </mx:FormItem>
                        > <mx:FormItem label="values:">
                        > <mx:HSlider id="slider"
                        > minimum="0"
                        > maximum="1000"
                        > values="[0,1000]"
                        > labels="[0,500,1000]"
                        > thumbCount="2"
                        > showTrackHighlight="true"
                        > snapInterval="1"
                        > tickInterval="100"
                        > liveDragging="true"
                        > change="slider_change(event);" />
                        > </mx:FormItem>
                        > </mx:Form>
                        > </mx:ApplicationControlBar>
                        >
                        > <mx:Panel status="{arrColl.length}/{arrColl.source.length} item(s)">
                        > <mx:TileList itemsChangeEffect="{tileEffect}" id="dataGrid"
                        > dataProvider="{arrColl}"
                        > verticalScrollPolicy="on" />
                        >
                        > </mx:Panel>
                        >
                        > </mx:Application>

                        I went through the Framework code, and what is going on here is they didn't
                        include the code to run the effect if the CollectionEventKind =
                        CollectionEventKind.REFRESH. What the code you found is trying to do is to
                        generate a bunch of remove and add events instead.

                        You can try to simply extend TileList and override the protected function
                        collectionChangeHander to add a call to prepareDataEffect after calling
                        super.collectionChangeHander(event) if CollectionEventKind =
                        CollectionEventKind.REFRESH. You may well find there's a reason why they
                        left it off in that instance if you make this change.

                        You could also try creating a ListCollectionView that you point to another
                        ListCollectionView and try to trigger a reset. Something like:

                        sourceListCollectionView.filterFunction = theFunction
                        sourceListCollectionView.refresh();
                        dataProviderListCollectionView=sourceListCollectionView;

                        You could also try filtering the source of the ListCollectionView instead of
                        the ListCollectionView itself (for instance, Array has a filter method. You
                        could create an array that contains the entire data source and keep
                        constructing new arrays with the filtered items in them and resetting the
                        source of the ListCollectionView. This will definitely trigger a reset on
                        the TileList.

                        HTH;

                        Amy


                        • 9. Re: Explain This Code for ItemChangeEffect Please
                          Level 7

                          "Amy Blankenship" <amySpamFilter@magnolia_pleaseNOspam_multimedia.com> wrote
                          in message news:gi90t5$2av$1@forums.macromedia.com...

                          You might also want to look here:
                          http://www.axelscript.com/2008/03/20/using-flex-3-filtering-data-and-new-tilelist-itemscha ngeeffect/



                          • 10. Re: Explain This Code for ItemChangeEffect Please
                            manofspirit Level 1
                            Thanks for the reply Amy,
                            I will try to do as you described
                            Thanks once again.
                            • 11. Re: Explain This Code for ItemChangeEffect Please
                              Level 7

                              "manofspirit" <webforumsuser@macromedia.com> wrote in message
                              news:gib47i$nau$1@forums.macromedia.com...
                              > Thanks for the reply Amy,
                              > I will try to do as you described
                              > Thanks once again.

                              you're welcome :)