TableView SmartResize

Wiki ▸ Documentation ▸ TableView SmartResize

TableView SmartResize Policy

The JavaFX TableView is a powerful visualisation control used in almost every business application out there, but there has always been one critical part missing: The ability to resize columns intuitively, both by default and through configuration. As a result, many JavaFX applications are missing the polish and accessibility expected from today's business software.

The SmartResize.POLICY tries to bridge this gap by providing sensible defaults combined with powerful and dynamic configuration options.

Usage

To apply the resize policy to a TableView we configure the columnResizePolicy of the table. For this discussion we will use a list of hotel rooms. This is our initial table with the SmartResize Policy activated:

tableview(rooms) {
    column("#", Room::id)
    column("Number", Room::number)
    column("Type", Room::type)
    column("Bed", Room::bed)

    columnResizePolicy = SmartResize.POLICY
}

Here is a picture of the table with the SmartResize policy activated:

The default settings gave each column the space it needs based on it's content and gave the remaining width to the last column. When you resize a column by dragging the divider between column headers, only the column immediately to the right will be affected, to avoid pushing the columns to the right outside the viewport of the TableView.

While this often presents a pleasant default, there is a lot more we can do to improve user experience in our particular case. It is evident that our table didn't need the full 800 pixels it was provided, but it gives us a nice chance to elaborate on the configuration options of the SmartResize policy.

The bed column is way too big, and it seems more sensible to give the extra space to the Type column, since it might contain arbitrary long descriptions of the room. To give the extra space to the Type column, we change it's column definition:

column("Type", Room::type).remainingWidth()

The result is show below:

Now it becomes apparent that the Bed column looks cramped, being pushed all the way to the left. We configure it to keep it's desired width based on the content plus 50 pixels padding:

column("Bed", Room:bed").contentWidth(padding = 50.0)

The result is a much more pleasant visual impression:

These things might not seem like much, but it means a lot to people who are forced to stare at your software all day!

• Reevaluate resize rules after adding content via SmartResize.POLICY.requestXXX

Next: Error Handler