ResponsiveLayout?

[stam]

Hi all,

anyone using the new responsiveLayout? The GM has gone the way of the dodo in v10, so I thought I'd look in on it.
I get it's using something like bootstrap's responsive layout for web design, but I'm finding it difficult to bend it to my will

Anyone got any tips/tutorials?

S.

[FourthWorld]

Put things where you want them.

If you need significant change, use screen width as the decision point.

That's pretty much all the rest of the world does.

If you have a particularly complex layout, post a screen shot and we can explore options for it.

[stam]

Put things where you want them.

If you need significant change, use screen width as the decision point.

That's pretty much all the rest of the world does.

If you have a particularly complex layout, post a screen shot and we can explore options for it.

Thanks Richard - I wasn't looking for help using resizeStack - I was just wondering if there are any resources educational resources available for the Responsive Layout library.

Put things where you want them.

That's the thing - with Responsive Layout you can't put things where you want them - I reorganises things as it sees fit, with no obvious order that I can see.

Theoretically using a Responsive Layout approach should be a superior way of laying out stuff for all devices, as you should be able to use this to modify layouts for all screen sizes, from mobile to tablets to desktops. Web does this extremely well, we've all seen websites adapt to phone sizes or desktop sizes with ease - but in my mind I can't find the parallels with web (containers, rows etc), although this is obviously based on that.

I use RapidWeaver for some web design (Mac-only) and it's a doddle to create layouts without that are fully responsive with a similar approach. It's a joy to use and if LC are serious about implementing this bootstrap-type approach, they could do worse than emulate what RapidWeaver does... although that would be a departure from WYSIWYG design.


But back to my original question(s) - I take it the answer is (as yet) 'no' on all counts then?

S.

[FourthWorld]

But back to my original question(s) - I take it the answer is (as yet) 'no' on all counts then?

I see now you were asking about "responsiveLayout" rather than "responsive layout", so if that's a reference to one of the MegaBundle add-ons I haven't used it and haven't had time to become familiar with its specific requirements. I don't even recognize "GM" in that context, so I'm clearly out of my depth with that one.

But if you need to handle layouts that respond to windows of different sizes and ratios, I've been doing that for decades and would be happy to share what I've learned.

The desktop's absolute positioning is indeed in contrast with the web's autoflow, so while each can be done in the other their native representation does pose a challenge when trying to map specifics between the two.

But LC doesn't have CSS anyway, so the good part is we know from the start the specifics can't directly map, so we can leave that behind and just look at general principles.

At the heart of the question is: How do we respond to changes in size and ratio? And the guidance is literally in the palm of your hand right now:

Just rotate your phone. Look at the the apps you enjoy. Take note of how they respond to the change. Do that.

The hard part is making the design decisions; what do we show, what do we tuck away behind a fly out panel, etc.

Look at the apps on your phone, with the features of your app in mind.

No library can make your design decisions, and putting things where you want them is so convenient in a tool as flexible as LiveCode that most of the time once you decide what you want to do, actually doing it will feel easy.

And if any of that part isn't, I'm here for you, and anyone else. I've had simple layouts with just a dozen objects, and complex ones with hundreds, multiple tools, multiple environments, a wide range of challenges, all met.

Happy to help where I can, so my offer to you is as it's been extended to others: post a screen shot of what you have, and at least a wireframe of what you'd like to have, and I can help you get from one to the other.

[stam]

Thanks Richard, very much appreciated.

In truth there is no specific project (I still use GM with version 9.x, with resizeStack where needed in my actual projects).

I was just interested in the new responsive layout library that came with the mega bundle is all, but no matter how much I try I can't get it to do what I want :-/

Well not exactly - I can replicate a lot of the GM stuff fairly easily by anchoring each individual object to window edges (setting it to 'Fixed' and assigning values). But managing groups to behave like containers is just too weird and that's the bit I can't get to work...
What I also don't know is if I share a stack laid out like this with someone who doesn't have the megabundle, will it still work?

Unless I'm being particularly thick (not impossible) I can't see how anyone can just pick this library up and use it without some kind of learning resource to go with it... Oh well, hopefully something will eventually show up...


S.

[jacque]

Let us know if you find any more info. I didn't get the megabundle but was thinking of buying the layout library separately. Any info about your progress would be useful.

[jacque]

I now have the bundle add-ons and was trying to use the Responsive Layout library (which was the main reason I bought the package.) I can't figure out much that's helpful. I have determined that the position offsets refer to the relative edges of the group or card container and they are absolute values instead of card values (i.e., a zero distance from bottom means the control extends all the way to the bottom. Okay, that's easier than figuring out the distance from the top.)

But that's about as far as I got without any documentation. Let's say I want a field that stretches dynamically both horizontally and vertically to fit a certain amount of space, and I want a button 20 pixels from the bottom of the field that does NOT stretch but remains centered underneath the field.

I haven't been able to get the correct properties to do that, which seems to be a common layout feature. If I group the field and button and set it up as stretchable, the button expands to the full width of the field and looks ridiculous. If I don't group them and apply properties to each control individually, I can't align the button under the field because the alignment properties only apply to the card in this case.

Stam, have you had any luck so far?

[stam]

Not really. I can’t help but feel it’s buggy, but that may just be my lack of knowledge. I say that because if I assign properties that I then decide are wrong, even if I return things to default values the object still get pushed around out of my control. In other words I haven’t found a way to remove the rules set by responsiveLayout - but that may just be my ignorance.

The basic settings are kinda ok. You can link stuff to one wall if you want it move if with that. Or two opposing walls if you want it to stretch/shrink. But that quickly gets messy.

The most interesting part for me is the promise of a bootstrap-type auto-layout with “breakpoints” - ie a shift in geometry at certain sizes, kinda the same how a webpage stacks everything in a column on mobile and multi-columned on desktop for example.

Sadly I can’t get it to work. I have asked a few times for tutorials as the lesson on this is fine, but imparts no deeper understanding on how to use this.

So far I’d say it’s more of a promise yet to be fulfilled

So much so that I’ve gone back to using resizeStack. Lots of code, but bulletproof once you get it right…

[FourthWorld]

Where does the developer of the Responsive Layout library provide support?

[jacque]

The developer is unknown, or else it's LC. I've written to support for a way to do the example layout I described above. I'll post here if I get any info.

[jacque]

@stam, all the properties are stored in a custom property set. We could probably delete the set to get back to ground zero. We shouldn't have to of course.

[stam]

Where does the developer of the Responsive Layout library provide support?

No developer given - assuming it to be LiveCode as it's part of the megabundle.
LC published a lesson on it here: https://lessons.livecode.com/m/4071/l/1 ... ive-layout

It's all well and good but does not go into any detail and only touches on a couple of things - there are many more settings which remain a mystery. I raised the need more more documentation/materials in the lesson and it was ackknowledged by Heather... so hopefully at some point...

[jacque]

I've been working with Panos in support and there is a new version coming up that will fix some of the problems. The version that's currently available has some bugs. I'm starting to get a feel for how this library works, but I'm looking forward to seeing the next release.

[stam]

That’s great news Jacque!