I am trying to achieve customized slider control required customizations are :
1.Thumb with the teal color
2.Repeat buttons end with rounded corners
3.Inside tick bar ticks as circles or ellipse instead of lines(please refer attached image.png file blue arrow mark)
I am able achieve first and second points above, but third point I am not getting.
<Window x:Class="SliderControl.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:local="clr-namespace:SliderControl"
mc:Ignorable="d"
Title="MainWindow" Height="450" Width="800">
<Window.Resources>
<Style TargetType="Slider" x:Key="SliderStyle">
<Setter Property="OverridesDefaultStyle" Value="True"/>
<Setter Property="SnapsToDevicePixels" Value="true" />
<Setter Property="IsTabStop" Value="false" />
<Setter Property="Focusable" Value="false" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="Slider">
<Track Name="PART_Track">
<Track.DecreaseRepeatButton>
<RepeatButton Command="Slider.DecreaseLarge">
<RepeatButton.Style>
<Style TargetType="RepeatButton">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="RepeatButton">
<Grid>
<Border BorderBrush="#CACACA" BorderThickness="1" CornerRadius="7,0,0,7" Background="#CACACA" Height="15" >
</Border>
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</RepeatButton.Style>
</RepeatButton>
</Track.DecreaseRepeatButton>
<Track.IncreaseRepeatButton>
<RepeatButton Command="Slider.IncreaseLarge" >
<RepeatButton.Style>
<Style TargetType="RepeatButton">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="RepeatButton">
<Grid >
<Border BorderBrush="#CACACA" BorderThickness="1" CornerRadius="0,7,7,0" Background="#CACACA" Height="15" >
</Border>
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</RepeatButton.Style>
</RepeatButton>
</Track.IncreaseRepeatButton>
<Track.Thumb>
<Thumb>
<Thumb.Style>
<Style TargetType="Thumb">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="Thumb">
<Canvas>
<Rectangle Canvas.Left="4" Canvas.Bottom="-3.7" Fill="Teal" Width="12" Height="15" Margin="-8,0,0,5" Stroke="Teal"/>
<Path Fill="Teal" Data="M 0 10 L 20 10 L 10 0 Z" Canvas.Left="-4" Stretch="Fill" Width="12" Height="9.333"/>
</Canvas>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</Thumb.Style>
</Thumb>
</Track.Thumb>
</Track>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</Window.Resources>
<Grid>
<StackPanel HorizontalAlignment="Center" Height="100" VerticalAlignment="Center" Width="400">
<Slider Height="25" Width="250" Margin="30" Maximum="5" Minimum="1" Value="0" Cursor="Hand"
TickPlacement="Both" TickFrequency="1" Ticks="1, 2, 3, 4, 5" Name="Slider" Style="{StaticResource SliderStyle}">
</Slider>
<TextBlock HorizontalAlignment="Center" VerticalAlignment="Center" Width="80" Margin="70,-20,0,0"
Text="{Binding ElementName=Slider, Path=Value}"></TextBlock>
</StackPanel>
</Grid>
</Window>
Can you please help me ,how to get circles inside tickbar in wpf .