topic Re: How to stop the wheel event propagation in ArcGIS API for Flex Questions

How to stop the wheel event propagation

GennadyOster — Sun, 25 Dec 2011 06:46:11 GMT

Hi !

I have the flex application (actually, the modified flex viewer) shown inside the iframe on the other page.
When I use wheel to zoom in/out, and the outer page has scroll bar - the wheel event bubbles to this outer page and it is scrolled.
I'd like to disable the wheel event propagation when the mouse pointer is over map.
Is there simple conventional way to do it ?

Thanks in advance.
Regards,
Gennady

Re: How to stop the wheel event propagation

RobertScheitlin__GISP — Sat, 11 Dec 2021 08:08:03 GMT

Gennady,

Have you tried

evt.preventDefault();
                evt.stopImmediatePropagation();

Re: How to stop the wheel event propagation

GennadyOster — Sat, 11 Dec 2021 08:08:06 GMT

Hi Robert !
Thank you very much for your help, and sorry for delay.

I tried to play with wheel event and reached the 50% of success 🙂 : now I can switch off the wheel action on the map, but I still cannot do it for the browser window.
I played with the event listener parameters (priority, event phase) with no success.
Here is what I did in the index.mxml of the Flex viewer:

<s:Application ......... 
       creationComplete="init();">

......

  private function init() : void{
   mapManager.map.addEventListener(MouseEvent.MOUSE_WHEEL,onMouseWheel,false,0);
  }
  private function onMouseWheel(evt:MouseEvent):void{
   evt.preventDefault();
   evt.stopPropagation();
  }

Am I doing something wrong ?

Thanks.
Regards,
Gennady
P.S. I've used the stopImmediatePropagation too with the same result. Gena

Re: How to stop the wheel event propagation

RobertScheitlin__GISP — Wed, 28 Dec 2011 13:42:26 GMT

Gennady,

To prevent the default browser scrolling requires some Googling and custom JavaScript code as that really has nothing to do with flex.

http://stackoverflow.com/questions/2005339/disable-mouse-wheel-scrolling-while-cursor-over-flex-app

Re: How to stop the wheel event propagation

GennadyOster — Wed, 28 Dec 2011 13:51:40 GMT

Hi Robert!

Thanks. I'll give it a try.
Sure I googled before posting to the forum, but missed this post somehow.

Regards,
Gennady

Re: How to stop the wheel event propagation

DasaPaddock — Tue, 03 Jan 2012 16:26:08 GMT

Here's a similar solution:
http://forums.esri.com/Thread.asp?c=158&f=2421&t=274624#871027

Re: How to stop the wheel event propagation

GennadyOster — Wed, 04 Jan 2012 05:02:48 GMT

Thanks, Dasa !

I've already used the mousewheeltrap solution. For me it has two great advantages: (i) I don't need to deal with "the host Party", 'cause the whole solution is inside Flex application, and (ii) I don't need to deal with dojo.

Nevertheless - thank you very much for your attention and help.

Regards,
Gennady

Re: How to stop the wheel event propagation

IvanBespalov — Sat, 11 Dec 2021 08:08:09 GMT

Gennady, may be this code is not better solution but it works without JS.

1 - We just added MouseWheel.as in to workspace as it is.
2 - in FlexViewer -> ViewerContainer.mxml added:

// inside ViewerContainer.mxml <Script> tag

/**
 * Listen creation complete handler
 */
private function init():
{
   //...
   initWheelEvents();
}

/**
 * Init mouse wheel events listeners
 */
protected function initWheelEvents():void
{
    if (mapManager && mapManager.map)
   {
        mapManager.map.addEventListener(MouseEvent.ROLL_OVER, mouseWheelOver);
 mapManager.map.addEventListener(MouseEvent.ROLL_OUT, mouseWheelOut);
   }
}

/**
 * mouse wheel out handler
 */
protected function mouseWheelOut(event:MouseEvent):void
{
    MouseWheel.release();
}
   
/**
 * mouse wheel over handler
 */
protected function mouseWheelOver(event:MouseEvent):void
{
    MouseWheel.capture();
}

Re: How to stop the wheel event propagation

GennadyOster — Wed, 04 Jan 2012 06:13:18 GMT

Hi Ivan !

Thanks. I'll give it a try a little bit later - even if not to implement, but at least to learn what and how you did it.

Regards,
Gennady

Re: How to stop the wheel event propagation

JohanMeijer — Mon, 11 Feb 2013 13:03:10 GMT

Hi Ivan,

I somehow can't get this to work...? We are using flexviewer 2.4 and I want to disable scrolling for instance here:

http://www.pbl.nl/en/roadsfromrio/trends-in-biodiversity-loss

* So you put the MouseWheel.as in it's own place under com.ru.etcs.ui
* import it in the viewercontainer.mxml
* put the code from your message in the script (for instance: under the import?)

For some reason I get errors on "expecting an identifier before the left bracket" at the init() function?

Thanks for any help!
Johan

Re: How to stop the wheel event propagation

IvanBespalov — Sat, 11 Dec 2021 08:08:11 GMT

fix it

private function init():void
{
   //...
   initWheelEvents();
}

if not success, please show your code (ViewerContainer.mxml as it is)

UPD - working application

Re: How to stop the wheel event propagation

JohanMeijer — Mon, 11 Feb 2013 19:41:12 GMT

Hi Ivan,

Really like the Live train map! Any chance you share some tips on how it works, live updates on AGS services? 🙂

Thanks for the fix, that did it! No more scrolling at http://www.pbl.nl/en/roadsfromrio/trends-in-biodiversity-loss. I thought I had tried it, but browsercaching is also terrible here when debugging flex/flash applications...

To get it to work I also had to add:

init();

to the

private function creationCompleteHandler():void

This is loaded at creationComplete (see s:application at the top of the mxml)

Thanks,
Johan

Re: How to stop the wheel event propagation

IvanBespalov — Tue, 12 Feb 2013 12:57:11 GMT

I thought I had tried it, but browsercaching is also terrible here when debugging flex/flash applications...

Find
C:\Users\User Name\mm.cfg (if file doesn't exist create it)
How to change flash player debugger configuration file