flex - sola - Cambia automáticamente el tamaño del ancho de DataGridCoulmn/AdvancedDataGridColumn para ajustarse al contenido
como modificar el alto de una fila en excel (4)
Quiero que DataGridColumn o AdvancedDataGridColumn redimensionen automáticamente su ancho para que se ajuste al contenido dentro de ...
Soy nuevo en flex. Quiero implementar algo así como tablas HTML.
Los datos procesados son texto simple. Algunas Filas tienen poco texto más largo, en ese caso me gustaría ampliar automáticamente el ancho de DataGridColumn.
Cualquier ayuda para resolver esto.
Gracias por adelantado
Ha llegado a uno de los mayores problemas de DataGrid y AdvancedDataGrid. Odio lo difícil que es conseguir que el contenido de la célula aparezca cómodamente. Por razones que no son inmediatamente aparentes, los valores de campo angostos aparecerán en celdas muy anchas, mientras que el contenido amplio y los encabezados se arrugarán.
Esto es especialmente cierto para la primera y la última columna por algún motivo.
La única solución que he encontrado es establecer la propiedad minWidth en las columnas, y primero tengo que revisar los datos para encontrar los valores atípicos más anchos en esas columnas y asegurarme de que se ajustan cómodamente. Otra solución que ayuda es tener columnas ficticias a la izquierda y a la derecha con anchuras y anchuras mínimas y anchuras máximas de un tamaño muy pequeño, digamos 5, que parece permitir que las columnas reales en el centro "respiren" un poco mejor.
<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>
Ten cuidado, sin embargo. Si establece un ancho en una columna, no se interpreta como un valor literal o un porcentaje real, sino como un tipo de proporción a medias. Solo puedo suponer que los procedimientos de dimensionamiento de columnas se cansan de calcular y establecer algún tipo de interpretación "razonable" del ancho de columna, lo que, por supuesto, resulta completamente irracional la mayor parte del tiempo.
En este momento estoy tan frustrado que estoy considerando ir con un producto de terceros, ElfGrid , que resuelve estos problemas y más. Mire la documentación, especialmente los ElfColumnUtils, que tienen algunos métodos muy útiles para tratar estos problemas. También es bastante rápido en las pruebas que he hecho.
Puede establecer el ancho en un porcentaje fijo si puede adivinar el ancho posible. Pero sugeriría otra opcióng:
- establecer la propiedad variableRowHeight de la cuadrícula de datos en true
- establezca la propiedad wordWrap de la columna que tendrá el texto más largo en verdadero.
De esta forma, su texto largo se colocará en varias líneas y solo se aumentará esa altura de fila. solo inténtalo. si no quieres esto, entonces creo que necesitarás escribir una nueva clase extendiendo 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>
Saludos, PK
Tuve el mismo problema, debe saber de antemano el tamaño de la cadena más larga, luego asigna el MinWidth de ese tamaño y hacer que la columna cambie de tamaño = ''false''.
Funcionó para mí
Así es como lo hago, y funciona bastante bien ...
Crea una variable enlazable y dale un número inicial (digamos 100), por ejemplo:
[Bindable] private var colWidth:int = 100;
Utilice el enlace de datos para ajustar el tamaño de las columnas, por ejemplo:
mx:DataGridColumn width="{colWidth}"
Agregue un controlador de eventos de cambio de tamaño a su cuadrícula de datos, por ejemplo:
myDataGrid.addEventListener(ResizeEvent.RESIZE , onDataGridResize);
En el controlador, escuche el nuevo ancho de la cuadrícula de datos, tome ese número y divídalo por la cantidad de columnas (si todas las columnas son iguales), o haga cálculos para crear el ''porcentaje'' para el ancho de las columnas , por ejemplo:
private function onDataGridResize(event:ResizeEvent):void {
colWidth = myDataGrid.width / numberOfColumns;
}