DataGrid itemEditor 内下拉列表中的滚动条不起作用 [英] Scrollbars in dropdownlist inside DataGrid itemEditor not working
问题描述
我的 DataGrid 的 itemEditor 中有一个 DropDownList.DropDownList 中有足够的项目来对齐滚动条.您可以看到滚动条,并且鼠标滚轮工作正常.如果您将鼠标移到滚动条上,它们会很好地改变外观(鼠标悬停正在工作).如果您点击它们,DropDownList 就会关闭,就像您点击数据网格中的其他地方一样.
I have a DropDownList inside the itemEditor of my DataGrid. There are enough items in the DropDownList to justify scrollbars. You can see the scrollbars, and the mousewheel works fine. If you move the mouse over the scrollbars, they'll change appearance fine (mouseover is working). If you click on them, the DropDownList closes as if you'd clicked elsewhere in the data grid.
Adobe 论坛上有一条评论描述了同样的问题,但它已经相当老了,还没有得到答复.
There's a comment on the Adobe Forums that describe the same problem, but it is fairly old and has not been answered.
我一直在尝试自定义皮肤,希望找到一种方法来捕获鼠标事件,但没有成功.
I've been experimenting with custom skins hoping to find a way to trap the mouse event, but have been unsuccessful.
FWIW,这是 Flex4,作为 AIR 应用程序.
FWIW, this is Flex4, as an AIR app.
Scratch.mxml(主代码)
Scratch.mxml (main code)
<?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:
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 以查看选项,然后尝试单击滚动条.
To see the problem, run the code, click on "abc" to trigger the itemRenderer, click on the DropDownList to see the choices, then try clicking on the scrollbar.
我很难过这个问题,非常感谢您的帮助.
I'm stumped on this one, and would greatly appreciate some help.
谢谢
丹
推荐答案
我将此作为 bug (SDK-27783, Flex SDK, Spark:DropDownList) 发布到 Adobe,今天刚刚关闭.Alex Harui 有一个很好的解决方法:
I posted this to Adobe as a bug (SDK-27783, Flex SDK, Spark:DropDownList), which was just closed today. Alex Harui had a good workaround:
解决方法是按如下方式更改渲染器:
Workaround is to change renderer as follows:
<s:DropDownList id="ddl"
width="100%"
dataProvider="{myChoices}" open="ddl.skin['dropDown'].owner = this"/>
我对此进行了测试,它解决了我的问题.希望这也能帮助其他人.
I tested this and it solves my problem. Hopefully this will help others as well.
这篇关于DataGrid itemEditor 内下拉列表中的滚动条不起作用的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!