Question

我已经在我正在从事的项目中实现了开源ControlsFX TableFilter。

如果查看文档，您会发现没有图标可以让用户知道某列有一个过滤器选项。相反，您必须右键单击列标题才能激活过滤器功能。显然，就可用性而言，这并不是最好的方法-必须明确告知用户右键单击将激活过滤器功能，否则他们不知道。

我的问题是，是否有一种方法可以为将激活TableFilter的每个列标题实现一个图标按钮？一个示例就是project。

您会注意到，使用此实现，沙漏图标会清晰地显示给用户。但是，该项目不包含过滤器所需的任何幕后逻辑实现，而ControlsFX则负责所有这些工作。如果有一种方法可以将GitHub项目的样式栏标题沙漏图标添加到ControlsFX过滤器，我将不胜感激。非常感谢！

Answer 1

注意：这不是问题的完整答案-只是关于如何挂接到controlfx TableFilter的简短注释！

问题中的任务是修改controlsfx TableFilter，使

每列都有一个可视元素，表明它是可过滤的
激活该视觉元素应打开过滤器以允许用户输入

默认情况下，该列没有指示器，并且通过右键单击标题打开过滤器面板。

我的第一个主意-使用按钮作为图形并在其动作处理程序中开始过滤-事实并非如我所期望的那么简单：TableFilter似乎没有任何API可以访问列过滤器或触发/开始过滤以编程方式（或者也许我根本没有找到）。

利用实现细节，即在列的contextMenu中显示了过滤器ui，动作处理程序中的工作方法类似于

找到TableColumnHeader（又名：表示列的可视表示形式的区域）
找到该区域的屏幕坐标
打开列的contextMenu

下面的代码段是fx8的PoC（内部对fx9的更改确实很大！），可以通过复制到FlightTable示例中进行测试：

Button filterButton = new Button("Y");
filterButton.setOnAction(e -> {
    TableHeaderRow header = ((TableViewSkin<?>) table.getSkin()).getTableHeaderRow();
    TableColumnHeader columnHeader = header.getColumnHeaderFor(flightNumCol);
    Bounds localBounds = columnHeader.getBoundsInLocal();
    double xl = (localBounds.getMaxX() - localBounds.getMinX()) / 2;
    double yl = localBounds.getMaxY();
    Point2D p = columnHeader.localToScreen(xl, yl);
    flightNumCol.getContextMenu().show(table, p.getX(), p.getY());
});
flightNumCol.setGraphic(filterButton);

实际上不起作用：TableFilter使用该图形将一列标记为已过滤。我们可能会抓住该图形并在其上挂上鼠标处理程序以允许打开过滤器ui ...但从UX角度看，这很糟糕，因为会有一个具有两个角色的图标...

将图标按钮添加到ControlsFX TableFilter的列标题中

1 个答案: