Ajout d'un deuxième curseur au contrôle du curseur dans WPF

Question

J'essaye de faire un contrôle de gamme qui est fondamentalement un contrôle de curseur avec un pouce supplémentaire. Le seul code que j'ai trouvé pour celui déjà construit est ici.

http://www.codeplex.com/AvalonControlsLib

Pour la vie de moi je ne peux pas obtenir une info-bulle pour afficher au-dessus de chaque pouce (avec la valeur actuelle) alors qu'il est déplacé. Il affiche une info-bulle de survol de la souris, mais elle disparaît lorsque le curseur est déplacé. Est-ce que quelqu'un sait quelque chose au sujet de ce contrôle particulier, ou comment vous ajouteriez un deuxième pouce au contrôle de curseur et l'utiliseriez de la même manière? J'ai trouvé cette question de base sur quelques forums sans réponse en plus de pointer sur le lien ci-dessus. Bien sûr, les gens mentionnent toujours à quel point c'est facile sans montrer ou expliquer comment on s'y prendrait. Merci d'avance.

Bob

Answer 1

Je suppose que vous essayez d'utiliser l'Avalon Controls d'ici: Avalon Controls

J'ai ajouté une info-bulle pour les pouces dans le modèle de contrôle et l'a appelé PART_LeftToolTip

<ControlTemplate TargetType="{x:Type Controls:RangeSlider}"> 
    <StackPanel Orientation="Horizontal" Name="PART_RangeSliderContainer"> 
     <RepeatButton Name="PART_LeftEdge"/>       
     <Thumb Name="PART_LeftThumb" Cursor="SizeWE"> 
       <Thumb.ToolTip> 
        <ToolTip Name="PART_LeftToolTip" />   
       </Thumb.ToolTip> 
      </Thumb>            
      <Thumb Name="PART_MiddleThumb" Cursor="ScrollWE" MinWidth="1"/> 
      <Thumb Name="PART_RightThumb" Cursor="SizeWE"> 
       <Thumb.ToolTip> 
         <ToolTip Name="PART_RightToolTip" /> 
       </Thumb.ToolTip> 
      </Thumb> 
      <RepeatButton Name="PART_RightEdge"/> 
     </StackPanel> 
</ControlTemplate> 

Je les ai ajoutés en tant que parties de modèle au contrôle RangeSlider

TemplatePart(Name = "PART_LeftToolTip", Type = typeof(ToolTip)), 
TemplatePart(Name = "PART_RightToolTip", Type = typeof(ToolTip))] 
public sealed class RangeSlider : Control 

Dans la méthode OnApplyTemplate je ne les éléments suivants

_leftPreviewToolTip = EnforceInstance<ToolTip>("PART_LeftToolTip"); 
_rightPreviewToolTip = EnforceInstance<ToolTip>("PART_RightToolTip"); 

Dans la méthode InitializeVisualElements j'ajouté ce qui suit

private void InitializeVisualElementsContainer() 
{ 
    // ** same as before ** // 

    _leftPreviewToolTip.PlacementTarget = _leftThumb; 
    _rightPreviewToolTip.PlacementTarget = _rightThumb; 
} 

maintenant pour les parties amusantes, vous voulez essentiellement afficher cette infobulle lorsque les pouces sont déplacés. Pour l'info-bulle de gauche, vous voulez qu'elle s'affiche lorsque le pouce gauche est déplacé ou lorsque le pouce central est déplacé. J'ai créé une méthode appelée, ShowLeftTooltip et l'appel de LeftThumbDragDelta et CenterThumbDragDelta respectivement.

private void ShowLeftToolTip() 
{ 
    _leftPreviewToolTip.IsOpen = AutoToolTip; 
    // This is a little trick to cause the ToolTip to update its position next to the Thumb 
    _leftPreviewToolTip.HorizontalOffset = _leftPreviewToolTip.HorizontalOffset == 0.0 ? 0.001 : 0.0; 
} 

Cette astuce pour déplacer l'info-bulle n'est pas quelque chose que je pensais, je l'ai eu d'un autre poste quelque part.

Je laisserai au lecteur le soin d'implémenter la bonne info-bulle.

Vous pouvez styliser l'info-bulle afin que cela permette un affichage flexible. N'oubliez pas de donner à l'info-bulle quelque chose comme un contexte de données afin qu'il ne soit pas vide.

Answer 2

Vous pouvez lier la propriété IsOpen du ToolTip à la propriété IsDragging du Thumb