I’m trying to show my students how a data viewer list is just a list of repeated elements. To do that, I used to use Columns in Snap To Place.
But I’m unable to do so in Drag and Drop using Groups.
When I click on “Any Component” block, I don’t get the option of “first in” or “last in”.
The only options are exact positions. This will not achieve the intended ordered list of new elements.
Hello @choprarishabh1010199 
Welcome to the community! 
You can do that in Drag and Drop using Layout.
After you add a layout component you can clone the component inside the containers.
Hi @ioannis, thank you for helping me with that, but my use-case is still not quite possible. You can view my snap to place project here.
However, I’m unable to implement the same functionality in Drag and Drop.
The main issue: Snap To Place allows cloning an element, and placing it as “first in” to another element. In my case, I was able to clone the top text, and place it as first in, to my meme clone object. Similarly, I was able to clone the bottom text, and place it as last in, to my meme clone object.
However, in my drag and drop interface, I only have the option to clone in layout, as first in: I’m unable to clone directly “as first in”.
I know there are easier ways of making a list, but this is for a class I’m conducting. This introduces the concept of Lists and For Loop. I’m trying to show students how you can loop over a list of items, and clone objects to create a feed of elements.
Why won’t it work to clone a component as “first in” a layout? That’s how you should be using clones. You can clone a component or a container.
The main reason might be cause I want to clone the labels “as first in” to my component, not my layout.
Snap To Place allowed cloning and placing the components as first/last into another component. But it seems like Drag and Drop only allowed cloning and placing the component as first/last into a layout, not another component.
Here’s my Snap To Place Code:
And Here’s my Drag and Drop Code:
The major difference is when I try to clone the TopText and BottomText in both.
In Snap To Place, I’m able to clone the TopText as first in the clone (meaning the Meme Container) itself. Then, I’m able to clone the BottomText as last in the Meme Container itself. Therefore, I’m able to have the following UI rendered when opening the app:
However, in Drag and Drop, I’m not able to clone as first in the meme container. It’s only showing the possibility of cloning the toptext/bottom text lables in layout, as first in. That causes the problem when I view my app, as it’s trying to clone the labels as first in the overarching layout, and not within the meme container.
Please let me know where I’m going wrong here.
I’m a little confused because it seems like you’re using the word “layout” to mean the screen. The layout component can have containers inside it and you can definitely clone either the full container inside a layout or the individual components inside a container.
Sorry if I’m not understanding.
You may need to explain things with detailed examples. The screenshots don’t mean much to me because you’re used to looking at them and know what you want and I don’t.
That makes sense. The main challenge I’m facing is that in
In Snap To Place, I can clone a component as first in or last in an another component.
However, in Drag and Drop, the only available options start with in layout,…
Goal: I want to clone the meme container, and then clone Top Text label as first in the meme container, and then clone the Bottom Text label as last in the meme container.
I added comments to my code in red. The main pointer of comparison is point 6 (highlighted).
I hope it’s a bit more clear now. I’m not getting the option to clone a component as first in another component. I’m only getting the option to clone a component, as first in layout, ….
Please let me know how I can help make my question clearer. Thank you for much for taking the time to help me with this.
I really want to make this project. It’ll be fun for students to make memes and learn about lists and for loops while at it.
