2016-11-18 2 views
0

J'implémente une application GWT, avoir un panneau de défilement, panneau de flux qui contient l'image, la souris vers le bas/déplacer/haut pour faire glisser le panneau de flux dans le panneau de défilement.Utilisation de CSS setProperty pour top ne fonctionne pas bien lorsque GWT glisser

Partie gauche (direction x) fonctionne parfaitement, cependant, le même code pour le haut (direction y) ne fonctionne pas bien, il semble qu'il bouge et se déplace instable. D'une manière ou d'une autre, la valeur supérieure est beaucoup plus grande que la gauche, ce qui cause le problème, mais aucune idée de comment cela se passe et comment faire fonctionner la direction Y sans heurt.

public void mouseDown(MouseDownEvent event) 
    { 
       isMouseDown = true; 
       event.preventDefault(); 

       xoffset = event.getX(); 
       yoffset = event.getY(); 

       Event.setCapture(panel.getElement()); 
    } 
     public void mouseMove(MouseMoveEvent event) { 
      int = event.getX(); 
      int y = event.getY();  

      float left = panel.getAbsoluteLeft(); 
      float top = panel.getAbsoluteTop(); 

      float offset_XX = x - xoffset; 
      float offset_YY = y - yoffset; 


      panel.getElement().getStyle().setProperty("position", "absolute"); 


      float newLeft = left + offset_XX; 

      if (isMouseDown) { 

      if (newLeft < scrollPanel.getAbsoluteLeft() ) { 


       offset_XX = offset_XX - Math.abs(scrollPanel.getAbsoluteLeft() -panel.getAbsoluteLeft()); 
       if (Math.abs(offset_XX) > Math.abs(scrollPanel.getOffsetWidth() - panel.getOffsetWidth())) { 
        if (offset_XX > 0) 
         offset_XX = Math.abs(scrollPanel.getOffsetWidth() - panel.getOffsetWidth()); 
        else 
         offset_XX = -Math.abs(scrollPanel.getOffsetWidth() - panel.getOffsetWidth()); 
       } 
       panel.getElement().getStyle().setPropertyPx("left", (int)offset_XX); 
      } 
      float newtop = top + offset_YY; 
      if (newtop < scrollPanel.getAbsoluteTop()) { 

       offset_YY = offset_YY - Math.abs(scrollPanel.getAbsoluteTop() -panel.getAbsoluteTop()); 
       if (Math.abs(offset_YY) > Math.abs(scrollPanel.getOffsetHeight() - panel.getOffsetHeight())) { 
        if (offset_YY > 0) 
         offset_YY = Math.abs(scrollPanel.getOffsetHeight() - panel.getOffsetHeight()); 
        else 
         offset_YY = -Math.abs(scrollPanel.getOffsetHeight() - panel.getOffsetHeight()); 
       } 
       panel.getElement().getStyle().setPropertyPx("top", (int)offset_YY); 
      } 

      } 
     } 

Répondre

0

En bref, il y a trop de calculs et d'appels DOM en cours dans votre glisser-déposer. Je vous suggère d'intégrer la solution de l'équipe GWT pour les panneaux déplaçables/redimensionnables après la mise en œuvre de com.google.gwt.logging.client.LoggingPopup. C'est très rapide, élégant, facile à comprendre et à utiliser. Vous pouvez obtenir le code ici https://github.com/stephenh/google-web-toolkit/blob/master/user/src/com/google/gwt/logging/client/LoggingPopup.java