Oh yeah, another thing I should point out is that in the real grid, I have
multiple columns.  As such, a solution that relies on the itemRenderer might
be problematic due to gaps between items and such.  I would just use the
itemRollOver and itemRollOut to do it all, but rollOut doesn't get reliably
called for every highlighted row when the highlight leaves it.

On Mon, Jun 8, 2009 at 3:46 PM, Pan Troglodytes <chimpathe...@gmail.com>wrote:

> That was a good idea and it does get rid of the arraycollection walking.
> But I get the SAME problem with the grid losing highlighting when I did it
> using AdvancedGridItemRenderer, thought the symptoms are slightly different:
>
> <?xml version="1.0" encoding="utf-8"?>
> <Application
>   xmlns="http://www.adobe.com/2006/mxml";
>   creationComplete="cc()"
>   layout="horizontal"
>   >
>   <Script>
>     <![CDATA[
>       import mx.events.ListEvent;
>       import mx.collections.ArrayCollection;
>       [Bindable] public var d:ArrayCollection = new ArrayCollection([]);
>
>       private const ITEM_COUNT:int = 15;
>
>       private function cc():void
>       {
>         for (var i:int = 0; i < ITEM_COUNT; i++)
>         {
>           var item:TestObject = new TestObject;
>           item.label = "Item " + i;
>           d.addItem(item);
>         }
>       }
>
>       private function getColStyle(data:Object,
> column:AdvancedDataGridColumn):Object
>       {
>         return { fontWeight:(data.highlighted ? "bold" : "normal") }
>       }
>
>     ]]>
>   </Script>
>   <AdvancedDataGrid id="list" dataProvider="{d}" height="100%">
>     <columns>
>       <AdvancedDataGridColumn styleFunction="getColStyle"
> dataField="label">
>         <itemRenderer>
>           <Component>
>             <AdvancedDataGridItemRenderer>
>               <Script>
>                 <![CDATA[
>                   import mx.controls.AdvancedDataGrid;
>                   override public function validateNow():void
>                   {
>                     var adg:AdvancedDataGrid = owner as AdvancedDataGrid;
>                     if (data && adg)
>                       data.highlighted = adg.isItemHighlighted(data);
>
>                     super.validateNow();
>                   }
>                 ]]>
>               </Script>
>             </AdvancedDataGridItemRenderer>
>           </Component>
>         </itemRenderer>
>       </AdvancedDataGridColumn>
>     </columns>
>   </AdvancedDataGrid>
> </Application>
>
>
> In this example, I don't loop through the dataprovider but instead only
> affect the itemRenderer being redrawn.  Yet if you try this example with
> highlighted being a [Bindable] variable, it breaks, not just failing to
> show the highlighted item in bold but also breaking the grid's blue
> highlight.  Comment out the [Bindable] part in TestObject, and it works
> just fine.
>
> I'm hoping Alex is still following along.
>
> I'm trying to get my itemRenderers in a big complicated grid as lean as
> possible, as per Alex's suggestions on his blog.  The highlighted data is
> also being used in a couple of different places that are abstracted a bit,
> otherwise I'd hardcode something a bit more kludgy.
>
>
>
> On Fri, Jun 5, 2009 at 2:41 PM, Tim Hoff <timh...@aol.com> wrote:
>
>>
>>
>> Hi Jason,
>>
>> Have you tried it from within the itemRenderer?  Something like:
>> *
>>
>> private
>> * *var* adg : AdvancedDataGrid;
>>
>> *override* *public* *function* *set* data(value:Object):*void*
>> {
>> *     super*.data = value;
>>
>>      adg = owner *as* AdvancedDataGrid;
>> }
>>
>> *override* *protected* *function* updateDisplayList( w:Number, h:Number
>> ):*void
>> *{
>> *     super*.updateDisplayList( w, h );
>>
>>      data.highlighted = adg.isItemHighlighted(data);
>> }
>>
>> Not sure if this will work for your purposes, but it's worth a shot.
>>
>> -TH
>>
>>
>> --- In flexcoders@yahoogroups.com, Pan Troglodytes <chimpathe...@...>
>> wrote:
>> >
>> > Yes. A gigantic 15 items. ;) I wouldn't have thought going through a
>> list
>> > of 15 items would be quite so processor intensive.
>> >
>> > Though even if it's just 5 items and I use Array instead of
>> ArrayCollection,
>> > it's still choppy.
>> >
>> > The problem isn't so much that it's scanning through the entire
>> collection,
>> > as if you change "item.highlighted = list.isItemHighlighted(item)" to "
>> > trace('here');", the choppiness disappears.
>> >
>> > So, the problem is that it's setting this bound variable highlighted 15
>> > times (or even just 5) for each item as it rolls over them. And the
>> strange
>> > thing is that the data all gets set behind the scenes. What happens that
>> > the grid cells don't get repainted properly. If you actually play with
>> the
>> > program a little, dragging your mouse around a bit, you'll see what I'm
>> > talking about. Here's a video that might be helpful:
>> >
>> > http://www.youtube.com/watch?v=7LQFlQtiHsc
>> >
>> > So it seems odd to me that the data is getting updated but the grid is
>> > losing track of the ability to highlight.
>> >
>> > You know what's really interesting? Change the style function this:
>> > private function getColStyle(data:Object,
>> > column:AdvancedDataGridColumn):Object
>> > {
>> > return { fontWeight:(data.highlighted ? "bold" : "normal") }
>> > }
>> >
>> > Now you'll see that the bolding tracks perfectly! The reason it failed
>> > before was the same reason the blue mouseover highlight was failing.
>> > Internally, the grid is losing the ability to highlight.
>> >
>> > On Thu, Jun 4, 2009 at 11:28 PM, Alex Harui aha...@... wrote:
>> >
>> > >
>> > >
>> > > The rollover handler is scanning the entire arraycollection.
>> > >
>> > >
>> > >
>> > > Alex Harui
>> > >
>> > > Flex SDK Developer
>> > >
>> > > Adobe Systems Inc. <http://www.adobe.com/>
>>
>> > >
>> > > Blog: http://blogs.adobe.com/aharui
>> > >
>> > >
>> > >
>> > > *From:* flexcoders@yahoogroups.com [mailto:flexcod...@yahoogroups.com]
>> *On
>> > > Behalf Of *Pan Troglodytes
>> > > *Sent:* Thursday, June 04, 2009 12:00 PM
>> > > *To:* flexcoders
>> > > *Subject:* [flexcoders] how to fix poor performance in this example
>> > > (AdvancedDataGrid and Binding)
>> > >
>> > >
>> > >
>> > >
>> > >
>> > >
>> > > I have the following example that is a very simplified form of what I
>> > > need to do in my much larger program. The goal is to have a mouseover
>> on a
>> > > grid item set a variable in the data object. In the real program, this
>> > > fires off some other code which makes that item visible and the others
>> > > hidden, etc. But here, I'm just trying the first part.
>> > >
>> > > *TestObject.as:*
>> > > package
>> > > {
>> > > public class TestObject
>> > > {
>> > > [Bindable] public var label:String;
>> > > [Bindable] public var highlighted:Boolean;
>> > > }
>> > > }
>> > >
>> > > *GenericTest.mxml:
>> > > *<?xml version="1.0" encoding="utf-8"?>
>> > > <Application
>> > > xmlns="http://www.adobe.com/2006/mxml";
>> > > creationComplete="cc()"
>> > > layout="horizontal"
>> > > >
>> > > <Script>
>> > > <![CDATA[
>> > > import mx.events.ListEvent;
>> > > import mx.collections.ArrayCollection;
>> > > [Bindable] public var d:ArrayCollection = new ArrayCollection([]);
>> > >
>> > > private const ITEM_COUNT:int = 15;
>> > >
>> > > private function cc():void
>> > > {
>> > > for (var i:int = 0; i < ITEM_COUNT; i++)
>> > > {
>> > > var item:TestObject = new TestObject;
>> > > item.label = "Item " + i;
>> > > d.addItem(item);
>> > > }
>> > > }
>> > >
>> > > private function listRollover(e:ListEvent):void
>> > > {
>> > > for each (var item:TestObject in d)
>> > > item.highlighted = list.isItemHighlighted(item);
>> > > }
>> > >
>> > > private function getColStyle(data:Object,
>> > > column:AdvancedDataGridColumn):Object
>> > > {
>> > > return { fontWeight:(list.isItemHighlighted(data) ? "bold" :
>> > > "normal") }
>> > > }
>> > >
>> > > private function getColStyle2(data:Object,
>> > > column:AdvancedDataGridColumn):Object
>> > > {
>> > > return { fontWeight:(list2.isItemHighlighted(data) ? "bold" :
>> > > "normal") }
>> > > }
>> > >
>> > > ]]>
>> > > </Script>
>> > > <AdvancedDataGrid id="list" dataProvider="{d}" height="100%"
>> > > itemRollOver="listRollover(event)">
>> > > <columns>
>> > > <AdvancedDataGridColumn styleFunction="getColStyle"
>> > > dataField="label"/>
>> > > </columns>
>> > > </AdvancedDataGrid>
>> > > <AdvancedDataGrid id="list2" dataProvider="{d}" height="100%">
>> > > <columns>
>> > > <AdvancedDataGridColumn styleFunction="getColStyle2"
>> > > dataField="label"/>
>> > > </columns>
>> > > </AdvancedDataGrid>
>> > > </Application>
>> > >
>> > > To see the problem, run your mouse up and down the list on the left
>> and the
>> > > list on the right. If you get the same results I do with SDK 3.0.2 and
>> > > player 10,0,12,36 (FF 3.0.6 or IE 7), you'll see that the list on the
>> right
>> > > tracks very smoothly but the one on the left is choppy. The only
>> difference
>> > > between the two is that the one on the left has a rollOver handler
>> that sets
>> > > a Bindable variable in the data object.
>> > >
>> > > If you comment out the [Bindable] on TestObject's highlighted
>> variable, the
>> > > choppiness goes away. So it's something to do with all the binding
>> glue
>> > > being fired behind the scenes. Is there some good way to work around
>> this
>> > > while still being able to use binding in this way?
>> > >
>> > > --
>> > > Jason
>> > >
>> > >
>> > >
>> >
>> >
>> >
>> > --
>> > Jason
>> >
>>  
>>
>
>
>
> --
> Jason
>



-- 
Jason

Reply via email to