BUTTON FAILURE bug, depending on BROWSER ZOOM

[attachment=0:3g5myb7a][/attachment:3g5myb7a]Problem Description

____ A concise description of your problem here ____

There seems to be a subtle BUG that makes BUTTONS NOT WORK if your BROWSER ZOOM level was set to something less than 100% when your layout loads. It only impacts buttons in certain areas.

Attach a Capx

____ Upload a Capx to this post ____

[attachment=0:3g5myb7a][/attachment:3g5myb7a]

Description of Capx

____ Concise description of what this CapX does ____

This VERY SIMPLE program puts TWO BUTTONS on the screen and plays a SOUND when you click either one. If you run this, it should work fine, both buttons appearing as they should and working to play the sound.

BUT... if you use CHROME and you have your BROWSER ZOOM set to a value that's below 100%, things start to get really weird. Set it 90% and run the layout and the button on the right SHRINKS! Set it to 75% and run the layout, and the button on the right DISAPPEARS! In fact, for anything less than 90%, that button on the right goes away. (For zoom more than 100%, nothing bad happens).

As for the button in the middle, nothing bad happens. This is because the BUG only applies to BUTTONS that are on the FAR RIGHT, or buttons near the BOTTOM EDGE of the layout.

Steps to Reproduce Bug

• Set Browser Zoom to 100% and run the layout. Both buttons work. (Use Chrome)
• Set Browser Zoom to 90% and run the layout. One button SHRINKS for no reason.
• Set Browser zoom to 75% and run the layout. One button DISAPPEARS for no reason. Observed Result ____ What happens? ____ Buttons near the RIGHT EDGE and/or BOTTOM EDGE are being impacted by BROWSER ZOOM's lower than 100%, but it's only the zoom level set before you run the layout that causes the problem. you can't change the zoom during the running of the layout to see any problems. I'm pretty sure, that for N% zoom, any buttons that are more than N% of the way towards the LEFT of the screen, or N% of the way towards the BOTTOM of the screen, don't work. Thus for 90% zoom, 10% of the screen's left and 10% of the screen's bottom, have non-functional buttons. Etc... For ZOOM's greater than 100%, there is no problem. Note - the ZOOM level only makes a difference when the program LOADS. After the program is running, you can change the zoom all you want, and it won't impact the buttons. This means you can't get buttons to work after the fact by changing the zoom. Expected Result ____ What do you expect to happen? ____ I expect all buttons to behave the same, regardless of where on the screen they are. I expect buttons to work, regardless of what Browser Zoom a user happens to have set. Affected Browsers
  • Chrome: (YES)
  • FireFox: (Have not Tested)
  • Internet Explorer: (Have not Tested) Operating System and Service Pack ____ Your operating system and service pack ____ Windows 7 Construct 2 Version ID ____ Exact version ID of Construct 2 you're using ____ Latest Version.

Anyone find a way to handle this bug?

I worry that it's a real barrier to having deployable/professional games that use buttons. As it currently stands, any users who happens to have their browser zoom set to something less than 100% when running the game could easily have non-functional buttons on certain portions of their screens.

This bug effects DROP DOWN MENUS too. This makes it a much bigger problem because BUTTONS can be avoided by just using "CLICK OBJECT", but there's no easy fix for DROP DOWN MENUS.

Basically, if you use DROP DOWN MENUS and if a user has their BROWSER ZOOM set to less than 100% when the game starts up, your menu might not appear. It depends on where the menu is on the screen and what the zoom level is, but the further away from 100%, the larger portions of the screen fail. It's a bad problem.

Also, you can't avoid it by creating the menu object AFTER loadup. Same problem happens.

Anyone have a solution?

I have the exact same problem.

Loading at 100%, zoom to 75%, the mouse position works correctly.

Loading at 75%, mouse position doesn't work, isn't correlated with the object positions.

UPDATE: this BUG impacts TEXT INPUT as well.

If you have a TEXT BOX that is intended to collect input from a user, it may simply fail if that user has their BROWSER ZOOM set to something less than 100%.

The failure depends on the placement of the INPUT TEXT BOX on the screen and the actual ZOOM SET, but if the box is near the bottom of the screen, or the right side of the screen, the failure is almost certain at any zoom below 100%.

The failure has been observed in both CHROME and Internet Explorer, so it's not browser dependent.

I can't reproduce on Chrome, Firefox or IE here. The buttons stay the same size and in the same place. Browsers have adjusted how they handle zoom in recent releases, so perhaps this was fixed by the browser vendors.

Reopening to investigate issue happening when zoom is altered upon the layout loading.

I found an issue where if you zoom out very far (say 50%) then in some cases the control could be cut off or disappear. I couldn't see that it had anything to do with reloading the page with an already altered zoom level. I fixed that issue for the next beta and verified form controls appear OK at both very low and very large zoom browsers both after changing the zoom and after reloading the page with an altered zoom level across Chrome, Firefox and IE11. Hopefully that resolves this issue from the next beta. Please file a new issue if you still have problems from r189+.

Hi Ashley,

We're on the same problem, using latest Chrome & latest Construct2 195. If Chrome zoom is 90%, then the game loads with wrong mouse triggered positions, progress bar positions.

The problem doesn't appear if zooming is after loading.

UPDATED: the BUG happens when Full Screen in Browser set to : OFF

Pm'ed you our game url. Sorry I couldn't send you PM.

Best,

I've been having this same problem and have fixed it by setting "Use high-DPI display" to "No" in the "Configuration Settings" property of the project. I was noticing in the preview that with "Use high-DPI display" and "Fullscreen in browser" set to "Off", the whole frame seemed to have shrunk inside the already shrunk viewport, so essentially things were being rendered smaller and in different positions to where they should be, leading to the unable-to-click-things bug.

My test project where I had a sprite follow the mouse looked like this, when my mouse was actually over the whale: