TListView collapse stuff under a header

[Sherlock 663]

So I built a list of data grouped by devices where this data came from. Each device gets his own header in a TListView followed by its data. Pretty simple and straightforward. Now those lists may get long in total but also per device so I would like to be able to click on a header to collapse its list of data. I'm pretty sure VCL.TListView can do that. FMX.TListView...not so much. At least not that I'm aware of. I'm already having a hard time at getting the click event from a header. All TListViewItems with Purpose set to TListItemPurpose.Header sadly wont fire the OnItemClick event.

Did I overlook something or other in the documentation? Anybody have a suggestion as to how this can be accomplished. Thanks in advance.

[Rollo62 536]

Do you mean like that ?

https://community.embarcadero.com/blogs/entry/adding-headers-to-tlistview-programmatically

 

This is done via TListItemPurpose.

[Sherlock 663]

I know how to populate a TListView, I just can't figure out how to collapse all entries for a header. Here is a mock up of what I mean:

Clearer now?

[Rollo62 536]

Maybe be toggling the Visible flag for all entries from below the "Clicked" Header item to next Header item ?

Certainly not nice, I know, but I think there is no grouping function included in FMX.ListView AFAIK.

Not sure howto force Headers to fire events.

Edited December 5, 2018 by Rollo62

[KeithLatham 5]

I use an FMX ttreeview with no problems. Collapse/expand on clicking is part of the base functionality, you don't have to do anything special.

 

Programming it is probably a bit trickier, just like in VCL (but different I suppose).

 

For manually doing it with mouse clicks, there are little hot spot triangles next to the node text. Click on the triangle to expand/collapse.

 

Your sample doesn't show the hot spot triangles. I don't see, off hand, how to turn them off/on.

[Rollo62 536]

Yes, TreeView would be a natural choice for tree-like structures.

But in FMX the TListView is especially recommended to be used on mobile, and it is therefor probably better supported/tested

than the other, more desktop-related components.

The difference could be visible maybe if a lot of items should be loaded, not sure if TreeView is performace-wise at same level with ListView.

So if TreeView works well for you, its perfect, I would always have a look at ListView first, before moving anywhere else.

[Sherlock 663]

I agree with @Rollo62. The TreeView is a bit cumbersome on mobile devices. I have sidetracked this issue for now. As soon as I come up with a solution I'll post it here.

[KeithLatham 5]

Um, I misread your tListView as tTreeView.

 

I think the problem you are experiencing is exactly why I chose tTreeView for my project.

 

Mea Culpa.

[Serge_G 87]

Well, sorry if it's too late, i saw this post today.

"Yes you can" , playing with the ItemHeight, alas this height is an integer and can't be lesser than 1 (0 => default size) so you will obtain a gray gap more or less high depending on items count in the group  

I explain how in this blogpost (sorry french only)

Edited November 28, 2019 by Serge_G