Question

I have a scroll that changes its value, and I want to write on a Label the value that is taking at every moment.

I have tried this:

<Window x:Class="WpfApplication16.Window1"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:my="clr-namespace:WpfApplication16"
    Title="Window1" Height="300" Width="300">
<Window.Resources>
    <my:ValueAngleConverter x:Key="valueAngleConverter"/>
    <my:ValueTextConverter x:Key="valueTextConverter"/>
</Window.Resources>
<Grid>
    <Slider Name="knob" SmallChange="1">
        <Slider.Template>
            <ControlTemplate>
                <Viewbox>
                    <Canvas Width="300" Height="300" Margin="5">
                        <Ellipse Fill="LightBlue" Width="300" Height="300" Canvas.Left="0" Canvas.Top="0" 
            Stroke="Black" StrokeThickness="10"
            MouseLeftButtonUp="Ellipse_MouseLeftButtonUp"
            MouseMove="Ellipse_MouseMove"/>
                        <Ellipse Fill="Black" Width="60" Height="60" Canvas.Left="120" Canvas.Top="120"/>
                        <Canvas>
                            <Line Stroke="Red" StrokeThickness="5" X1="150" Y1="30" X2="150" Y2="20"
            MouseLeftButtonUp="Ellipse_MouseLeftButtonUp" MouseLeftButtonDown="Ellipse_MouseLeftButtonDown"/>
                            <Canvas.RenderTransform>
                                <RotateTransform CenterX="150" CenterY="150">
                                    <RotateTransform.Angle>
                                        <MultiBinding Converter="{StaticResource valueAngleConverter}">
                                            <Binding RelativeSource="{RelativeSource TemplatedParent}" Path="Value"/>
                                            <Binding RelativeSource="{RelativeSource TemplatedParent}" Path="Minimum"/>
                                            <Binding RelativeSource="{RelativeSource TemplatedParent}" Path="Maximum"/>
                                        </MultiBinding>
                                    </RotateTransform.Angle>
                                </RotateTransform>
                            </Canvas.RenderTransform>
                        </Canvas>
                    </Canvas>
                </Viewbox>
            </ControlTemplate>
        </Slider.Template>
    </Slider>
    <Label Content="{Binding Value, ElementName=knob, UpdateSourceTrigger=PropertyChanged}" />
</Grid>

I have changed the appearance of the slider content to a elliptical slider (If anybody feels curious I can attach full code).

But my problem goes with my label. I want it to change when I change the scroll value. Right now it shows the first value, but stacks the scroll (I can’t scroll) and can’t change its value.

Any idea on what I’m doing wrong to bind the scroll value to label content?

Answer 1

The following code works. The difference I see is that in binding you have not declared Path=Value, but I don’t think this should matter.

<StackPanel>
    <Slider Name="knob" SmallChange="1"/>        
    <Label Content="{Binding ElementName=knob, Path=Value, UpdateSourceTrigger=PropertyChanged}"/>
</StackPanel>

The Template should be checked at the point where the Value is bound.