This is a read-only archive of the Framer Community on Facebook.

What is Framer? Join the Community
Return to index
Patryk Adaś
Posted Jun 23 - Read on Facebook

ha, I think that would be the last struggle to create my very first project in framer:

I am trying to re-create the attached grid.
Basically, after trying to figure out the proper way I thought about creating one row with random number of elements (cells), elements also have random width (50,300) and they are side - by side with the same margin amount.

columns = Utils.randomNumber(2,5)

for index in [0...columns]
/// cell = new Layer
////// height: 50
////// width: Utils.randomNumber(50,300)
/// cell.style =
////// "outline": "1px solid red",
////// "margin-right": "50px"

Of course, it's not working and I dunno why.

I thought also messing with x position, but I can't get this right, as it'd be dependant on width of the element, which is random.

Then I'd just copy the row, code quality may be poor, but It'd be working properly at least.

4 Comments

Trevor Phillippi

is this helpful? Are you trying to basically lay them out adjacently to one another? http://share.framerjs.com/7ehfyqt3fwob/

Patryk Adaś

oh my! yes! thank youuu

Yes, I was trying to lay them next to each other and create a row out of it, afterwards create another row and so on, unless there is a way to do it simultaniously - the most important thing about this is the fact that this grid is irregular, but row - spacing is.

Is there a way to also create rows within one loop?

Trevor Phillippi
Patryk Adaś

that is sooo awesome, i owe you a beer; where did you learn using it so well?

Read the entire post on Facebook