Forums Développement Multimédia

Aller au contenu

- - - - -

fonction drag and drop pour Android

CODE PAO DETENTE

21 réponses à ce sujet

#1 Yakub

  • Guests

Posté 25 June 2018 - 03:55 AM

Bonjour,

J'aimerai savoir si il existe une fonction similaire a StartDrag(), StopDrag() pour une application mobile ?
J'ai utilisé les Move_BEGIN , Move_END mais cela ne fonctionne pas comme je le voudrais .

J'ai trouvé pas mal de tuto pour deplacer un element mais pour mon cas cela ne fonctionne pas comme je le voudrais, car mon image est zoomable ( avec les 2 doigts ) et donc si je zoom et ensuite je souhaite me deplacer dans l'image avec les fonctions Move_BEGIN , Move_END au click cela selectionne l'image en la magnetisant en haut a gauche pour la deplacer et ce n'est pas le resultat voulu .

Quelqu'un a une solution pour palier a ce probleme svp ?

#2 Yakub

    Ceinture Verte

  • Members
  • PipPipPipPip
  • 66 messages

Posté 25 June 2018 - 10:07 AM

L'idee c'est de faire un peu comme sur abode reader, de pourvoir zoomer sur une image et ensuite de pouvoir cliquer dessus pour ce deplacer a l'interieur .

#3 Monsieur Spi

  • Community Manager
  • PipPipPipPipPipPipPipPip
  • 6995 messages

Posté 25 June 2018 - 12:10 PM

Hello, avec quelle techno et quel langage ?

#4 Yakub

    Ceinture Verte

  • Members
  • PipPipPipPip
  • 66 messages

Posté 25 June 2018 - 13:32 PM

Bonjour Monsieur Spi,

Sous AS3 avec Air for Android .

#5 Yakub

    Ceinture Verte

  • Members
  • PipPipPipPip
  • 66 messages

Posté 25 June 2018 - 13:35 PM

En as3 for desktop avec l'ecouteur MouseEvent et la fonction StartDrag, StopDrag cela fonction parfaitement, mais sous application portable ca ne marche pas

#6 pol2095

  • Guests

Posté 25 June 2018 - 14:53 PM

regarde Touch and drag

#7 Yakub

    Ceinture Verte

  • Members
  • PipPipPipPip
  • 66 messages

Posté 25 June 2018 - 18:30 PM

pol2095,


Merci, cette fonction est plus complexe que le startDrag et stopDrag a cause des parametres, hormis ton lien en Anglais je ne trouve pas trop d'explication simple sur ces parametres, peux tu me dire comment ca fonctionne ?

J'ai un élément nommé Plan sur ma scène que j'aimerai bouger, cela donnerai ça dans ma fonction ?

e.target.startTouchDrag(e.PlanID, false, 3emeParamatre);

le 3emeParamtre que dois je renseigner dedans ?
Merci pour ton aide

#8 pol2095

  • Members
  • PipPipPipPipPipPipPipPip
  • 1746 messages

Posté 25 June 2018 - 21:54 PM

le 3ème paramètres est facultatif, regarde la doc

import flash.events.TouchEvent;
import flash.ui.Multitouch;
import flash.ui.MultitouchInputMode;

Multitouch.inputMode = MultitouchInputMode.TOUCH_POINT;

Plan.addEventListener(TouchEvent.TOUCH_BEGIN, onTouchBegin);
Plan.addEventListener(TouchEvent.TOUCH_END, onTouchEnd);

function onTouchBegin(event:TouchEvent):void
{
        event.target.startTouchDrag(event.touchPointID);
}
 
function onTouchEnd(event:TouchEvent):void
{
        event.target.stopTouchDrag(event.touchPointID);
}


#9 Yakub

    Ceinture Verte

  • Members
  • PipPipPipPip
  • 66 messages

Posté 26 June 2018 - 03:39 AM

pol2095,


Merci je test ce code

#10 Yakub

    Ceinture Verte

  • Members
  • PipPipPipPip
  • 66 messages

Posté 26 June 2018 - 19:06 PM

pol2095,

j'ai testé ce code cela fonction mais je ne peux plus faire de zoom car j'ai du modifié le Multitouch.inputMode, aurais tu une solution pour pouvroir realiser les deux mouvements ?

Fichier(s) joint(s)

  • Fichier joint  AED.fla   113.59 Ko   0 téléchargement(s)


