# UMG canvas blocks virtual joystick **URL:** \ **Category:** UI\ **Tags:** Mobile, unreal-engine, joystick, CPP, question, UMG\ **Created:** [January 9, 2016, 2:40pm UTC](https://forums.unrealengine.com/t/umg-canvas-blocks-virtual-joystick/343569 "2016-01-09T14:40:55Z")\ **Posts on this page:** 9\ **Page:** 1
**Author:** ![Problemahtic](https://d3kjluh73b9h9o.cloudfront.net/original/4X/2/8/5/28502927f1d97ba1051b3b47ccfe17233bf41ef0.png) [@Problemahtic](https://forums.unrealengine.com/u/Problemahtic)\ **Post date:** [January 9, 2016, 2:40pm UTC](https://forums.unrealengine.com/t/umg-canvas-blocks-virtual-joystick/343569/1 "2016-01-09T14:40:55Z")
Hello i am using UMG for my mobile project as well as the default virtual joystick that is provided. When i add my GameHUD class to the game, the joysticks can no longer receive input. I have tried playing with the visibility settings (i.e self hit test invisible) but only seemed to stop input to my on screen buttons. Do i need to re create the joysticks in umg or can i use an easier method to simply " click/touch through" the canvas and onto the virtual joysticks. I am doing this project in c++ fyi. ---
**Author:** ![Problemahtic](https://d3kjluh73b9h9o.cloudfront.net/original/4X/2/8/5/28502927f1d97ba1051b3b47ccfe17233bf41ef0.png) [@Problemahtic](https://forums.unrealengine.com/u/Problemahtic)\ **Post date:** [January 12, 2016, 5:11pm UTC](https://forums.unrealengine.com/t/umg-canvas-blocks-virtual-joystick/343569/2 "2016-01-12T17:11:46Z")
this really sucks ---
**Author:** ![Problemahtic](https://d3kjluh73b9h9o.cloudfront.net/original/4X/2/8/5/28502927f1d97ba1051b3b47ccfe17233bf41ef0.png) [@Problemahtic](https://forums.unrealengine.com/u/Problemahtic)\ **Post date:** [January 12, 2016, 5:34pm UTC](https://forums.unrealengine.com/t/umg-canvas-blocks-virtual-joystick/343569/3 "2016-01-12T17:34:47Z")
OOkkk so this is very strange. i added the widget to the screen using HUDWidget-\>AddToViewport(); when i change this to HUDWidget-\>AddToViewport(-15); it actually places the umg widget behind the touch interface …so i guess the default viewport layer for the default touch interface virtual joysticks is like -12 which is weird i personally think it should be 1 - 10. ---
**Author:** ![Haoris](https://d3kjluh73b9h9o.cloudfront.net/original/4X/2/8/5/28502927f1d97ba1051b3b47ccfe17233bf41ef0.png) [@Haoris](https://forums.unrealengine.com/u/Haoris)\ **Post date:** [December 7, 2016, 10:08pm UTC](https://forums.unrealengine.com/t/umg-canvas-blocks-virtual-joystick/343569/4 "2016-12-07T22:08:43Z")
So almost one year later we still can’t use UMG buttons AND virtual joystick at the same time? ---
**Author:** ![anonymous\_user\_bcd0d281](https://d3kjluh73b9h9o.cloudfront.net/original/4X/2/8/5/28502927f1d97ba1051b3b47ccfe17233bf41ef0.png) [@anonymous\_user\_bcd0d281](https://forums.unrealengine.com/u/anonymous_user_bcd0d281)\ **Post date:** [April 7, 2018, 9:06pm UTC](https://forums.unrealengine.com/t/umg-canvas-blocks-virtual-joystick/343569/5 "2018-04-07T21:06:50Z")
It is possible to have UMG widgets behind the virtual joystick. The UMG widget must be added to a negative Z order (such as -20) when added to the Viewport. This will put the UMG widget behind the virtual joystick. The caveat to this is that UMG buttons behind the virtual joystick won’t receive input. The trick I used to get this to work was to split my UI into multiple widgets. I then created and added the widgets to the Viewport separately, manually setting the Z order as I added the widgets. The ordering is: - UMG buttons at Z order 0 - Virtual Joystick at Z order negative something ( Haoris mentioned in this thread the joysticks at at -12; I haven’t confirmed this though) - UMG background widget at Z order of -20 This let me have a background widget behind a virtual joystick **and** UMG buttons, and the UMG buttons are still able to receive input. Note: I did this in Unreal 4.18.3, binary version ---
**Author:** ![Jonry1545](https://d3kjluh73b9h9o.cloudfront.net/original/4X/2/8/5/28502927f1d97ba1051b3b47ccfe17233bf41ef0.png) [@Jonry1545](https://forums.unrealengine.com/u/Jonry1545)\ **Post date:** [June 9, 2018, 3:18am UTC](https://forums.unrealengine.com/t/umg-canvas-blocks-virtual-joystick/343569/6 "2018-06-09T03:18:42Z")
I’ve discovered a solve by setting all aspects of the widget to “Self Hit Test Invisible” and then specifically only setting the UMG widget buttons you intend to be clicked back to “Visible”. This will prevent non-interactive portions of your widget (like vertical boxes and canvas areas) from interfering with your virtual joystick. Using this method, I’ve been setting the Z order of my widget to 0 with no issues with functionality of either the joystick or widget button, even if the button is hanging over the joystick a little bit. Also, to head off the related problem of “Hide All Widgets” permanently destroying your virtual joystick, always make sure to “Activate Touch Interface” and set class to blank, then “Hide All Widgets”, then “Activate Touch Interface” and set class to your virtual joystick. Hope both these tips help you and others. Controlling a combined usage of UMG widget buttons and virtual joysticks seems to pain a lot of people, including me for the past several months, but this solution has worked really well for me since I found it a few hours ago. ---
**Author:** ![Jonry1545](https://d3kjluh73b9h9o.cloudfront.net/original/4X/2/8/5/28502927f1d97ba1051b3b47ccfe17233bf41ef0.png) [@Jonry1545](https://forums.unrealengine.com/u/Jonry1545)\ **Post date:** [June 9, 2018, 3:20am UTC](https://forums.unrealengine.com/t/umg-canvas-blocks-virtual-joystick/343569/7 "2018-06-09T03:20:06Z")
Sorry, just noticed you mentioned yours was C++. My solve is in blueprints, not sure how conceptually transferable it is. ---
**Author:** ![anonymous\_user\_bcd0d281](https://d3kjluh73b9h9o.cloudfront.net/original/4X/2/8/5/28502927f1d97ba1051b3b47ccfe17233bf41ef0.png) [@anonymous\_user\_bcd0d281](https://forums.unrealengine.com/u/anonymous_user_bcd0d281)\ **Post date:** [June 9, 2018, 2:48pm UTC](https://forums.unrealengine.com/t/umg-canvas-blocks-virtual-joystick/343569/8 "2018-06-09T14:48:57Z")
Thank you for posting this solution! This definitely sounds like a better solution than splitting up the UI. ---
**Author:** ![okanerenli](https://d3kjluh73b9h9o.cloudfront.net/original/4X/2/8/5/28502927f1d97ba1051b3b47ccfe17233bf41ef0.png) [@okanerenli](https://forums.unrealengine.com/u/okanerenli)\ **Post date:** [January 9, 2021, 12:55am UTC](https://forums.unrealengine.com/t/umg-canvas-blocks-virtual-joystick/343569/9 "2021-01-09T00:55:22Z")
Don’t put any widget component on stick which is set to visible. I’m actually using a "fake widget on the joystick which is acting like it is the controller and all it’s components are Not- Hit Testable( cosmetic) no problem there . My problem with buttons solved when I use button trigger as pressed, NOT clicked.