Highlighted

Mobile Click/Touch Event Listener?

Explorer ,
Aug 06, 2019

Copy link to clipboard

Copied

Hello,

I have been trying to get my game to work on both a PC browser and mobile device. My game simply involves the user clicking the screen if the gameobject is within range of its target,  quite simple. However I have noticed when I click with the mouse or press with a mobile device the action only registers when i release/stop touching the mobile screen, this is very detrimental to the game as you have to be rather fast to hit an object.

Currently I have:

this.screen_hs.addEventListener("click", fl_MouseClickHandler2.bind(this));

function fl_MouseClickHandler2() {

     //do action

}

For the mobile interaction i have tried the following with no luck:

createjs.Touch.enable(stage);

this.screen_hs.addEventListener("touchstart", f2_MouseClickHandler.bind(this));

function f2_MouseClickHandler(){

     //do action

}

This code does absolutely nothing!

I was convinced this was the way forward however nothing seems to be working, can anyone point me in the right direction please?!

Adobe Community Professional
Correct answer by JoãoCésar | Adobe Community Professional

Oh I see.

So use the "mousedown" event instead.

Please let me know if it works now.

TOPICS
Discussions

Views

493

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more

Mobile Click/Touch Event Listener?

Explorer ,
Aug 06, 2019

Copy link to clipboard

Copied

Hello,

I have been trying to get my game to work on both a PC browser and mobile device. My game simply involves the user clicking the screen if the gameobject is within range of its target,  quite simple. However I have noticed when I click with the mouse or press with a mobile device the action only registers when i release/stop touching the mobile screen, this is very detrimental to the game as you have to be rather fast to hit an object.

Currently I have:

this.screen_hs.addEventListener("click", fl_MouseClickHandler2.bind(this));

function fl_MouseClickHandler2() {

     //do action

}

For the mobile interaction i have tried the following with no luck:

createjs.Touch.enable(stage);

this.screen_hs.addEventListener("touchstart", f2_MouseClickHandler.bind(this));

function f2_MouseClickHandler(){

     //do action

}

This code does absolutely nothing!

I was convinced this was the way forward however nothing seems to be working, can anyone point me in the right direction please?!

Adobe Community Professional
Correct answer by JoãoCésar | Adobe Community Professional

Oh I see.

So use the "mousedown" event instead.

Please let me know if it works now.

TOPICS
Discussions

Views

494

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Aug 06, 2019 0
Adobe Community Professional ,
Aug 06, 2019

Copy link to clipboard

Copied

Hi.

You can keep the event as click. No need to use touchstart. Mouse events like click will be recognized even in touch devices.

function f2_MouseClickHandler()

{

    // do action

}

createjs.Touch.enable(stage);

this.screen_hs.addEventListener("click", f2_MouseClickHandler.bind(this));

Regards,

JC

__________________________________________
HTML5, JSFL, and AS3 samples: http://bit.ly/2mJgDoG

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Aug 06, 2019 0
Explorer ,
Aug 06, 2019

Copy link to clipboard

Copied

Hey

Thanks for the help. I have tried this solution however I still have the issue with the function being executed on mouse up or 'touch up' on my mobile device?

I am trying to get this to work as soon as the mouse is clicked or on a mobile device when the screen is pressed?

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Aug 06, 2019 0
Adobe Community Professional ,
Aug 06, 2019

Copy link to clipboard

Copied

Oh I see.

So use the "mousedown" event instead.

Please let me know if it works now.

__________________________________________
HTML5, JSFL, and AS3 samples: http://bit.ly/2mJgDoG

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Aug 06, 2019 0
Explorer ,
Aug 06, 2019

Copy link to clipboard

Copied

Thanks my friend you have helped me yet again!

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Aug 06, 2019 1
Adobe Community Professional ,
Aug 06, 2019

Copy link to clipboard

Copied

Excellent! You're welcome!

__________________________________________
HTML5, JSFL, and AS3 samples: http://bit.ly/2mJgDoG

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Aug 06, 2019 0