flex：当我将鼠标悬停在包含可换肤容器的数据网格中时出现边框

Question

我有一个项目，在其中显示数组中的内容。我还需要显示评级 - 介于 1 到 5 颗星之间，

每行都有正确的交替阴影，效果很好 - 但是，当我将鼠标悬停在 itemrenderer 中的可换肤计数器（名为 cont）仍然保留该行的原始颜色。当我们使用 fxg 图形时，我们有一个可换肤的容器框，其中包含具有一种色调的评级，它位于较大的表格内 - 鼠标悬停时行颜色发生变化。附加屏幕截图 - 您可以看到评级框（深灰色）和鼠标悬停时突出显示的行之间的蓝色细线...

我被告知从数据网格转移到列表以解决此问题并获得更好的性能 - 似乎是一项艰巨的任务我搞砸了。作为一个更简单的选择，正在寻找 我愿意任一 a）使可换肤容器颜色消失，因此我在鼠标悬停时看到一行中的单一颜色 b）禁用鼠标悬停时网格行的颜色更改，因此可以避免此问题

弄乱之前的条目 - 因此重述问题...

谢谢

数据网格非常简单，如下所示

<mx:DataGrid id="experimentgrid" fontSize="{12}"  fontWeight="bold" color="#006837" styleName="dataGridStyle" rowHeight="{15}" borderVisible="false" showHeaders="false" x="{20}" y="{50}"  width="{900}" height="{350}"   dataProvider="{arr_expList}" itemClick="onItemExp(event);" creationComplete="setColWidths()" verticalScrollPolicy="auto" verticalScrollBarStyleName="scrollStyle" >
     <mx:columns>
<mx:DataGridColumn id="col11" dataField="no"  resizable="true" />
<mx:DataGridColumn id="col12" dataField="Name" resizable="true" />
<mx:DataGridColumn id="col13"  dataField="Rating" itemRenderer="itemRenderers.experimentGriditemRender" resizable="true"/>      
</mx:columns>

项目渲染器代码如下

    <?xml version="1.0" encoding="utf-8"?>
<s:MXDataGridItemRenderer xmlns:fx="http://ns.adobe.com/mxml/2009" 
                          xmlns:s="library://ns.adobe.com/flex/spark" 
xmlns:mx="library://ns.adobe.com/flex/mx" 
focusEnabled="true">

    <fx:Script>
        <![CDATA[
            import assets.graphics.dotrating;

            import mx.controls.dataGridClasses.*;
            import mx.events.FlexEvent;

            import spark.core.SpriteVisualElement;
            private var mydot:SpriteVisualElement;

            override public function set data(value:Object):void
            {               
                if(value != null)
                {       
                    cont.removeAllElements();       
                    for(var i:int=0;i<value.Rating;i++)
                    {
                        mydot = new dotrating();
                    //600 is a stand-in for some calculations   
                        mydot.x= (600*0.02)+(i*600*0.02);
                        mydot.y= (600*0.012);
                        //mydot.x = (i*600*0.02);                       
                        mydot.height = 600*0.013;
                        mydot.width = 600*0.013;                        
                        cont.addElement(mydot);
                    }                   
                }
            }


        ]]>
    </fx:Script>
    <s:SkinnableContainer id = "cont" top="0" left="0" right="0" bottom="0" height="{600*0.02}">

    </s:SkinnableContainer>
</s:MXDataGridItemRenderer>![enter image description here][2]

Answer 1

我很确定您想要设置 autoDrawBackground 属性设置为 false。默认情况下是这样。

除此之外，您可以尝试使用 DataGrid 的 rollOverColor 样式。

Answer 2

是的，我肯定会使用带有自定义项目渲染器的列表而不是数据网格。数据网格很重，并且有很多您甚至没有使用的额外功能。这也能解决你的问题。