I am adding some functionality to an app where people can make a post then others can comment. In most online discussion forums, replies are indented from the left to show they are in response to the item above.
I thought it would be elegant to use the same class for both Posts and Comments, but just have the comments indented. So I make a column panel with a couple “reply” icons in the top left like this:
My issue is, when I set self.icon.visible=False (for a Post, not a comment), the image goes away but the left indentation remains. I also tried playing around with self.column_panel.col_widths = ‘???’ but the documentation was unclear what I should put in the “???” to collapse the leftmost columns.
Thanks in advance for any help.
I’m not sure if it helps (or if my understanding of the question is correct), but I needed to make a nested tree-like UI once and I used this general approach (which seems similar to your approach).
Basically, I used a template node and created indentation as follows:
Template node:
The little indentation under the folder icon is provided by a Grid Panel. That is, the content itself is placed in a container that sits inside a GridPanel at some specified location in the grid. I suppose you could use a spacer as well. I believe both of those approaches can give you an indentation width that you could control programatically.
Result:
I just thought I’d share something similar that I worked on. Hopefully I’m understanding things properly.
2 Likes
Awesome- thank you so much @alcampopiano. I think I will implement this- I put together the quick template below if it is useful for others.
https://anvil.works/build#clone:EWHKMRTKUU5JNCPW=5LBNOM2K66N3KFPBNTT4646G
There is one “cheat” I had to use: I copied the same Form and modified slightly for the “children” in the repeating panels. I could not find a way to have Anvil use a Form as the template for a repeating panel within that same Forum. Thus this is not truly recursive (the same code is copied and pasted a few times), but certainly good enough to get the job done.
1 Like
Thanks for sharing a template. It will probably be useful for others as this kind of thing has come up before.
I’m not sure if it helps, but in my implementation, I did not use a repeating panel. Rather, I just had an outer form that contained instances of “nodes” as needed. The nodes themselves could then also contain other node instances. Take care.
1 Like
I use another approach that works when the first item in the template is a label or a link: I set the labe/link role to text (which makes it thinner and which I like more) and add a few spaces in front of its text.
Here is an example of the result:
4 Likes