Question

尝试删除最后一列中的额外空格，我试过各种方法没有用，每当滚动条出现时，网格都会以奇怪的方式运行注意最后一列的宽度是70，但不知何故，网格增加了一些额外的空间。

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>

Answer 1

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

这是使得Canvas可以水平滚动的MXML。并删除Datagrid的width属性

<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>

Answer 2

设置datagrid width = 350。如果您不想要水平滚动条，请将其设置为360

Answer 3

不要给所有这些留下第一个宽度的宽度，你的代码就像那样。

<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>

问题出在 resizable =“false”，由DataGrid中的 resizableColumns =“false”取代。

这肯定会解决你的问题。

拥有@ Nice DAy .....

Answer 4

我知道这有点太晚了。但是，迟到总比没有好。

我有完全相同的问题，我的解决方案是在右手边添加一个空的哑柱。它将占用空白空间，并为用户提供一个小小的摆动空间来调整最右边的列。

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

Answer 5

尝试此横向滚动策略=“of”

Answer 6

我在这里遇到了类似的问题。

解决方案：

额外空间确实是因为您指定了datagrid width = 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>

最后一列中的DataGrid额外空间

6 个答案: