Я хотел бы использовать комбинированный список в качестве itemEditor для одного из столбцов AdvancedDataGrid.Я огляделся и решил использовать компоненты Spark ComboBox - они гладкие и, кажется, изначально поддерживают множество полезных вещей, включая автоматическое заполнение строк при вводе текста в textInput.После некоторой переделки мне удалось добавить искровой ComboBox в мой ADG, настроить его поставщика данных, чтобы он расширялся по мере добавления новых элементов, и подключать все это.Результат кажется многообещающим, но, как всегда, некоторые детали было невозможно преодолеть для меня (на самом деле, я еще не профессионал в флексах), и надеялся, что кто-то может указать мне правильное направление.Код вставлен ниже и использует описанные здесь приемы, чтобы использовать компонент spark в качестве itemEditor для mx-сетки.
Если вы играете с (очень простым) приложением, вы заметите, что если вы нажмете (парараз) в последнем столбце справа и откройте ComboBox, вы можете выбрать значение из списка, щелкнуть по другой ячейке, и выбранное значение появится в только что оставленной ячейке.Тем не менее, и здесь начинается список раздражающих вещей:
- , если вы начнете печатать в ComboBox и нажмете Enter, когда появится нужный элемент, ComboBox останется пустым
- , если вы наберетеновый элемент в ComboBox и нажмите клавишу ввода, элемент добавляется в поставщик данных (правильное поведение), но ComboBox по-прежнему остается пустым
- , когда вы впервые щелкаете ячейку, ее текущее значение также исчезает
Я отладил первые два раздражающих сценария, и кажется, что нажатие клавиши Enter приводит к вызову advanceddatagrid1_itemEditEndHandler перед myCB_changeHandler, что означает, что myRetVal никогда не устанавливается, когда dataGrid обновляет свои ячейки.Противоположное случается, если кто-то выбирает из списка, то есть тот случай, который работает.Не уверен, что с этим делать: - (
Также хотел бы совет по третьему раздражающему симптому.
спасибо!
f
Приложение MXML
<fx:Declarations>
<s:ArrayCollection id="myCbDb"/>
</fx:Declarations>
<fx:Script>
<![CDATA[
import mx.collections.ArrayCollection;
import mx.events.AdvancedDataGridEvent;
import mx.events.DataGridEventReason;
import mx.events.FlexEvent;
[Bindable]
public var dataProv:ArrayCollection = new ArrayCollection();
[Bindable]
private var dpADG:ArrayCollection = new ArrayCollection([
{Name:'Pavement', duration:10, complete:0.1, ownerResource:'jon'},
{Name:'Pavement', duration:20, complete:.2, ownerResource:'randy'},
{Name:'Saner', duration:30, complete:.30, ownerResource:'joe'},
{Name:'Saner', duration:10, complete:.40, ownerResource:'mia'},
{Name:'The Doors', duration:5, complete:.50, ownerResource:'mia'},
{Name:'The Doors', duration:0, complete:.60, ownerResource:'jill'},
{Name:'Grateful Dead', duration:20, complete:.70, ownerResource:'jill'},
{Name:'Grateful Dead', duration:10, complete:.80, ownerResource:'joe'},
{Name:'Grateful Dead', duration:10, complete:.90, ownerResource:'jon'},
{Name:'The Doors', duration:5, complete:1, ownerResource:'jon'},
{Name:'The Doors', duration:10, complete:0, ownerResource:'jon'}
]);
private function formatDuration(data:Object, column:AdvancedDataGridColumn):String
{
var retVal:String = "";
var duration:Number = data[column.dataField] as Number;
retVal = duration.toString() + " days";
return retVal;
}
private function formatComplete(data:Object, column:AdvancedDataGridColumn):String
{
var retVal:String = "";
var duration:Number = data[column.dataField] as Number;
duration *= 100;
retVal = duration.toString() + " %";
return retVal;
}
private function formatResources(data:Object, column:AdvancedDataGridColumn):String
{
var retVal:String = data[column.dataField] as String;
return retVal;
}
protected function advanceddatagrid1_creationCompleteHandler(event:FlexEvent):void
{
for each (var a:Object in dpADG.source)
{
var s:String = a["ownerResource"];
if (!dataProv.contains(s))
{
dataProv.addItem(s);
trace("adding element ", s);
}
}
}
protected function advanceddatagrid1_itemEditEndHandler(event:AdvancedDataGridEvent):void
{
if (event.dataField == "ownerResource")
{
var editor:ResourceComboBoxField = ADG.itemEditorInstance as ResourceComboBoxField;
var name:String = editor.myRetVal;
// handle the ESC case first off
if (event.reason == DataGridEventReason.CANCELLED)
{
// Do not update cell.
return;
}
// do something with myRetVal if needed be
}
}
]]>
</fx:Script>
<mx:AdvancedDataGrid
width="100%" height="100%"
id="ADG"
sortExpertMode="true"
editable="true"
creationComplete="advanceddatagrid1_creationCompleteHandler(event)"
dataProvider="{dpADG}"
itemEditEnd="advanceddatagrid1_itemEditEndHandler(event)">
<mx:columns>
<mx:AdvancedDataGridColumn dataField="Name" />
<mx:AdvancedDataGridColumn dataField="duration" labelFunction="formatDuration" itemEditor="DurationField" editorDataField="value"/>
<mx:AdvancedDataGridColumn dataField="complete" labelFunction="formatComplete" itemEditor="CompleteField" editorDataField="value"/>
<mx:AdvancedDataGridColumn dataField="ownerResource" labelFunction="formatResources" editorDataField="myRetVal">
<mx:itemEditor>
<fx:Component>
<local:ResourceComboBoxField myDP="{outerDocument.dataProv}">
</local:ResourceComboBoxField>
</fx:Component>
</mx:itemEditor>
</mx:AdvancedDataGridColumn>
</mx:columns>
</mx:AdvancedDataGrid>
и компонент
<fx:Script>
<![CDATA[
import mx.collections.ArrayCollection;
import mx.collections.IList;
import spark.events.IndexChangeEvent;
public var myRetVal:String = new String();
[Bindable]
public var myDP:ArrayCollection;
// Event handler to determine if the selected item is new.
protected function myCB_changeHandler(event:IndexChangeEvent):void
{
// Determine if the index specifies a new data item.
if(myCB.selectedIndex == spark.components.ComboBox.CUSTOM_SELECTED_ITEM)
// Add the new item to the data provider.
myDP.addItem(myCB.selectedItem);
myRetVal = myCB.selectedItem;
}
]]>
</fx:Script>
<s:ComboBox id="myCB" width="140" change="myCB_changeHandler(event);" dataProvider="{myDP}"/>