J
J
Joomboosick2021-09-20 23:59:48
XAML
Joomboosick, 2021-09-20 23:59:48

How to set different colors for sliders in controlTemplate?

<UserControl.Resources>

            <SolidColorBrush x:Key="ReadOnlyTextBrush" Color="#555555" />
        <ControlTemplate x:Key="simpleSlider" TargetType="{x:Type Slider}">
            <Border SnapsToDevicePixels="true" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}">
                <Grid>
                    <Grid.RowDefinitions>
                        <RowDefinition Height="Auto"/>
                        <RowDefinition Height="Auto" MinHeight="{TemplateBinding MinHeight}"/>
                        <RowDefinition Height="Auto"/>
                    </Grid.RowDefinitions>

                    <Rectangle x:Name="PART_SelectionRange"/>

                    <Track x:Name="PART_Track" Grid.Row="1">
                        <Track.Thumb>
                            <Thumb x:Name="Thumb">
                                <Thumb.Template>
                                    <ControlTemplate TargetType="Thumb">
                                        <Rectangle Fill="{StaticResource ReadOnlyTextBrush}" 
                                                   Stroke="Black"
                                                   StrokeThickness="1" 
                                                   Width="10"
                                                   Height="18"
                                                   SnapsToDevicePixels="True"/>
                                    </ControlTemplate>
                                </Thumb.Template>
                            </Thumb>
                        </Track.Thumb>
                    </Track>
                </Grid>
            </Border>
        </ControlTemplate>
    </UserControl.Resources>
    
    <Grid VerticalAlignment="Top">
        <Border BorderThickness="0,1,0,0" BorderBrush="Black" VerticalAlignment="Center" Height="1" 
                Margin="5,0,5,0"/>


        <Slider x:Name="Slider1"
                Minimum="{Binding ElementName=root, Path=Minimum}"
                Maximum="{Binding ElementName=root, Path=Maximum}"
                Value="{Binding ElementName=root, Path=Slider1Value, Mode=TwoWay}"
                Template="{StaticResource simpleSlider}"
                Margin="0,0,10,0"
                BorderBrush="Yellow"
                >
        </Slider>
        <Slider x:Name="Slider2"
                Minimum="{Binding ElementName=root, Path=Minimum}"
                Maximum="{Binding ElementName=root, Path=Maximum}"
                Template="{StaticResource simpleSlider}"
                Value="{Binding ElementName=root, Path=Slider2Value, Mode=TwoWay}"
                Margin="0,0,20,0"
                
                Foreground="Green"
                />

        <Slider x:Name="Slider3"
                Minimum="{Binding ElementName=root, Path=Minimum}"
                Maximum="{Binding ElementName=root, Path=Maximum}"
                Template="{StaticResource simpleSlider}"
                Value="{Binding ElementName=root, Path=Slider3Value, Mode=TwoWay}"
                Margin="0,0,30,0"
                
                Foreground="Red"
                />
        <Slider x:Name="Slider4"
                Minimum="{Binding ElementName=root, Path=Minimum}"
                Maximum="{Binding ElementName=root, Path=Maximum}"
                Template="{StaticResource simpleSlider}"
                Value="{Binding ElementName=root, Path=Slider4Value, Mode=TwoWay}"
                Margin="0,0,40,0"
                
                Foreground="Red"
                />
        <Slider x:Name="Slider5"
                Minimum="{Binding ElementName=root, Path=Minimum}"
                Maximum="{Binding ElementName=root, Path=Maximum}"
                Template="{StaticResource simpleSlider}"
                Value="{Binding ElementName=root, Path=Slider5Value, Mode=TwoWay}"
                Margin="0,0,50,0"
                />
        <Slider x:Name="Slider6"
                Minimum="{Binding ElementName=root, Path=Minimum}"
                Maximum="{Binding ElementName=root, Path=Maximum}"
                Template="{StaticResource simpleSlider}"
                Value="{Binding ElementName=root, Path=Slider6Value, Mode=TwoWay}"
                Margin="0,0,60,0"
                Foreground="Red"
                />
        <Slider x:Name="Slider7"
                Minimum="{Binding ElementName=root, Path=Minimum}"
                Maximum="{Binding ElementName=root, Path=Maximum}"
                Template="{StaticResource simpleSlider}"
                Value="{Binding ElementName=root, Path=Slider7Value, Mode=TwoWay}"
                Margin="0,0,70,0"
                Foreground="Red"
                />
        <Slider x:Name="Slider8"
                Minimum="{Binding ElementName=root, Path=Minimum}"
                Maximum="{Binding ElementName=root, Path=Maximum}"
                Template="{StaticResource simpleSlider}"
                Value="{Binding ElementName=root, Path=Slider8Value, Mode=TwoWay}"
                Margin="0,0,80,0"
                Foreground="Red"
                />
    </Grid>

I have the following code, I do not know how to set different colors for the sliders

Answer the question

In order to leave comments, you need to log in

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question