Open Popup Window
Creating a Popup Window
In order to open a popup window, you first have to create a Popup Window. You can add a popup window to any folder in the Designer.
In this example, a Popup folder already exists so we will right click on the Popup folder to create a new ‘Popup’ window. Right click on the Popup window then rename it to ‘Popup’ or give it an appropriate name.
You can make the popup window as big or small as you want. You can also set properties in the Property Editor by making the window Closable, Resizable, and giving it a Title. You can even setup the Border or Title Bar to show-up on the window.
Once the window is created, you can open up the popup window from any other window. You can use a button, a label, an image or any component you like to open up a popup window.
This example opens a popup window from a Main Window using a Button component. In any Main Window, drag a Button component from the Component Palette to your window. Do a slow double click on the word ‘Button’ or select the Text property and change the text to ‘Open Popup‘.
Now you need to tell the Open Popup button what you want it to do when you click it. Select the Open Popup Button, right click and select Scripting from the dropdown.
The Component Scripting dialogue box will open. Select actionPerformed, and click the Open/Swap then Open and Center options on the Navigation tab. From the Window dropdown box, set the window path to Popups/Popup. Click OK. Save and Publish your project.
Open your Client and click the Open Popup button on your Main Window. It opens the Popup window which you can move around, make it bigger, and close it.
Another behavior of the Popup window occurs when you open up the popup window and click on your main window (in this example, Main Window 4). It looks like the popup window disappears, but it’s actually behind your main window. Go to Windows on the menu bar and click Popup to bring the popup window back to focus. The Windows Menu will show you all the open windows in your Client.
Popup Window Properties
There is a property on the popup window that will force the popup window to stay on top of the Main Window. In the Designer, click on your popup window in the Project Browser (not the Root Container). Go to the Property Editor and click the Layer property. The higher the Layer number, the more on top it will be. If your 'windows’ Layer properties are all set to 0, they are all going to share the same layer. They can go back and forth over each other. If you set the Layer number to 1, the popup window will always be on top. Save and Publish your project.
After you update the Client, you will see your popup window on top.
It is also possible for you to open and set a specific location where you want the Popup window to be located. In Designer, click on your Popup window and go to the Property Editor. Click on the Location property and set to X to 300 and Y to 300 pixels.
Go to your Main Window, double click Open Popup Button to open the Component Scripting dialog box. Uncheck ‘and Center’ so your popup window will automatically open up in that specific X and Y location setting.
Save and Publish your project. In your Client, click the update bar, and then click on the Open Popup button. The popup window will open at the X 300 and Y 300 location setting instead of opening in the center of the screen.
