Layout help for different types

Need help
1

Pay layouts.

I’ve done a lot of development in a lot of different apps and NOTHING has ever been as difficult as Bubble layouts. So. HELP. I asked for support but they keep giving me useless answers pretty much just sending me pages to read that don’t give me the information I need.

I’ve been following along with an online class. It has been great except for the collapse when hidden is not an option. So you can’t use fixed. I tried changing the layout and NOTHING seems to work.

From what I can tell if I don’t use fixed layout for the parent page then I have to either let Bubble bunch up all my stuff in some wierd useless format with row being one item after another or column being one item below another or the more useless option that creates 9 quandrants and forces things into those.

This makes no sense from a development standpoint. It seems that if I use any option other than fixed I cannot drag and drop for placement but must spend a lot of time inputting numbers into numerous boxes to force things to look good on a page.

Am I missing something here? I get that this “responsive” engine is supposed to be a good thing but it seems that designing a page is going to take 10 times longer than any other app builder or software development tool I’ve ever used.

So what am I missing? It can’t be this complicated/difficult to put 2 buttons near the top of the page but NOT at the very top right corner followed by a group with 3 items to choose for filters then another group of repeating rows beneath that displaying the data.

If I use fixed it looks great but the collapse when hidden is not an option with a fixed parent and every other parent I’ve tried isn’t working. So what’s the trick?

I can’t believe you can only put things into rows/columns or quandrants with no control other than figuring the number of pixels for padding, etc.

2

It makes a lot more sense if you’ve actually hard coded html with todays standards, using flex.

most sites are going to be top to bottom, so your first ‘group’ will be a column.

now, lets say you want to display a picture with some text side by side, so you’ll use another group within your column group, and set it as a row.

You’d use this logic throughout your designs.

1 Like
3

I’d say you’re missing quite a lot…

It can’t be this complicated/difficult to put 2 buttons near the top of the page but NOT at the very top right corner followed by a group with 3 items to choose for filters then another group of repeating rows beneath that displaying the data.

It’s not difficult at all, if you understand how FlexBox works (and specifically how it works in Bubble)…

So rather than moaning on the forum about your own lack of understanding, why not spend some time learning how to use it?

I can’t believe you can only put things into rows/columns or quandrants with no control other than figuring the number of pixels for padding, etc.

Of course, if you have some specific questions about responsive design/building in Bubble, then I’m sure someone will be wiling to help, but posting simply to express your disbelief that Bubble wasn’t designed exactly to your own specifications/requirements isn’t going to achieve much.

There are loads of great resources available on this subject, so I’d recommend starting with those…

4

Well thank you for restating the obvious. I said I didn’t understand it and I needed help. Telling me I don’t understand it isn’t really helpful. How about suggesting some good resources for learning this layout because the Bubble documentation isn’t cutting it. Hence why I said I didn’t understand it and I need help.

And I was pretty specific about what I was trying to do. So saying if I posted specific questions you could provide help really isn’t helpful either.

1 Like
5

Ok. So pretty much make group containers for each section and then add in other groups to manipulate/force things where you want them?

Do you know any good resource to give more info on this way of designing?

6

Not entirely, no. Not if it isn’t in the bubble academy thingy’s.

Create yourself an app you can play around with. Just think to yourself, “I need it to go in this direction” and if that direction is up and down, you want column, if it’s left to right, it’s a row. Then it’s just a matter of alignment settings (left, center, right) along with stretch settings (horizontal, vertical).

Once you get the hang of it you’ll be creating apps like a madwoman.

Feel free to share the “playground” app with me, and I can walk you through anything.

7

Thanks. I finally decided the instructor’s way (I’m working through a class to learn how to use Bubble) wasn’t worth the effort. So I just figured out how to use a pop up for the filters, leave my layout as it was, move the filter items into the popup, set the workflows to show the popup, added apply button to hide the popup, then added a clear button on the popup that resets the filter inputs (using a group to do that) and it works much better and I don’t have to muck up my layout just to collapse things when 1 thing is hidden!

I’ll try your layout suggestions when I have more time and start from scratch to see how I can get things where I want them. Thank you!

8

This topic was automatically closed after 70 days. New replies are no longer allowed.