Tornadofx表格视图，标题底部的第一行作为筛选字段

Question

我正在寻找一个tornadofx表视图，其中第一行位于标头底部，用作筛选字段。数据从第二行存储到加号。但不幸的是，tornodofx和javafx中都没有这样的ui组件。

我想使用vbox中收集的两个表视图A和B来构建这个组件。A有一个标题，1行有筛选字段，B没有标题，与来自A的筛选字段同步。

问题是我面临一些挑战：

• 隐藏表视图并不容易(有些人使用代码，有些人使用CSS，哪种方法更好？(
• 同步2个表视图(调整列宽，在A中排序ASC/DESC应该在B中发生(
• A中的筛选字段可以是类似Excel的筛选器，并取决于每列的数据类型

你能帮忙吗？

Thks

Answer 1

我使用列标题图形来实现您想要的结果。我不得不说，我很高兴自己弄清楚了这一点，因为它避免了你计划处理的所有复杂问题，比如从搜索中排除第一行，同步两个表，等等。

class Foo(y: Int, z: String) {
val yProperty = SimpleIntegerProperty(y)
var y by yProperty
val zProperty = SimpleStringProperty(z)
var z by zProperty
}

class TestView : View("Hello TornadoFX") {
val list = SortedFilteredList<Foo>().apply {
for(i in 0..10) {
add(Foo(Random.nextInt(0, 100), "Row $i"))
}
}
var column1Field: TextField by singleAssign()
var column2Field: TextField by singleAssign()
override val root = vbox {
tableview(list) {
column("", Foo::yProperty) { //Put column name in graphic so text field will be below label
graphic = vbox(2) {
label("Y Column")
column1Field = textfield()
}
}
column("", Foo::zProperty) {
graphic = vbox(2){
label("Z Column")
column2Field = textfield()
}
}
}
}
init {
column1Field.textProperty().onChange { filterList() }
column2Field.textProperty().onChange { filterList() }
}
fun filterList() {
list.predicate = { row ->
val c1Text = column1Field.text
val c1Filter = if(!c1Text.isNullOrBlank()) row.y.toString().contains(c1Text, true)
else true
val c2Text = column2Field.text
val c2Filter = if(!c2Text.isNullOrBlank()) row.z.contains(c2Text, true)
else true
c1Filter && c2Filter
}
}
}

这只是一个粗略的POC，可能会被简化，但我认为它能让人理解这个想法。我承认这有点冗长，但如果你足够聪明，你可能会制作构建器函数来缩小这个过程。