2017-11-17 130 views

回答

0

我已经做到了。

这里没有与轨道和拇指

 <Slider x:Name="slidExample" 
     VerticalAlignment="Center" TickFrequency="37.5" 
     Minimum="0" Maximum="600" Value="500" Width="300" Margin="50,0,50,0" 
     SnapsToDevicePixels="true" 
     OverridesDefaultStyle="true" 
     IsTabStop="false" 
     Focusable="false" 
     > 
     <Slider.Style> 
      <Style TargetType="Slider"> 
       <Style.Triggers> 
        <Trigger Property="Orientation" Value="Horizontal"> 
         <Setter Property="MinHeight" Value="21" /> 
         <Setter Property="MinWidth" Value="104" /> 
        </Trigger> 
       </Style.Triggers> 
      </Style> 
     </Slider.Style> 

     <Slider.Template> 
      <ControlTemplate> 
       <Grid x:Name="GridOfslidExample"> 
        <Grid.RowDefinitions> 
         <RowDefinition Height="Auto" /> 
         <RowDefinition Height="Auto" MinHeight="{TemplateBinding MinHeight}" /> 
         <RowDefinition Height="Auto" /> 
        </Grid.RowDefinitions> 
        <TickBar x:Name="TopTickOfslidExample" Fill="LightGray" VerticalAlignment="Top" 
        SnapsToDevicePixels="True" Grid.Row="0" Placement="Top" Height="5" 
          Visibility="Visible"> 
        </TickBar> 
        <Border BorderBrush="LightGray" BorderThickness="0,0,0,1" ></Border> 
        <Border x:Name="TrackBackground" VerticalAlignment="Center" Margin="0,-10,0,0" BorderBrush="Red" Background="Red" Height="3" Grid.Row="1" BorderThickness="1"/> 
        <Track Grid.Row="1" x:Name="PART_Track" Margin="0,-10,0,0" > 
         <Track.DecreaseRepeatButton> 
          <RepeatButton Command="Slider.DecreaseLarge" > 
           <RepeatButton.Style> 
            <Style TargetType="RepeatButton"> 
             <Setter Property="SnapsToDevicePixels" Value="true" /> 
             <Setter Property="OverridesDefaultStyle" Value="true" /> 
             <Setter Property="Template"> 
              <Setter.Value> 
               <ControlTemplate TargetType="RepeatButton"> 
                <Border SnapsToDevicePixels="True" Background="YellowGreen" BorderThickness="1" BorderBrush="YellowGreen" Height="3"/> 
               </ControlTemplate> 
              </Setter.Value> 
             </Setter> 
            </Style> 
           </RepeatButton.Style> 
          </RepeatButton> 
         </Track.DecreaseRepeatButton> 
         <Track.Thumb> 
          <Thumb x:Name="ThumbOfslidExample"> 
           <Thumb.Style> 
            <Style TargetType="Thumb"> 
             <Setter Property="SnapsToDevicePixels" Value="true" /> 
             <Setter Property="OverridesDefaultStyle" Value="true" /> 
             <Setter Property="Template"> 
              <Setter.Value> 
               <ControlTemplate TargetType="Thumb"> 
                <StackPanel Orientation="Vertical"> 
                 <Path Data="M 0 0 L 8 0 L 4 6 Z" Stroke="YellowGreen" Margin="-2,0,0,0" StrokeThickness="2" Fill="YellowGreen"></Path> 
                 <Line X1="0" Y1="0" X2="0" Y2="7" Stroke="Gray" StrokeThickness="1" Margin="2,0,0,0" StrokeDashArray="1.5,1.5"></Line> 
                 <TextBlock Foreground="Black" Margin="-2,30,0,0" Text="{Binding Value, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type Slider}}}"/> 
                </StackPanel> 
               </ControlTemplate> 
              </Setter.Value> 
             </Setter> 
            </Style> 
           </Thumb.Style> 
          </Thumb> 
         </Track.Thumb> 
         <Track.IncreaseRepeatButton> 
          <RepeatButton Command="Slider.IncreaseLarge" > 
           <RepeatButton.Style> 
            <Style TargetType="RepeatButton"> 
             <Setter Property="Template"> 
              <Setter.Value> 
               <ControlTemplate TargetType="RepeatButton"> 
                <Border Background="Transparent"/> 
               </ControlTemplate> 
              </Setter.Value> 
             </Setter> 
            </Style> 
           </RepeatButton.Style> 
          </RepeatButton> 
         </Track.IncreaseRepeatButton> 
        </Track> 
        <TextBlock Text="0" Grid.Row="1" Margin="0,15,0,0"></TextBlock> 
        <TickBar x:Name="BottomTickOfslidExample" Fill="LightGray" SnapsToDevicePixels="True" Grid.Row="2" Placement="Bottom" Height="4" Visibility="Collapsed" /> 
       </Grid> 

       <ControlTemplate.Triggers> 
        <Trigger Property="Slider.TickPlacement" Value="TopLeft"> 
         <Setter TargetName="TopTickOfslidExample" Property="Visibility" Value="Visible" /> 
        </Trigger> 
        <Trigger Property="Slider.TickPlacement" Value="BottomRight"> 
         <Setter TargetName="BottomTickOfslidExample" Property="Visibility" Value="Visible" /> 
        </Trigger> 
        <Trigger Property="Slider.TickPlacement" Value="Both"> 
         <Setter TargetName="TopTickOfslidExample" Property="Visibility" Value="Visible" /> 
         <Setter TargetName="BottomTickOfslidExample" Property="Visibility" Value="Visible" /> 
        </Trigger> 
       </ControlTemplate.Triggers> 
      </ControlTemplate> 
     </Slider.Template> 

    </Slider> 
+0

对不起,RepeatButton命令不起作用 – Erhy

+0

是否可以通过控件的实现来界定XAML语法的变体? – Erhy

-1

模板和样式的引用 滑块的XAML代码,我想我已经固定它。 RepeatButton的错误命令的原因是拇指中的文本字段。 它在新来源中的名称是“DisplaysValueInThumb”。 我不得不添加一个转换器,因为滑块的值会产生许多小数位,这就隐藏了重复按钮的触摸区域。

Because I was unable to format the source correctly you find the source here.

Erhy

+0

请将源代码粘贴到答案中,并通过选择源并按下Ctrl + K将其缩进四个空格。我们强烈阻止与外部档案的链接,因为它们总是死去,然后答案(或问题)就没有用处。 –