WPFスライダコントロールのポップアップ位置インジケータの作成

Question

私はアプリケーション内のすべてのWPFスライダコントロールをスタイリングしています。ユーザーが「サム」をドラッグしているときに親指の上にポップアップが表示されるように、サムがドラッグされるとそれに従います）、ポップアップは新しいスライダ値のライブアップデートを表示します。

C＃を使用しないでXamlでこれを行うにはどうすればよいですか？

おかげ

Answer 1

あなたはそのドラッグ（sample how to do that）horizo​​ntalOffsetがバインドされていないとして、それが終了していないの開始のためにこれがあるときにポップアップを表示するには、親指のスタイルを設定することができます

<Style x:Key="HorizontalSliderThumbStyle" TargetType="{x:Type Thumb}"> 
     <Setter Property="Focusable" Value="false"/> 
     <Setter Property="OverridesDefaultStyle" Value="true"/> 
     <Setter Property="Height" Value="22"/> 
     <Setter Property="Width" Value="11"/> 
     <Setter Property="Foreground" Value="Gray"/> 
     <Setter Property="Template"> 
      <Setter.Value> 
       <ControlTemplate TargetType="{x:Type Thumb}"> 
        <Canvas SnapsToDevicePixels="true"> 
         <Canvas.RenderTransform> 
          <TranslateTransform X="5.5" Y="11"/> 
         </Canvas.RenderTransform> 
         <VisualStateManager.VisualStateGroups> 
          <VisualStateGroup x:Name="CommonStates"> 
           <VisualState x:Name="Normal"/> 
           <VisualState x:Name="MouseOver"/> 
           <VisualState x:Name="Pressed" /> 
           <VisualState x:Name="Disabled"/> 
          </VisualStateGroup> 
         </VisualStateManager.VisualStateGroups> 
         <Path x:Name="Background" Data="{StaticResource SliderThumbOuterBorderGeometry}" Fill="{StaticResource HorizontalSliderThumbNormalBackground}" />      
         <Path x:Name="InnerBorder" Data="{StaticResource SliderThumbMiddleBorderGeometry}" Stroke="White" />      
         <Path x:Name="OuterBorder" Data="{StaticResource SliderThumbOuterBorderGeometry}" Stroke="#FF929292"/> 
          <Popup x:Name="tooltip" Grid.Row="0" PopupAnimation="Fade" Placement="Right" 
          PlacementRectangle="20,25,40,30" Margin="0" 
          VerticalOffset="-60" 
          HorizontalOffset="-60" > 
           <Border Background="Black" CornerRadius="5"> 
            <TextBlock Text="Sample Text" FontSize="12" Foreground="White" /> 
           </Border> 
          </Popup> 
        </Canvas> 
        <ControlTemplate.Triggers> 
         <Trigger Property="IsMouseOver" Value="true"> 
          <Setter Property="Fill" TargetName="Background" Value="{StaticResource HorizontalSliderThumbHoverBackground}"/> 
          <Setter Property="Stroke" TargetName="OuterBorder" Value="{StaticResource HorizontalSliderThumbHoverBorder}"/> 
         </Trigger> 
         <Trigger Property="Foreground" Value="Blue"> 
          <Setter Property="Fill" TargetName="Background" Value="{StaticResource HorizontalSliderThumbHoverBackground}"/> 
          <Setter Property="Stroke" TargetName="OuterBorder" Value="{StaticResource HorizontalSliderThumbHoverBorder}"/> 
         </Trigger> 
         <Trigger Property="IsDragging" Value="true"> 
          <Setter TargetName="tooltip" Property="IsOpen" Value="true" /> 
          <Setter Property="Fill" TargetName="Background" Value="{StaticResource HorizontalSliderThumbPressedBackground}"/> 
          <Setter Property="Stroke" TargetName="OuterBorder" Value="{StaticResource HorizontalSliderThumbPressedBorder}"/> 
         </Trigger> 
         <Trigger Property="IsEnabled" Value="false"> 
          <Setter Property="Fill" TargetName="Background" Value="#FFF4F4F4"/> 
          <Setter Property="Stroke" TargetName="InnerBorder" Value="{x:Null}"/> 
          <Setter Property="Data" TargetName="OuterBorder" Value="{StaticResource SliderThumbDisabledGeometry}"/> 
          <Setter Property="Stroke" TargetName="OuterBorder" Value="#FFAEB1AF"/> 
         </Trigger> 
        </ControlTemplate.Triggers> 
       </ControlTemplate> 
      </Setter.Value> 
     </Setter> 
    </Style>