#11 pol2095

  • Members
  • PipPipPipPipPipPipPipPip
  • 1746 messages

Posté 27 June 2018 - 08:12 AM

Je ne pense pas qu'on puisse utiliser les 2 en même temps, il faudrait recréer "GESTURE_ZOOM" avec MultitouchInputMode.TOUCH_POINT.

#12 Yakub

    Ceinture Verte

  • Members
  • PipPipPipPip
  • 66 messages

Posté 27 June 2018 - 17:49 PM

Que veux tu dire par "qu'on ne puisse pas utiliser les 2 en meme temps " ?
Pour utiliser un ecouteur d'evenement de type GESTURE_ZOOM je suis obligé d'ecrire,

Multitouch.inputMode = MultitouchInputMode.GESTURE pour pouvoir zoomer sur l'element "Plan" , mais si je souhaite egalement le deplacer je suis obliger d'ecrire Multitouch.inputMode = MultitouchInputMode.TOUCH_POINT c'est bien ca ?

Je ne peux pas faire une appli avec la possibilité de deplacer un objet et de pouvoir zoomer dessus en AS3 si je comprends bien ???

#13 Yakub

    Ceinture Verte

  • Members
  • PipPipPipPip
  • 66 messages

Posté 28 June 2018 - 05:55 AM

Puis je ecrire MultitouchInputMode.TOUCH_POINT, et MultitouchInputMode.GESTURE a l'interieur des ecouteurs d'evements pour realiser les deux mouvements ?

#14 Yakub

    Ceinture Verte

  • Members
  • PipPipPipPip
  • 66 messages

Posté 28 June 2018 - 06:12 AM

Je souhaiterais utiliser les deux ou trouver une methodes qui puisse me permettre de :

-De zoomer sur mon Plan
-De le deplacer pour voyage dedans
-De clique sur un element via le TOUCH_TAP
-De faire un wipe pour fermer le symbole .

Un peu comme une visionneuse photo sur telephone

#15 pol2095

  • Members
  • PipPipPipPipPipPipPipPip
  • 1746 messages

Posté 28 June 2018 - 17:04 PM

J'ai réalisé quelque chose de similaire avec Starling qui utilise MultitouchInputMode.TOUCH_POINT et pas les fonctions prédifinies d'Adobe.

#16 Yakub

    Ceinture Verte

  • Members
  • PipPipPipPip
  • 66 messages

Posté 28 June 2018 - 17:09 PM

pol2095


tu peux m'en dire un peu plus , j'avoue etre complètement bloqué , je ne comprends pourquoi c'est aussi complexe que ca pour realiser quelque chose de simple .

#17 pol2095

  • Members
  • PipPipPipPipPipPipPipPip
  • 1746 messages

Posté 28 June 2018 - 19:47 PM

si tu veux déplacer un object avec "MultitouchInputMode.GESTURE" il faut utiliser "GESTURE_PAN" (avec 2 doigts)

Multitouch.inputMode = MultitouchInputMode.GESTURE;

Plan.addEventListener(TransformGestureEvent.GESTURE_PAN, panHandler);

function panHandler(event:TransformGestureEvent):void
{
event.currentTarget.x += event.offsetX;
event.currentTarget.y += event.offsetY;
}


#18 pol2095

  • Members
  • PipPipPipPipPipPipPipPip
  • 1746 messages

Posté 30 June 2018 - 07:47 AM

Une autre façon de faire est d'utiliser "MultitouchInputMode.TOUCH_POINT", voilà un exemple qui recréer "
GESTURE_ZOOM" avec un drag à un doigt

package
{
        import com.MySprite;
        import flash.display.Bitmap;
        import flash.display.Sprite;
        import flash.events.Event;
        import flash.ui.Multitouch;
        import flash.ui.MultitouchInputMode;

        public class Main extends Sprite
        {
                [Embed(source = "./Image.jpg")]
                private static const MyImage:Class;
       
                public function Main()
                {
                        this.addEventListener(Event.ADDED_TO_STAGE, addedToStageHandler);
                }
       
                private function addedToStageHandler(event:Event):void
                {
                        this.removeEventListener(Event.ADDED_TO_STAGE, addedToStageHandler);
               
                        Multitouch.inputMode = MultitouchInputMode.TOUCH_POINT;
               
                        var mySprite:MySprite = new MySprite();
                        this.addChild(mySprite);
                        var myImage:Bitmap = new MyImage();
                        myImage.scaleX = myImage.scaleY = 0.2;
                        mySprite.addChild( myImage );
                }
        }
}

