1

I am trying to ‘look’ at my screen in a grid format so I can lay out content based on that grid.

This isn’t strictly a gridlayout like having loads of photos or items evenly split across a screen, but understanding more the sizes and locations I can add surfaces or views.

Grid layout http://www.pandafinity.com/Screen-Grid.jpg

The above image is how I want to view the screen – so I can layout various items, some will span the smaller grid cells, some will be smaller (inside the grid cell), and some will span over multiple grid cells.

How would I create this approach using Famo.us? Can I use the Gridlayout for this or is it best to get the screen dimensions and do some maths to look at alignment and origins?

Thanks again :)

Pandafinity
  • 713
  • 2
  • 7
  • 19

2 Answers2

2

Going to use https://github.com/IjzerenHein/famous-flex.

Next bit is taken from the Github page (Hope Hein doesn't mind) :)

" Flexible, animated and plugable layout-controller for famo.us, which:

  • Smoothly animates renderables between layouts (using physics)
  • Makes it easy to layout renderables (without having to create lots of modifiers)
  • Is shipped with various commonly used layouts
  • Allows you to easily create custom layouts and layout-helpers
  • Is very good at creating responsive designs "

I think its a great approach and helps you split the layout from the renderables.

Pandafinity
  • 713
  • 2
  • 7
  • 19
0

J. Andrew Brassington made such a thing in Famo.us already, similar to Isotope or Masonry if you about know those. He might be one to contact: https://github.com/jabbrass

trusktr
  • 44,284
  • 53
  • 191
  • 263
  • Hi, thanks for replying. I am actually looking into 'famous-flex (https://github.com/IjzerenHein/famous-flex) which looks pretty amazing. – Pandafinity Oct 09 '14 at 08:51
  • Mmm, yeah, that's tasty. It doesn't do the thing masonry does when boxes are different sizes like J Andrew's, but definitely nice and more option-full. Let me see if I can get a link to J Andrew's. – trusktr Oct 13 '14 at 06:42