我想创建一个 AdvancedDataGrid，其中一个单元格需要一些涉及图像和文本的布局工作。这是我要解决的问题的顶层视图
（我的网格看起来像这样 - 第一列中的属性“名称”和第二列中的属性“值”）
<mx:AdvancedDataGrid showHeaders="false" defaultLeafIcon="{null}">
<mx:columns>
<mx:AdvancedDataGridColumn dataField="Property" headerText="Property" backgroundColor="#E5EFF5" width="0.4" wordWrap="true"/>
<mx:AdvancedDataGridColumn dataField="Value" headerText="Value" backgroundColor="white" width="0.6"/>
</mx:columns>
</mx:AdvancedDataGrid>
（网格的 dataProvider 如下所示）
var retVal:ArrayCollection = new ArrayCollection([
{Property:'AA', Value:1},
{Property:'BB', Value: <Object that requires custom formatting when displayed in the grid>},
{Property:'CC', Value:"Simple string"}
]);
单独的属性 BB 具有更复杂的视图，涉及在特定布局中布置图像和文本。每个其他属性都有一个简单的字符串或数值，不需要任何特殊格式。
事实证明，像 itemRenderer 这样的东西对我来说太难使用了，因为在网格内显示时，并非给定列的所有列条目都以相同的方式格式化。
我正在使用 AdvancedDataGrid，因为它在网格中提供树状导航（使用子级），这是我最终需要的。
一个例子会很有帮助，因为我是 flex 新手。
谢谢你。
我试图创建一个示例，但它没有做我想要的
// GridExample.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">
<fx:Declarations>
<!-- Place non-visual elements (e.g., services, value objects) here -->
</fx:Declarations>
<fx:Script>
<![CDATA[
import mx.collections.ArrayCollection;
[Bindable]
var data:ArrayCollection = new ArrayCollection([{Property:'AA', RowIdentifier: "SimpleType", Value:3},
{Property:'BB', RowIdentifier: "ArrayType", Value:["one", "two", "three"]},
{Property:'CC', RowIdentifier: "SimpleType", Value:"My string"}
]);
]]>
</fx:Script>
<mx:Box height="300" width="300">
<mx:AdvancedDataGrid
variableRowHeight="true"
width="100%"
showHeaders="false"
defaultLeafIcon="{null}"
dataProvider="{data}">
<mx:columns>
<mx:AdvancedDataGridColumn dataField="Property" headerText="Property" backgroundColor="#E5EFF5" width="0.4" wordWrap="true"/>
<mx:AdvancedDataGridColumn dataField="Value" headerText="Value" backgroundColor="white" width="0.6" itemRenderer="ExampleRenderer"/>
<mx:AdvancedDataGridColumn dataField="RowIdentifier" visible="false"/>
</mx:columns>
</mx:AdvancedDataGrid>
</mx:Box>
</s:WindowedApplication>
//ExampleRenderer.mxml
<mx:Box xmlns:mx="http://www.adobe.com/2006/mxml" textAlign="center" creationComplete="renderNow()" >
<mx:Script>
<![CDATA[
import mx.containers.HBox;
import mx.containers.VBox;
import mx.controls.Alert;
import mx.controls.Image;
import mx.controls.Label;
import mx.resources.ResourceManager;
private var dataObject:Object;
private function renderNow():void {
var rowId:String = dataObject["RowIdentifier"];
if (rowId == "ArrayType"){
var valueObj:Array = dataObject["Value"];
var vBox:VBox = new VBox();
vBox.percentHeight = 100;
vBox.percentWidth = 100;
for (var i:uint=0; i<valueObj.length;i++){
//Create the hBoxes that will wrap the host icon and the host Ip
var hBox:HBox = new HBox();
//Add host icon to the box
var imageIcon:Image = new Image();
imageIcon.source = "@Embed(source='adobe.png')";
hBox.addChild(imageIcon);
//Appears to the right
var label2:Label = new Label();
label2.text = valueObj[i];
label2.percentHeight = 100;
label2.percentWidth = 70;
hBox.addChild(label2);
//Add the hBox to the vBox
vBox.addChild(hBox);
}
this.addChild(vBox);
}
else{
var iLabel:Label = new Label();
iLabel.text = dataObject["Value"];
iLabel.percentHeight = 100;
iLabel.percentWidth = 100;
this.addChild(iLabel);
}
}
override public function set data(value:Object):void
{
dataObject = value;
}
]]>
</mx:Script>
</mx:Box>
运行它的输出给了我错误的网格单元格（属性值完全关闭，如果我的 Box 宽度和高度以百分比设置，当我尝试调整大小时它们会到处乱跑）
你能帮我找出我正在做的事情有什么问题吗？任何帮助表示赞赏。
问候