package com
{
        import flash.display.DisplayObject;
        import flash.display.Sprite;
        import flash.events.Event;
        import flash.events.TouchEvent;
        import flash.geom.Point;
        import flash.geom.Rectangle;

        public class MySprite extends Sprite
        {
                private var touches:Vector.<TouchEvent> = new <TouchEvent>[];
                private var touchPointID:int = -1;
                private var previousPosA:Point;
                private var previousPosB:Point;
                private var touchesContains:Vector.<Boolean> = new <Boolean>[];
       
                public function MySprite()
                {
                        this.addEventListener(Event.ADDED_TO_STAGE, addedToStageHandler);
                }
       
                private function addedToStageHandler(event:Event):void
                {
                        this.removeEventListener(Event.ADDED_TO_STAGE, addedToStageHandler);
               
                        stage.addEventListener(TouchEvent.TOUCH_BEGIN, onTouchBegin);
                        stage.addEventListener(TouchEvent.TOUCH_END, onTouchEnd);
                }
       
                private function onTouchBegin(event:TouchEvent):void
                {
                        touches.push( event );
                        touchesContains.push( this.contains( event.target as DisplayObject ) );
                        if( touches.length == 1 )
                        {
                                if( this.contains( event.target as DisplayObject ) )
                                {
                                        touchPointID = event.touchPointID;
                                        this.startTouchDrag(event.touchPointID);
                                }
                        }
                        else if( touchPointID != -1 )
                        {
                                this.stopTouchDrag(touchPointID);
                                touchPointID = -1;
                        }
               
                        if( touches.length == 1 )
                        {
                                previousPosA  = new Point( event.stageX, event.stageY );
                        }
                        else if( touches.length == 2 )
                        {
                                previousPosB  = new Point( event.stageX, event.stageY );
                                stage.addEventListener(TouchEvent.TOUCH_MOVE, onTouchMove);
                        }
                }
       
                private function onTouchMove(event:TouchEvent):void
                {
                        if( touches.length == 2 )
                        {
                                var index:int = touchIndex( event );
                                touchesContains[ index ] = this.contains( event.target as DisplayObject );
                       
                                var currentPosA:Point = index == 0 ? new Point( event.stageX, event.stageY ) : previousPosA.clone();
                                var currentPosB:Point = index == 1 ? new Point( event.stageX, event.stageY ) : previousPosB.clone();
                       
                                if( touchesContains[0] || touchesContains[1] )
                                {
                                        var currentVector:Point  = currentPosA.subtract(currentPosB);
                                        var previousVector:Point = previousPosA.subtract(previousPosB);
                               
                                        var sizeDiff:Number = currentVector.length / previousVector.length;
                               
                                        if( Math.abs( sizeDiff - 1 ) > 0.01 ) zoomImage( sizeDiff - 1, midPoint( currentPosA, currentPosB ) );
                                }
                                previousPosA  = currentPosA.clone();
                                previousPosB  = currentPosB.clone();
                        }
                }
       
                private function zoomImage(zoomAmount:Number, midPoint:Point):void
                {
                        zoomAmount *= 2;
                        if( this.scaleX + zoomAmount < 0.8 ) zoomAmount = 0.8 - this.scaleX;
                        var local:Point = this.globalToLocal( midPoint );
                        var x:Number = local.x;
                        var y:Number = local.y;
                        this.scaleX += zoomAmount;
                        this.scaleY += zoomAmount;
                        this.x -= x * zoomAmount;
                        this.y -= y * zoomAmount;
                }
         
                private function onTouchEnd(event:TouchEvent):void
                {
                        var index:int = touchIndex( event );
                        touches.splice( index, 1 );
                        touchesContains.splice( index, 1 );
                        if( touches.length == 1 )
                        {
                                if( index == 0 ) previousPosA = previousPosB.clone();
                                stage.removeEventListener(TouchEvent.TOUCH_MOVE, onTouchMove);
                        }
                        if( touchPointID != -1 )
                        {
                                this.stopTouchDrag(touchPointID);
                                touchPointID = -1;
                        }
                }
       
                private function touchIndex(event:TouchEvent):int
                {
                        for(var i:int = 0; i < touches.length; i++)
                        {
                                if( touches[i].touchPointID == event.touchPointID )
                                {
                                        return i;
                                }
                        }
                        return -1;
                }
       
                private function midPoint(currentPosA:Point, currentPosB:Point):Point
                {
                        var midPoint:Point = Point.interpolate(currentPosA, currentPosB, 0.5);
                        var rect:Rectangle = this.getRect( stage );
               
                        if( midPoint.x < rect.x )
                        {
                                midPoint.x = rect.x;
                        }
                        else if( midPoint.x > rect.x + rect.width )
                        {
                                midPoint.x = rect.x + rect.width;
                        }
               
                        if( midPoint.y < rect.y )
                        {
                                midPoint.y = rect.y;
                        }
                        else if( midPoint.y > rect.y + rect.height )
                        {
                                midPoint.y = rect.y + rect.height;
                        }
               
                        return midPoint;
                }
       
                public function dispose():void
                {
                        stage.removeEventListener(TouchEvent.TOUCH_BEGIN, onTouchBegin);
                        stage.removeEventListener(TouchEvent.TOUCH_END, onTouchEnd);
                        touches = null;
                        touchesContains = null;
                }
        }
}

