apache-flex - DataGrid itemEditor 中的下拉列表中的滚动条不起作用

Question

我的 DataGrid 的 itemEditor 中有一个 DropDownList。 DropDownList 中有足够的项目来调整滚动条。您可以看到滚动条，并且鼠标滚轮工作正常。如果将鼠标移到滚动条上，它们会很好地改变外观(鼠标悬停有效)。如果单击它们，DropDownList 将关闭，就好像您单击了数据网格中的其他地方一样。

Adobe Forums 有评论描述了同样的问题，但它已经很老了，还没有得到解答。

我一直在试验自定义皮肤，希望找到一种方法来捕获鼠标事件，但没有成功。

FWIW，这是 Flex4，作为 AIR 应用程序。

Scratch.mxml(主要代码)

    <?xml version="1.0" encoding="utf-8"?>
<s:WindowedApplication xmlns:fx="http://ns.adobe.com/mxml/2009" 
        xmlns:s="library://ns.adobe.com/flex/spark" 
        xmlns:mx="library://ns.adobe.com/flex/mx"
        creationComplete="windowedapplication1_creationCompleteHandler(event)">
 <fx:Script>
  <![CDATA[
   import mx.collections.ArrayCollection;
   import mx.events.FlexEvent;
   [Bindable] public var dataList:ArrayCollection = new ArrayCollection();

   protected function windowedapplication1_creationCompleteHandler(event:FlexEvent):void
   {
    var o:Object = new Object();
    
    o.theChoice = "abc";
    o.choices = new ArrayCollection();
    o.choices.addItem("abc");
    o.choices.addItem("def");
    o.choices.addItem("ghi");
    o.choices.addItem("jkl");
    o.choices.addItem("mno");
    o.choices.addItem("pqr");
    o.choices.addItem("stu");
    o.choices.addItem("vwx");
    o.choices.addItem("yz ");
    dataList.addItem(o);
   }
   protected function col2Label(item:Object, column:DataGridColumn):String {
    return item.theChoice;
   }
   // If you use the labelFunction, then you must specify a sortCompareFunction
   private function sortCol2(obj1:Object, obj2:Object):int
   {
    var d1:String = obj1.col2 as String;
    var d2:String = obj2.col2 as String;
    if(d1 < d2) {
     return -1;
    } else if(d1 == d2) {
     return 0;
    }
    return 1;
   }

  ]]>
 </fx:Script>
 <fx:Declarations>
  <!-- Place non-visual elements (e.g., services, value objects) here -->
 </fx:Declarations>
 <mx:DataGrid id="glGrid" top="10" left="10" right="10" bottom="10"
     dataProvider="{dataList}" editable="true" >
  
  <mx:columns>
   <mx:DataGridColumn id="col2" 
          headerText="Column 2"  
          itemEditor="Renderers.ddlRenderer" 
          labelFunction="col2Label" 
          dataField="col2"
          sortCompareFunction="sortCol2"/>
  </mx:columns>  
 </mx:DataGrid>
</s:WindowedApplication>

ddlRenderer.mxml:

    <?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 mx.collections.ArrayList;
   
   import spark.events.IndexChangeEvent;
   
   [Bindable] private var myChoices : ArrayList = new ArrayList();
   
   override public function set data(value:Object):void
   {
    if (value != null) {
     super.data = value;
     if (ddl && myChoices) {
      myChoices.removeAll();
      var theChoice:String = value.theChoice;
      
      myChoices.addAll(value.choices);
      
      var lineChoice : String;
      for (var i:int = 0; i < myChoices.length; i++) {
       lineChoice = myChoices.getItemAt(i) as String;
       if (lineChoice == theChoice) {
        ddl.selectedItem = lineChoice;
        break;
       }
      }
     }
    }
   }
   
  ]]>
 </fx:Script>
 
 <s:DropDownList id="ddl" 
     width="100%" 
     dataProvider="{myChoices}"/>
</s:MXDataGridItemRenderer>

要查看问题，请运行代码，单击“abc”以触发 itemRenderer，单击 DropDownList 以查看选项，然后尝试单击滚动条。

我被这个难住了，非常感谢一些帮助。

谢谢

丹

Answer 1

我将其作为错误(SDK-27783、Flex SDK、Spark:DropDownList)发布到 Adob​​e，今天刚刚关闭。 Alex Harui 有一个很好的解决方法:

解决方法是按如下方式更改渲染器:

<s:DropDownList id="ddl" 
 width="100%" 
 dataProvider="{myChoices}" open="ddl.skin['dropDown'].owner = this"/>

我对此进行了测试，它解决了我的问题。希望这也会对其他人有所帮助。