I would like to create container components, that are independent from their content. Is this possible?
I defined a Screen component that has one or more Section child components. The content of Section can be anything. On the screenshot the content is an Article component. On the second artboard I wanted to reuse Screen, and show a list of items within (instead of Article). I couldn’t do that, since changing the content changes the other instance too.
Hi @g.vajda: Subform doesn’t have anything like the containers you’re describing — it sounds like you are trying to have a way to give multiple elements the same specific “screen” size?
You can reuse styles across many different elements (components or regular elements) by using style classes, but for properties like size are defined on a per-element basis and cannot be shared between elements.
The only way to share layout properties is via the component system, but that’s only for when you have multiple instances of “the same” component — which is not what it sounds like you’re trying to do here.
Does all that make sense?
Hi Kevin, thanks for your reply!
It is not the size that I’d like to change – it is a responsive concept (my screen shot is a bit confusing). I am trying to give multiple elements the same style (in this case background colour, “margins” and layout), while having different content within them. I would like to create a component hierarchy where child components can be different across the instances:
1) Screen -> Section -> Article
2) Screen -> Section -> Index
3) Screen -> Section -> Form
…
Something like this:
Ah, yes. I understand.
Ryan and I debated whether or not to allow layout properties to be reused via classes, but we decided it’d be too confusing and hard to understand.
(We weren’t sure how it should work ourselves, let alone how communicate those semantics in the UI.)
There is no way to do what you’re trying to do within Subform, you’ll have to just duplicate the layout settings manually.
Thank you Kevin!
For me it would be clear to have an “is container” switch on the components (maybe within the tree panel). If that’s on, the children below would not be part of that component, and so when I insert a new component instance the children would not be included.
I don’t know if this would be convenient for others too, and of course I have absolutely no idea how it fits into the system you are working on. I am a front end developer, working on design systems, and my approach is that everything on the screen is component, including layout elements.
I have just started playing with Subform, so I still need to learn its way.
