I have created a custom component, added a label, added a property, and linked the property to the label text using data binding. When I add the custom component to a new form and set the property, the label text is updated as expected at runtime, but it is not in the IDE.
Is it possible to execute some code at design time (and I would be responsible for writing that code) or automatically resolving the data binding inside the IDE (and this would be a feature request for the Anvil team)?
I’m bumping this topic because I’m running into the same issue.
I created a sample app to illustrate.
https://anvil.works/build#clone:T6GU34QGIVJ6GA5N=QFA7NMYBBUEAGS6QZE4CQXGG
In this example, my custom headline component displays the default text “Headline” and “Sub head” in the designer instead of the value of the property. It does display correctly when the app is run.
How do I make this component play nicely with the designer?
Bumping this as well - I need to be able to change a label’s text on a custom component according to a property value, as I may have many of them on a page.
I actually thought this used to work, but I guess not.
If I have a custom component that has a label called “label_title” and I set the value to “First Name” in the UI, when I look at the custom component on the screen, I’d like to see the set value of “First Name” rather than “label_title”
I can’t explain how, myself, but @stucork has achieved this for some Anvil Extras components:
I guess it has something to do with this code: anvil-extras/js/designer_components at main · anvilistas/anvil-extras · GitHub
Anyway, this is not a substitute for Anvil just making this work automatically, but it’s technically possible already if you want it badly enough.
I would love to see Anvil dynamically update the Custom Components in the designer as well. This is something I have found somewhat frustrating too, because it makes visually laying out my forms more difficult. Also, I would love to see the ability to have a drop down selector for properties in a Custom Component (i.e., instead of having to type in “small” for spacing_below, we could have a selection similar to native components).
Yeah, I’m calling this Feature Request complete – now that we’ve released new designer beta, every custom component is dynamic in design mode!
Thank you for wasting my next week!!
Now I need to review all my custom components.
This is going to establish a whole new set of best-practices for Custom Component design and implementation. For example, in_designer: where, when, why, and how it should be used. There might be a boilerplate (or several, for different facets or features) for Custom Components.
