DataGrid的额外空间

试图在最后一栏删除多余的空间，我试过各种方法都不行，每当出现滚动条，网格的行为以奇怪的方式通知的最后一列的宽度是70，但不知何故网格增加一些额外的空间。DataGrid的额外空间

Last column has extra space even after makeing it not resizable

<?xml version="1.0" encoding="utf-8"?> 
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute"> 
    <mx:Script> 
     <![CDATA[ 
      import mx.events.ResizeEvent; 
      import mx.collections.IViewCursor; 
      import mx.collections.ArrayCollection; 
      import mx.rpc.events.ResultEvent; 
      import mx.controls.dataGridClasses.DataGridColumn; 
      import mx.managers.CursorManager; 

      [Bindable] 
      private var itemAC:Array = [ 
       {name:"ABC", quantity:5, color:"Red", size:54, hasLogo:true}, 
       {name:"ABC1", quantity:6, color:"Green", size:46, hasLogo:false} 
       ]; 

     ]]> 
    </mx:Script> 
    <mx:Canvas width="25%" height="45%" backgroundColor="red" horizontalCenter="0" 
       verticalCenter="0" id="stuff" verticalScrollPolicy="off" horizontalScrollPolicy="off"> 
     <mx:DataGrid height="100%" width="100%" id="dg" dataProvider="{itemAC}" 
        horizontalScrollPolicy="auto"> 
      <mx:columns> 
       <mx:DataGridColumn width="70" dataField="name"/> 
       <mx:DataGridColumn width="70" dataField="quantity"/> 
       <mx:DataGridColumn width="70" dataField="color"/> 
       <mx:DataGridColumn width="70" dataField="size"/> 
       <mx:DataGridColumn width="70" dataField="hasLogo" resizable="false"/> 
      </mx:columns> 
     </mx:DataGrid> 
    </mx:Canvas> 

</mx:Application>

来源

2012-08-03 Lalit

尝试从第一个数据网格列中移除宽度属性。也许你的datagrid控件大于5Columns x 70px。 – 2012-08-03 08:02:17

试图从第一列中删除宽度，第一列宽变得更加似是而非，因为最后一列存在相同的问题。 – Lalit 2012-08-03 08:53:18

从最后一列删除resizable =“false”，并将mx：Canvas width =“26％”放入mx：Canvas width =“25％”。由于DataGrid的宽度比画布宽度大一些px .. – 2012-08-03 09:21:01

设置数据网格宽度= 350。如果您不想要水平滚动条，请将其设置为360

来源

2012-08-07 20:30:48

需要滚动条，这就是为什么我演示与父母尺寸较小。 – Lalit 2012-08-13 11:32:58

只有在出现水平滚动条时才会出现此问题。否则网格会尝试自动调整列宽。 – Lalit 2012-08-13 11:33:49

您正在将数据网格的宽度指定为100％。因此无论每列的宽度如何，它都会占用整个空间。由于您使用的空间少于分配的空间，其余部分仅在末尾添加。因此，请尝试按照您的要求调整宽度

以下是使画布可水平滚动的MXML。并删除Datagrid的宽度属性

<mx:Canvas width="352" height="45%" backgroundColor="red" horizontalCenter="0" 
       verticalCenter="0" id="stuff" verticalScrollPolicy="off" horizontalScrollPolicy="auto"> 
     <mx:DataGrid height="100%" id="dg" dataProvider="{itemAC}" 
        horizontalScrollPolicy="auto"> 
      <mx:columns> 
       <mx:DataGridColumn width="70" dataField="name"/> 
       <mx:DataGridColumn width="70" dataField="quantity"/> 
       <mx:DataGridColumn width="70" dataField="color"/> 
       <mx:DataGridColumn width="70" dataField="size"/> 
       <mx:DataGridColumn width="70" dataField="hasLogo" resizable="false"/> 
      </mx:columns> 
     </mx:DataGrid> 
    </mx:Canvas>

来源

2012-08-10 07:48:44

我已经使用Flex SDK 4.5.1完成了这项工作，并且使项目与Flex3兼容。希望有助于 – 2012-08-10 08:11:06

使父母变大并不能解决我的问题。问题是，当父母更小，并且屏蔽网格更大，以便滚动条出现。那么最后一列的宽度总是比其他的大。 – Lalit 2012-08-13 11:37:23

对于上面给出的代码，如果您将Canvas宽度设置为25％，则所有列的宽度保持相等，但您将得到一个不可避免的滚动条，因为每列的宽度为 – 2012-08-16 05:01:20

不要给所有的宽度留下第一个和你的代码将是类似的。

<mx:Canvas width="25%" height="45%" backgroundColor="red" horizontalCenter="0" 
      verticalCenter="0" id="stuff" verticalScrollPolicy="off" horizontalScrollPolicy="off"> 
    <mx:DataGrid height="100%" width="100%" id="dg" dataProvider="{itemAC}" 
       horizontalScrollPolicy="auto" resizableColumns="false"> 
     <mx:columns> 
      <mx:DataGridColumn width="70" dataField="name"/> 
      <mx:DataGridColumn width="70" dataField="quantity"/> 
      <mx:DataGridColumn width="70" dataField="color"/> 
      <mx:DataGridColumn width="70" dataField="size"/> 
      <mx:DataGridColumn dataField="hasLogo"/> 
     </mx:columns> 
    </mx:DataGrid> 
</mx:Canvas>

问题是在可调整大小=由所述resizableColumns = “假”，在数据网格替换为 “假”。

这一定会解决你的问题。

有@美好的一天.....

来源

2012-08-13 11:06:05

此处我试图演示宽度如果出现水平滚动问题。最后一列总是比其他列宽 – Lalit 2012-08-13 11:35:42

试试这个horizontalScrollPolicy = “关闭”

来源

2012-08-20 07:17:42 Nidhi

我这里也有类似的问题。

解决方案：

额外的空间确实是因为你已经指定DataGrid的宽度= 100％

这与调整应用到多种分辨率很有帮助。

<mx:Canvas id="datagridCanvas" width="25%" height="45%" backgroundColor="red" horizontalCenter="0" 
     verticalCenter="0" id="stuff" verticalScrollPolicy="off" horizontalScrollPolicy="off"> 
<mx:DataGrid height="100%" width="100%" id="dg" dataProvider="{itemAC}" 
      horizontalScrollPolicy="auto" resizableColumns="false"> 
    <mx:columns> 
     <mx:DataGridColumn minWidth="70" width="{datagridCanvas.width * 0.2}" dataField="name"/> 
     <mx:DataGridColumn minWidth="70" width="{datagridCanvas.width * 0.2}" dataField="quantity"/> 
     <mx:DataGridColumn minWidth="70" width="{datagridCanvas.width * 0.2}" dataField="color"/> 
     <mx:DataGridColumn minWidth="70" width="{datagridCanvas.width * 0.2}" dataField="size"/> 
     <mx:DataGridColumn minWidth="70" width="{datagridCanvas.width * 0.2}" dataField="hasLogo"/> 
    </mx:columns> 
</mx:DataGrid>

来源

2013-02-07 08:33:12 Dev

我知道它是未来有点为时已晚。但是，迟到比永远晚。

我有完全相同的问题，我的解决方案是在右侧添加一个空的哑列。它将占用空间，给用户一个小小的摆动空间来调整最右栏的大小。

//add an empty column at the right side 
col = new AdvancedDataGridColumn(""); 
col.width = 80; 
col.sortable = false; 
col.draggable = false; 
col.editable = false;

来源

2014-07-30 21:03:49 user2730125

DataGrid的额外空间

回答

相关问题