This is probably pretty simple, but I don’t know where to look:
I have three columns of material design cards. I also have a button that toggles the visibility of the one of the cards. When I click the default hamburger menu button to slide the default menu to the left, my cards automatically resize themselves. But when I click my visibility toggle button, the card disappears, but the other cards do not resize themselves. Is there any standard way of making the resize automatic?
Thanks!
Hi there.
Could you use a flow panel to hold your cards? The flow panel seems to resize to the updated column spacing automatically.
If I have misunderstood the request, please share a clone link to your application if possible.
Hmm… close, but not quite. I tried your suggestion, and while it does automatically relocate the cards, it doesn’t resize them (specifically, I’d like the remaining cards to be wider, so that there’s more room for users to type after hiding one of the cards).
My cards have the container property “full_width_row” checked. But when I place them in the flow panel, that option is no longer provided. Below is a link to the app, but I don’t think it’s useful, since I don’t have any of the desired functionality added:
https://anvil.works/build#clone:S2TS7IPRJHFHAPGR=GV5DBHGRYMWDE2B6IFBTFJPA
I’d recommend you use GridPanels to cover cases where you’re aiming to resize/rebuild layouts on the fly. They’re much easier to interact with than ColumnPanels, so you wind up with friendlier and more flexible code. @meredydd offered some more context here: Add ColumnPanel Components In Code
I cloned your app and added a GridPanel to resize cards 1 and 2 when the date tree is toggled:
https://anvil.works/build#clone:XIKG7N5HW562HD4V=Z3L5DG4AHBY75Y3OWHXX5EJZ
Here’s how it looks:
Is that what you were going for?
–
Edit: by the way I created a dummy user account for the clone since it was easier than removing the Users service. un: anvil@fakemail.com / pw: 12345. Heads up that sharing your app may share private data as well.
Perfect; that’s exactly the effect I was hoping for. Thank you!
(It took me longer than it should have to realize you had added code in addition to the grid panel.)
Great! Also good point - I wish I’d said ‘added a GridPanel and some code’ to make it clearer. I’m glad you figured it out.
