Question

我希望DataGridColumn或AdvancedDataGridColumn会自动调整其宽度以适应内容。

我是初学者。我想实现像HTML表格这样的东西。

渲染的数据是简单的文字。有些行只有很短的文本，在这种情况下我想自动扩展DataGridColumn的宽度。

任何帮助解决这个问题。

提前致谢

Answer 1

您遇到了DataGrid和AdvancedDataGrid的一个最大问题。我绝对不喜欢让细胞内容舒适地出现是多么困难。由于不明显的原因，窄字段值将出现在非常宽的单元格中，而广泛的内容和标题将被破坏。

出于某种原因，对于第一列和最后一列尤其如此。

我找到的唯一解决方案是在列上设置minWidth属性，我必须首先查看数据以找到这些列中最宽的异常值并确保它们适合放置。另一个有帮助的解决方案是在左侧和右侧设置虚拟列，给出宽度和最小宽度以及一些非常小的最大宽度，比如说5，这似乎可以让中间的真实柱子更好地“呼吸”。 / p>

<mx:columns>
  <mx:DataGridColumn id="leftDummy" width="5" minWidth="5" maxWidth="5"/>
  <!-- Your "real" columns here, with minWidth assignments -->
  <mx:DataGridColumn id="rightDummy" width="5" minWidth="5" maxWidth="5"/>
</mxcolumns>

但是，要小心。如果在列上设置宽度，则不会将其解释为字面值或实际百分比，而是作为某种半成比例。我只能假设列大小的过程厌倦了计算和解决对列宽的某种“合理”解释 - 当然，这在很多时候都是完全不合理的。

此刻我非常沮丧，我正在考虑使用第三方产品ElfGrid来解决这些问题等等。查看文档，尤其是ElfColumnUtils，它们有一些非常方便的方法来处理这些问题。在我完成的测试中，它也非常快。

Answer 2

我是这样做的，而且效果很好......

创建一个可绑定变量并给它一个起始编号（比方说100），例如：

[Bindable] private var colWidth:int = 100;

使用数据绑定来调整列的大小，例如：

mx:DataGridColumn width="{colWidth}"

向数据网格添加resize事件处理程序，例如：

myDataGrid.addEventListener(ResizeEvent.RESIZE , onDataGridResize);

在处理程序中侦听数据网格的新宽度，取出该数字并除以列数（如果所有列都相等），或者做一些数学运算来创建宽度的“百分比”列，例如：

private function onDataGridResize(event:ResizeEvent):void {
  colWidth = myDataGrid.width / numberOfColumns;
}

Answer 3

如果可以猜出可能的宽度，可以将宽度设置为某个固定的百分比。但我会建议另一种选择：

将datagrid的variableRowHeight属性设置为true
将列的wordWrap属性设置为true。

通过这种方式，您的长文本将放在多行中，并且只会增加行高。试一试吧。如果你不想要这个，那么我认为你可能需要编写一个扩展datagridColumn的新类。

<mx:DataGrid dataProvider="{testAC}" width="80%" height="100%" variableRowHeight="true">
         <mx:columns>
              <mx:DataGridColumn dataField="company" wordWrap="true"/>                    <mx:DataGridColumn dataField="share"/>
              <mx:DataGridColumn dataField="expense"/>
        </mx:columns>
 </mx:DataGrid>

干杯， PK

Answer 4

我遇到了同样的问题，您应该事先知道较长字符串的大小，然后指定MinWidth的大小，并使列resizeable ='false'。

它对我有用

自动调整DataGridCoulmn / AdvancedDataGridColumn的宽度以适合内容

4 个答案: