Toile déplaçable dans WPF Utilisation d'un 'Thumb'

Question

Dans ma quête pour implémenter un mécanisme de 'drag' très simple à mon application (qui consiste en plusieurs canevas imbriquées dans un canevas 'parent') j'ai trouvé les éléments suivants de code:

(affichage seuls les bits pertinents pour économiser l'espace)

MainWindow.xaml

<Canvas Name="parentCanvas" Background="#FFE8CACA"> 
     <Canvas Name="myCanvas" Height="100" Width="200" Background="#FFB4FFB4"> 
      <Thumb Name="myThumb" Canvas.Left="0" Canvas.Top="0" Background="Blue" Width="200" Height="20" DragDelta="onDragDelta" /> 
     </Canvas> 

     <!-- debug --> 
     <Button Content="Zero" Height="51" Name="button1" Width="46" Click="button1_Click" Canvas.Left="14" Canvas.Top="302" /> 
     <Label Name="pos" Width="499" Canvas.Left="77" Canvas.Top="302" Height="26" /> 
     <Label Name="changes" Height="28" Canvas.Left="77" Canvas.Top="325" Width="499" /> 
    </Canvas> 

MainWindow.xaml.cs

void onDragDelta(object sender, DragDeltaEventArgs e) 
    { 
     Canvas.SetLeft(myCanvas, e.HorizontalChange); 
     Canvas.SetTop(myCanvas, e.VerticalChange); 

     //debug info 
     pos.Content = "Left: " + Canvas.GetLeft(myCanvas) + ", Top: " + Canvas.GetTop(myCanvas); 
     changes.Content = "Horizontal: " + e.HorizontalChange + ", Vertical: " + e.VerticalChange; 
    } 

    private void button1_Click(object sender, RoutedEventArgs e) 
    { 
     Canvas.SetLeft(myCanvas, 0); 
     Canvas.SetTop(myCanvas, 0); 
    } 

Ce qui semble fonctionner, au hasard! Il semble suivre les mouvements de la souris mais j'ai du mal à interpréter le DragDeltaEventArgs, ce qui provoque un mouvement très instable de la toile. C'est un peu difficile à expliquer alors voici une courte vidéo que j'ai capturé: http://img84.imageshack.us/img84/6614/drag.mp4

Tous les commentaires/suggestions seront très appréciés car j'ai regardé cela pendant un moment et je ne sais pas quoi à faire avec :(

Answer 1

les changements horizontaux et verticaux sont le montant déplacé depuis l'événement précédent et vous devez les ajouter à la position actuelle.

Canvas.SetLeft(myCanvas, Canvas.GetLeft(myCanvas) + e.HorizontalChange); 
Canvas.SetTop(myCanvas, Canvas.GetTop(myCanvas) + e.VerticalChange); 

vous devez également définir une position de départ pour la toile sinon vous obtenez NaN.

<Canvas Name="myCanvas" Height="100" Width="200" Background="#FFB4FFB4" Canvas.Left="0" Canvas.Top="0">