;-)

#19 Yakub

    Ceinture Verte

  • Members
  • PipPipPipPip
  • 66 messages

Posté 01 July 2018 - 19:19 PM

Bonjour
pol2095


Merci je test ce code, et je reviens demain pour faire un feedback

#20 Invité

  • Guests

Posté 10 July 2018 - 18:25 PM

Bonjour Pol2095,

Bon apres avoir testé plusieurs possibilité, je trouve que la fonction zoom fonctionne tres mal sous flash, du coup je vais abandonner cette fonction sur mon appli car une fois sur trois le zoom ne se fait pas, de plus le zoom ne ce fait pas sur l'endroit clické mais sur des coordonnées fixe et donc a chaque fois que je zoom je dois faire un drag and drop car je n'ai pas zoomé sur l’endroit voulu, ce n'est pas réellement un zoom c'est un agrandissement de mon symbole .

par contre sur mon application bureau, j'aimerai pouvoir le faire avec le scroll de la souris je vais ouvrir un topic la dessus en esperant qu'une solution existe pour par exemple recuperer la position du pointeur de la souris de zoomer sur cette endroit .

Merci pour ton aide

#21 Yakub

    Ceinture Verte

  • Members
  • PipPipPipPip
  • 66 messages

Posté 10 July 2018 - 18:26 PM

Bonjour Pol2095,

Bon apres avoir testé plusieurs possibilité, je trouve que la fonction zoom fonctionne tres mal sous flash, du coup je vais abandonner cette fonction sur mon appli car une fois sur trois le zoom ne se fait pas, de plus le zoom ne ce fait pas sur l'endroit clické mais sur des coordonnées fixe et donc a chaque fois que je zoom je dois faire un drag and drop car je n'ai pas zoomé sur l’endroit voulu, ce n'est pas réellement un zoom c'est un agrandissement de mon symbole .

par contre sur mon application bureau, j'aimerai pouvoir le faire avec le scroll de la souris je vais ouvrir un topic la dessus en esperant qu'une solution existe pour par exemple recuperer la position du pointeur de la souris de zoomer sur cette endroit .

Merci pour ton aide

#22 pol2095

  • Members
  • PipPipPipPipPipPipPipPip
  • 1746 messages

Posté 12 July 2018 - 08:20 AM

As-tu tester le code plus haut ?

pour le scroll de la souris
sprite.addEventListener(MouseEvent.MOUSE_WHEEL, zoomImage);

function zoomImage(event:MouseEvent):void
{
        var zoomAmount:Number = 0.1;
 
        if( event.delta < 0 ) zoomAmount *= -1;
        var x:int = sprite.mouseX;
        var y:int = sprite.mouseY;
        sprite.scaleX += zoomAmount;
        sprite.scaleY += zoomAmount;
        sprite.x -= x * zoomAmount;
        sprite.y -= y * zoomAmount;
}





Répondre à ce sujet



  

1 utilisateur(s) li(sen)t ce sujet

0 membre(s), 1 invité(s), 0 utilisateur(s) anonyme(s)

authorised training centre

Centre de Formation Mediabox - Adobe et Apple Authorised Training Center.

Déclaré auprès de la Direction du Travail et de la Formation Professionnelle

Mediabox : SARL au capital de 62.000€ - Numéro d'activité : 11 75 44555 75 - SIRET : 49371646800035

MEDIABOX, 23, rue de Bruxelles, 75009 PARIS

FFP