Skip to main content
Known Participant
July 28, 2022
Answered

Animate Canvas : Swipe problem on Touch Device

  • July 28, 2022
  • 1 reply
  • 1256 views

Hi there,

I have a probleme thi Swipe in touch devices. It's work well in Desktop (Swipe with Drag, Hold, Drop...).

Here the test : https://clientes.or-design.org/testSwipe/

If anyone has an idea that would be great!

Thanks,

    This topic has been closed for replies.
    Correct answer kglad

    Hello,
    1. I know well that there are no Adobe people :), was a joke.


    2. But you managed to make it work?
    I use well createjs.Touch.enable(true); ... And nothing.

     

    If you saw the error, if you managed to make it work, I want you to tell me how to do it, it would be very nice 🙂

    Thank you in advance for your precious help!


    for the third time use createjs.Touch.enable(stage, false, true); 

    1 reply

    kglad
    Community Expert
    Community Expert
    July 28, 2022

    1. there's no menu1 one in your first frame

    2. do you have createjs.Touch.enable(stage, false, true); in your code?

    Olivier-RAuthor
    Known Participant
    July 28, 2022

    Hi kglad,

    1. I don't understand this answer.

    2. I have createjs.Touch.enable(true); 

    And the buttons works but swipe not...

     

    This is my code on the first frame:

    var _root = this;
    
    var page0 = new lib.mc_page0();
    _root.mc_pages.mc_pageloader0.addChild(page0);
    var page1 = new lib.mc_page1();
    _root.mc_pages.mc_pageloader1.addChild(page1);
    var page2 = new lib.mc_page2();
    _root.mc_pages.mc_pageloader2.addChild(page2);
    
    
    
    
    _root.testBT.addEventListener("click", testLocation.bind(this));
    function testLocation(){
    	//console.log(_root.mc_pages.mc_pageloader0.name);
    	_root.mc_pages.mc_pageloader0.page0.gotoAndPlay(1);
    }
    
    _root.start = function()
    {
    	/*createjs.Touch.enable(true);
    	stage.mouseMoveOutside = true;*/
    	stage.dragTolerance = 10;
    	pages = _root.mc_pages;
    	pages.index = 0;
    	pages.transitionDelay = 350;
    	pages.transitionEase = createjs.Ease.quintOut;
    	pages.on("mousedown", _root.mouseDownHandler);
    }
    
    _root.mouseDownHandler = function(e)
    {
    	e.currentTarget.pressedX = e.currentTarget.x;
    	e.currentTarget.pressed = true;
    	e.currentTarget.offsetX = (e.stageX / stage.scaleX) - e.currentTarget.x;
    	e.currentTarget.on("pressmove", _root.pressMoveHandler);
    	stage.on("stagemouseup", _root.stageMouseUpHandler);
    }
    
    _root.pressMoveHandler = function(e)
    {
    	e.currentTarget.dragDistance = pages.x - e.currentTarget.pressedX;
    	e.currentTarget.x = (e.stageX / stage.scaleX) - e.currentTarget.offsetX;
    }
    
    
    _root.stageMouseUpHandler = function(e)
    {
    	if(pages.pressed && Math.abs(pages.dragDistance) > stage.dragTolerance){
    		if (pages.dragDistance > 0 ){
    			pages.index--;
    			}
    		else
    			pages.index++;
    		
    		pages.index = Math.min(Math.max(0, pages.index), pages.children.length -1);
    		//console.log(pages.index);
    	}
    
    	createjs.Tween.get(pages).to({x:-pages.index * (canvas.width / stage.scaleX)}, pages.transitionDelay, pages.transitionEase);
    	pages.off("pressmove", _root.pressMoveHandler);
    	stage.off("stagemouseup", _root.stageMouseUpHandler);
    	pages.pressed = false;
    }
    
    setTimeout(_root.start,10);
    _root.gotoAndStop(0);
    

     

    kglad
    Community Expert
    Community Expert
    July 29, 2022

    There is no solution to this issue?
    Adobe, are you alive?


    1. no one here is adobe

    2. follow directions and use createjs.Touch.enable(stage, false, true); 

     

    p.s. clear your mobile browser cache when testing.