AG网格不均匀的列宽

我很努力让我的网格在使用api.sizeColumnsToFit（）时均匀可靠地显示列宽。AG网格不均匀的列宽

我已经配置我的网格当父DIV /浏览器窗口大小调整，以调整列：

this.gridOptions = <GridOptions>{ 
     onModelUpdated:() => { 
      this.gridOptions.api.sizeColumnsToFit(); 
     }, 
     onGridSizeChanged:() => { 
      this.gridOptions.api.sizeColumnsToFit(); 
     } 
    };

这工作，但结果列宽度往往不是参差不齐。请参阅下面第13周的月份的第一天和第二天：

任何建议，以使其更可靠，将非常欢迎。

来源

2017-04-03 TDC

我想你的初始columnDefs有相同的宽度为每列，除了“任务”似乎有“suppressSizeToFit设置为true？与[this plnkr]类似（https://embed.plnkr.co/1aJzknqMbS2LwaSk1R7P/）？ –

Spot on。如果您运行plnkr并将窗口宽度向右再增加几次，然后再增加再次缓慢缩小窗宽，Athlete Age列在所有的宽度上不成比例地缩小其他栏目。这是我想要避免的。 – TDC

这里是一个plnkr为您提供了一个可能的解决方案。从本质上说这里是你能做什么：

var windowWidth = document.querySelector('#myGrid').offsetWidth - 170 - 17, 
// calculate the window width minus any columns you don't want to size for 
    and a little magic number for the vertical scrollbar (17 was for chrome on mac) 

    sizableColumns = gridOptions.columnApi.getColumnState().map(e=>e.colId).filter(e=>e!='athlete'), 
// get the colId of only the columns that you want to resize 

    sizableColumnWidth = Math.floor(windowWidth/sizableColumns.length); 
// calculate the width of each column by dividing the available width by the number of columns 

    sizableColumns.forEach(e=>gridOptions.columnApi.setColumnWidth(e,sizableColumnWidth)) 
// iterate through the columns you want to resize and set their new column width

不过，我想，你可能会考虑很多用户将如何来调整自己的浏览器窗口......不仅如此，但调整更好他们的窗户缓慢多次。检查这些帖子：

http://davidgoss.co/2014/04/15/users-do-resize-their-browser-windows-take-2/

https://medium.com/@stephenkeable/do-users-resize-their-browser-windows-or-is-it-just-developers-and-designers-e1635cbae1e1

这两个职位表明，台式机用户的2％左右的调整他们的浏览器。而更小的部分将会多次缓慢调整浏览器的大小。也许你只是简单地告诉这些1％不要像他们那样调整浏览器的大小，或者允许手动调整列的大小，以便如果他们注意到这种奇怪的行为，他们可以自己调整列的大小。

技术说明：

你的报道行为发生，因为该算法规模列，使其符合是相当复杂的。它考虑到所有列的相对大小并适当扩大它们，所以如果你有4列100,200,100;并调整了窗口的大小，那么中间列的大小仍然是其他大小的两倍。

该算法还将任何剩余的像素都放在第一列，所以如果您有9列和100px以适合它，则8列的大小应为11 px，其中一列的大小为12。列将真正“适合”，并没有留下一些像素未填充的列（如我建议的选项）

来源

2017-04-10 23:14:45

我感谢你的深思熟虑的回复Jarod，我会审查你的建议代码。我同意你的观点，即平衡或许我的方法不适合使用自动列宽，我应该重新考虑使用固定宽度列的设计目标。我不确定这是否应该被标记为已解决或有帮助？ – TDC

AG网格不均匀的列宽

回答

相关问题