Délai de glisser/déposer de UIElement dans Windows Phone 8.1

Question

J'utilise le gestionnaire d'événements ManipulationDelta pour faire glisser et déposer une simple ellipse dans un canevas à l'écran. J'utilise l'approche standard publiée en ligne à plusieurs endroits. Voici le code dans mon gestionnaire d'événements:

Ellipse dragableItem = sender as Ellipse; 
TranslateTransform translateTransform = dragableItem.RenderTransform as TranslateTransform; 
double newPosX = Canvas.GetLeft(dragableItem) + translateTransform.X + e.Delta.Translation.X; 
double newPosY = Canvas.GetTop(dragableItem) + translateTransform.Y + e.Delta.Translation.Y; 

if (!isCanvasBoundary(newPosX, TestCanvas.ActualWidth - dragableItem.ActualWidth, 0)) 
     translateTransform.X += e.Delta.Translation.X; 

if (!isCanvasBoundary(newPosY, TestCanvas.ActualHeight - dragableItem.ActualHeight, 0)) 
     translateTransform.Y += e.Delta.Translation.Y; 

La traînée et opération fonctionne baisse très bien, mais il y a un retard méchant d'environ 1 seconde entre le moment où l'utilisateur commence à glisser quand l'ellipse change réellement sa position. Je peux voir en imprimant au débogueur que le gestionnaire d'événements lui-même termine l'exécution presque instantanément, donc je devine qu'il a quelque chose à faire un taux de rafraîchissement pré-programmé pour tous les UIElements sur l'écran qui cause ce retard?

Y a-t-il une solution à ce problème?

Answer 1

J'ai eu le même problème il y a quelque temps. Je suppose que le retard est de décider si le geste est glisser ou appuyer. Il est difficile de toucher un écran sans glisser accidentellement. Pour éliminer ce retard, vous pouvez utiliser les événements PointerMove et PointerPressed. Voici mon exemple. Vous avez une toile avec deux ellipses qui peuvent être traînées sans aucun retard.

XAML

<Grid> 
    <Canvas x:Name="Board" PointerMoved="Canvas_PointerMoved" Background="Black"> 
     <Ellipse Width="64" Height="64" Fill="Red" 
       Canvas.Left="32" Canvas.Top="128" PointerPressed="Ellipse_PointerPressed"/> 
     <Ellipse Width="96" Height=" 96" Fill="Blue" 
       Canvas.Left="128" Canvas.Top="16" PointerPressed="Ellipse_PointerPressed"/> 
    </Canvas> 
</Grid> 

Comme vous pouvez le voir, je suis dans la gestion des événements PointerMoved toile et PointerPressed événement dans des ellipses. Il est important que l'arrière-plan de la toile ne soit pas transparent pour gérer les événements tactiles.

C#

public sealed partial class MainPage : Page 
{ 
    UIElement draggedItem = null; 
    Point offset; 

    public MainPage() 
    { 
     this.InitializeComponent(); 
     this.NavigationCacheMode = NavigationCacheMode.Required; 
    } 

    private void Ellipse_PointerPressed(object sender, PointerRoutedEventArgs e) 
    { 
     draggedItem = sender as UIElement; 
     offset = e.GetCurrentPoint(draggedItem).Position; 
    } 

    private void Canvas_PointerMoved(object sender, PointerRoutedEventArgs e) 
    { 
     if (draggedItem == null) 
      return; 

     Point dragPoint = e.GetCurrentPoint(Board).Position; 
     Canvas.SetLeft(draggedItem, dragPoint.X - offset.X); 
     Canvas.SetTop(draggedItem, dragPoint.Y - offset.Y); 
    } 
} 

Je pense que le code est assez simple et compréhensible. J'utilise PointerPressed pour décider quel objet est déplacé. Je calcule également un décalage, car nous voulons déplacer l'objet par rapport au point où l'utilisateur touche.