How do I make popup window?

0 favourites
  • 15 posts
  • Hi

    I'm trying to make 2 different Popup Windows.

    1.) A popup opens and can be only closed if you press the "X"

    2.) A popup opens and can be only closed if you click outside of the popup

    (which should be very useful, if you use it on a phone, because it could be difficult to hit the small "X"

    Also the background shouldn't disappear it should be just darker.

    Like others newbies I'm having troubles with the buttons. I searched the forum and tried to use groups, but something isn't working.... :/.(also there are some many versions) Then I tried with destroying the buttons, this worked, but they never come back... Also I found another version with variables, but this seems too be complicate.

    Attached I put a sample with layers (hide/visible) and deleted the groups (because it's anyway not working). Can somebody give me a little help/hint?

    Thx a lot

  • edwardr Use the browser plugin and the Windows- Alert action.

  • Yes, I was thinking about it, but this is only useful for Messages.

    When you have options (e.g. choose "A, B, C or D" or how many % would you like,...) , additional images or variables then you need your own "popup". I will try again today, maybe I'm lucky. Maybe I just have some error in groups,... When I'm finished I will post the code and manual. (help is welcome )

  • Ok, 50% success.

    Everything is working accept the outside button. Even it is deactivated and not in the same layer, it is still disturbing the main buttons. This means there where the outside button is, nothing can be clicked. I added the code so you can see what I mean or you can use the other function.

  • Try Construct 3

    Develop games in your browser. Powerful, performant & highly capable.

    Try Now Construct 3 users don't see these ads
  • Try this.


  • brunopalermo: thx, but in this Version the main button e.g. menu is still active, when the popup (click outside to go back) is still active.

  • Not sure why this happens, I never touched the actions that activate deactivate each group.

    By the way, regarding this... I'd rather check for a variable or for the visibility of layers instead of activate/deactivate groups.

  • By the way, here's a small example I made... I tried to explain everything in the comments, but let me know if you need help with anything.


  • Thank you very much. I will check it now. I thought I could solve it just with layers, but it seems too complicate.

  • brunopalermo: thank you very much. It took me a while to understand each step, but it's logic. I had to rethink and use more variables and functions. Also I tried to use the Spirit as a button. Now I use an invisible button so I can disable and enable it.

  • ok, funny thing. I tried something new and it worked (partly - as usual )

    I just use layers and spirit. No variables and Buttons

    Main Page:

    Icon "Sub2" and the submenu 2 is working. All Spirits are deactivated and are not disturbing the other layers

    Icon "Sub1": All the submenu layer and Spirits within in the submenu are working, also no disturbing.

    Problem: the Icon in Main Menu "Sub1" conflicts with the "Icon 3" of the submenu1. So if you click the upper part it goes direct to submenu1_1 instead submenu1

    I don't see any difference between Sub1 and Sub2. Maybe somebody finds the Problem/difference??

  • edwardr

    Are you tring to create a menu with options and others stuffs? Because I still need to do it as well and I think setting a layer as global and only using groups is enough to build one I guess.

  • I'm trying to do a menu with Options (e.g. what do you want to build/upgrade, ... ).

    If I understand how it works, I would like to include some submenu.


    Player has several icons (buildings/empty spaces).

    Click empty spaces: what do you want to build: Hotel, shop, Airport, Military, ...

    Player choose Military: what do you want to build: Airport, defence, Radar,...

    Player choose Radar: Radar will be build, thank you, go back to menu


    Click building: you choose Radar

    do you want to upgrade, destroy ?

    what do you want to upgrade ?

  • I'm still working on it.

  • Hi,

    I didn't solved all problems, but I found a pretty good one. Somebody mentioned group, so I worked more in this direction.

    I will describe now how to make "windows" / layers and deactivate all other icons using groups, layers, function() and families. (which simplify everything)

    1.) Make a family (e.g. F_Icons) and all the buttons you will to need to go the next window/layer.

    2.) Go to the family properties and add a Family Instance Variable (e.g. ID - text variable)

    3.) Click the buttons in the family and add in the Instance Variable names (e.g. Menu_1, Menu_2, Menu_3,...)

    4.) EVENT: the programming:

    4.a) add a group (e.g. Menu_1) and put all the programming you need

    4.b) add a group (e.g. Menu_2) and put the other programming, and so on...

    5.) LAYER: the design

    5.a) add a layer with the name (e.g. Menu_1) put all the text, images, and whatever you need in it. Check it if its really in the layer (you can see this in the properties)

    5.b) if you use an icon several time in different groups, think about cloning/copying it or start the group to make it visible and end the group to make it invisible (sometimes it happened that I could see the icon (but not use it) in another group, so I cloned it.

    6.) set all layers invisible and groups deactivate

    7.) in the eventsheet put following command:

           Function on Menu: set group"Menu_1" deactivated
                             set group"Menu_2" deactivated
                             set group"Menu_3" deactivated
                             set layer "Menu_1" invisible
                             set layer "Menu_2" invisible
                             set layer "Menu_3" invisible
                             set group Function.Param(0) Activated
                             set layer Function.Param(0) Visible
           on left button clicked on F_Icon:    Call Menu(F_Icons.ID)    (<- add parameter F_Icons.ID)[/code:1lyrlruw]
    now it should work
    for newbies (description): 
    I put all buttons into a family. So I save the programming for each button. On click, open group, hide rest,...
    by adding a ID for each button, I know which button is clicked
    now when you click one button of the family "F_Icon" it opens a function"Menu". (it's a kind of a sub-program, which deactivate all groups and hide all layers at the beginning.)
    by adding the parameter (F_Icons.ID). The ID of the button is send to sub-program and can be used with function.Param(0)  (<- 0 stands for the first variable, you also can you more variables)
    because the ID has the same name like the layers and the groups, I just need to say activate the group with this name and show the layer with the same name.
    I found also other ways, but there are some small errors in it. Don't ask why.
    PS: sorry I don't have now the time to make a sample, but I hope the description will help
Jump to:
Active Users
There are 1 visitors browsing this topic (0 users and 1 guests)