How to Dynamically adjust PopUp Size Based on Screen Size

How to Dynamically adjust PopUp Size Based on Screen Size

  

Hi!


How can I set a PopUp to automatically resize based on the screen size. That is, I want it to always only take up 90% of the screen of the user regardless on if he is using a 1920x1080 or a 1280 x 720 screen.


Thank you!

Is this for Web or Mobile?

For Web. But I may need to learn to do it too in Mobile in the future.

It may not matter... but... what kind of Popup?  E.g. is the Popup a Widget... Popup Editor or Popup Info Balloon or Layout Popup?  I'd just like to try to duplicate what you're working with.  If you could post a simple sample oml that would be great.

Hi!


I attached the oml file. I want the pop up that appears when you click the link to scale based on the width of the user's browser window.


Thank you.

Thanks for the oml.

I can see how to get this done... but I cannot quite put the pieces together.

In your HomeScreen I created 2 Local Variables... popupWidth and popupHeight.  I gave each a default value of 500.  I then added 2 Input Widgets and tied them to the Local Variables.  The Input Widgets can be hidden later.

In your Popup_Editor, I set the WidthPx and HeightPx to these 2 Local Variables.

Now, when you run the app your popup will be 500 x 500.

Here's the part I'm stuck on.  How to set the value of popupWidth and popupHeight at runtime.

I've added a Preparation Action to the HomeScreen.  Here I'm calling a RunJavascript Action which calls a Javascript function named getScreenSize.  getScreenSize is defined in the HomeScreen Javascript property.

There are lots of ways to get a screen size... and I've included a few in the Javascript function.

The Javascript function then sets the values of the Input Widgets... but those values don't get through to the Local Variables... and so... do not get through to the Popup_Editor.

Have a look... maybe you can spot something I've missed... or someone else can jump in and set things right.  Maybe this isn't a good way to accomplish this... but it seems ok.

 

I checked what you did. So far I understand the flow. I played around with it but I can't get the values from the input widget to get passed on to the local variables during preparation to set the width of the popup. I have tried using "Assign" but it wouldn't get the values in the input. I can't see what you may have missed.

But anyway, thank you.