Table 组件使用指南：设置宽度和高度

尽量不要用绝对值来设置ADF Table的宽度和高度，而应该利用组件的伸缩特性来达到想要的界面效果。

为了能够更好地理解这个问题，首先应该了解一下ADF Table的工作原理。

Table（包括Tree/TreeTable）组件中的符合条件的记录并不是一次从Server端全部取出，而是分批取出，然后展现在Client端。

ADF Table有三个属性与获取和显示行记录有关，它们是：RangeSize，FetchSize，AutoHeightRow。

（1）RangeSize：该值就是Iterator Binding上的属性RangeSize，二者是同一个东西，表示Iterator每次遍历获取的对象数。默认值：25。

（2）FetchSize: 表示Table组件每次从Server端获取的记录数。默认值：#{bindings.JobsView1.rangeSize}，即默认和RangeSize值一样。

（3）AutoHeightRow：表示Table组件显示的行数。默认值：-1，表示不自动设置行数，适用于Table的Container可以伸缩子组件，比如panelStretchLayout。

设置为0，表示与FetchSize值一样，这是最理想的情况，每次从Server端取回多少记录就显示多少记录。

注意，AutoHeightRow的值不能大于FetchSize的值。

如果AutoHeightRow大于FetchSize，比如AutoHeightRow=50，FetchSize=25，那么在页面上显示50条记录就需要从Server端“搬运”两次。

1. 设置宽度

（1）这是默认情况下，Table的显示效果：没有横向占满整个空间，并且列宽也不合适。





（2）为Table组件增加columnStretching="multiple"设置，并设置列宽的百分比例。

最终的显示效果如下：横向占满了整个空间，并且列宽也比较合适。





注意，这里的列宽的百分比是设置在Column的width属性上的，如：width="10%"，百分比作为各个列之间的比例，不一定要总和等于100%。

（3）允许/不允许用户改变Column的宽度。

在RichTable API中有一个方法setColumnResizing(String str)，传入"enabled"表示允许，传入"disabled"表示不允许。

我在Table的属性没有找到这个属性，因此只能通过程序实现，比如：

public void toggleColumnResizing() {
if (jobsTable.getColumnResizing().equals("enabled")) {
jobsTable.setColumnResizing("disabled");
} else {
jobsTable.setColumnResizing("enabled");
}
}

2. 设置高度

为了说明前后对比的效果，我这里拖放Data Control生成了三个组件：Query、Table、Form。

（1）这是最初的效果：Table没有横向占满，并且有一个水平滚动条，很难看。





（2）为Table“罩上”一个PanelCollection，水平滚动条消失，但依然没有横向占满。





（3）为PanelCollection增加属性：styleClass="AFStretchWidth"，PanelCollection横向占满了，但Table依然没有横向占满。





（4）为Table组件增加columnStretching="multiple"设置，并设置列宽的百分比例。

显示效果如下：Table横向占满了整个空间，并且列宽也比较合适。

但还有一个小缺陷：记录数较少时，Table空间中的空白部分比较难看，能不能根据记录数自动伸缩Table的空间呢？





（5）为Table增加属性autoHeightRows="0"，表示与FetchSize相同，我这里就是默认值25。

可以看出记录较少时，Table的空间自动收缩了。





而记录较多时，Table的空间自动扩张了。我这里全部记录是19条，一次全部显示出来了。





（6）当记录很多时，如果你想固定只显示10条记录的空间，那么可以设置autoHeightRows="10"。

可以看出记录超过10个时，右边多了一个垂直滚动条，而Table的显示空间固定为10条记录的大小。