Help with layouts needed

I am using a template I found a while ago created by kerguelen which you can get from here:

The template automatically adjusts the size of the document to the size of the window (see head html for details) and what I like about it is that when it resizes the document it is maintaining the same aspect ratio.

The only problem is that when I added two layouts (one for a phone and another for a desktop) now when I launch the document the document appears really big. However when I start resizing the browser window the document starts adjusting to the right size as expected.

I noticed that when adding layouts the Initial Scale 1.0 setting is enabled and cannot be changed, Is this what is creating the problem? How would I fix this.

Any help with this is greatly appreciated.

example.zip (1.3 MB)

It's a bit simpler and might not fit but it also has a fullscreen option in it. It still is called "...Kit" but I since stopped the notion of making "...Kits". Must rename this one day: maybe Hype Layout Helper

If it doesn't fit your needs ignore this post. If I'd use this I would lock the layout and then go fullscreen to avoid layout switching while in fullscreen.

1 Like

I think the multiple layouts are affecting the viewport size, and the content doesn’t scale appropriately.

One solution is to use Hype’s Flexible Layout system. If you set the width/height scale to 100% on both scenes, and then use the flexible layout controls to scale and zoom contents on a parent group, it should react appropriately. (In this case you can delete the head code which did this effect).

example-flexible-layout.hype.zip (1.4 MB)

1 Like

Hi Jonathan

Thanks for sharing this. Yes I came to conclusions that it is probably much easier to use the flexible layout options instead of all that code in the head html which I don’t even entirely understand.

Best Wishes
Greg

1 Like

Hi @jonathan,
thanks for improving the full screen system !

1 Like