There is no component that does this within the API of Java FX and Google searches gave me nothing so instead, I created my own.

The concept is the same with tables where rows are grouped and row headers give you the option to expand and collapse them.

For List View, I had to make my own CellFactory in order to make this work. I was surprised that I was able to make one. If this was Swing, it might have been different.

This is how my component looks like.

javafx_listview_withexpandcollapse

 

I created an entity class that contains the title and description. Let us call the class, Note. The class has an extra boolean parameter which I use told hold the state of the title if it is expanded or not. 

 
And this is how I configured my List View

 
For each entry in the list, I used a vertical box to display the contents. When the title is clicked to expand the description, the VBox will add a child so that it will be shown. If it is collapse, it will be removed.

Simple, right? Cell factories are very handy and flexible in such a way that you can render what you want displayed to the user any way you want to.

If you noticed, there is a method called createArrowPath(). That is a convenience method I made to return an SVGPath object to be used as the arrow icon beside the title header. It takes a parameter height which should be the height of the List View

Disabling the collapse event of the JTree is possible by adding a listener to it. There may be times where you want your JTree to be always in expanded mode hence disabling its collapse event is the only way to go.

Add a TreeWillExpandListener to the JTree, make the treeWillCollapse() method throw ExpandVetoException and that should do it.

Most expand and collapse animation code I saw in Android related forums never worked. I think that they probably are limited to just widgets. When the View object itself e.g. LinearLayout has children within it, then those animation XMLs or code to animate them during runtime do not work.

The closest code that worked is from Tom Esterez. He describes it as a dirty hack but I think that it is the only code that is shared publicly that works. However, the code he shared is limited to expanding the ViewGroup.

I modified his existing code to also cater a collapse version. The method returns Animation object.

Feel free to change the animation speed according to your preference. The lower the value, the faster the animation speed will be.

Expand the code area section to view the method in full.

Related Posts Plugin for WordPress, Blogger...