How to bind a field to a gauge control?

Question

I've added a WPF gauge control from this class https://github.com/JohanLarsson/GaugeBox but I'm not sure how to wire the control up to a field of type double degreeOutput declared in the code behind.

My aim is to bind degreeOutput to the gauge control and have the values from degreeOutput update the gauge accordingly.

The process I followed in setting up the control is:

1)Add the control to the user control's xaml layout and declare the namespace xmlns:gauges="clr-namespace:Gauges;assembly=Gauges"

2)Set the value property to Value="{Binding degreeOutput}"

3)Run application, (but the gauge doesn't update in accordance with the degree readings being output from degreeOutput)

Does anyone know what step I'm missing in binding the control to my degree field?

This is the xaml layout for the guage control:

    <gauges:Gauge x:Name="Gauge"
                          Grid.Row="0"
                          Margin="13,18,134,134"
                          HorizontalAlignment="Stretch"
                          VerticalAlignment="Stretch"
                          Marker="{Binding Marker}"
                          Maximum="{Binding Max}"
                          Minimum="{Binding Min}"
                          Placement="{Binding Placement}"
                          ShowLabels="{Binding ShowLabels}"
                          ShowMajorTicks="{Binding ShowTicks}"
                          ShowTrack="{Binding ShowTrack}"
                          TickFrequency="{Binding TickFrequency}"
                          Value="{Binding degreeOutput}" RenderTransformOrigin="0.5,0.5">
        <gauges:Gauge.RenderTransform>
            <TransformGroup>
                <ScaleTransform/>
                <SkewTransform/>
                <RotateTransform Angle="-89.868"/>
                <TranslateTransform/>
            </TransformGroup>
        </gauges:Gauge.RenderTransform>
        <gauges:Gauge.Background>
            <LinearGradientBrush StartPoint="0,0" EndPoint="1,0">
                <LinearGradientBrush.GradientStops>
                    <GradientStopCollection>
                        <GradientStop Offset="0.0" Color="Red" />
                        <GradientStop Offset="0.10" Color="Red" />
                        <GradientStop Offset="0.10" Color="Green" />
                        <GradientStop Offset="0.90" Color="Green" />
                        <GradientStop Offset="0.90" Color="Red" />
                        <GradientStop Offset="1.0" Color="Red" />
                    </GradientStopCollection>
                </LinearGradientBrush.GradientStops>
            </LinearGradientBrush>
        </gauges:Gauge.Background>
    </gauges:Gauge>

And the code behind where degreeOutput is declared:

        private double degreeOutput;

can you explain the process? So far I've just set the value to my double variable but I'm not sure what to do after that. — Brian Var, Feb 01 '15 at 20:02

score 1 · Accepted Answer · edited May 23 '17 at 12:14

1

Generally speaking you can't bind to fields in WPF (see the answer to this SO question).

Try changing degreeOutput into a public property. This will be enough to feed the initial value through into the gauge control.

If you also want changes made by the gauge control to feed back into your property then the class containing the property must also implement INotifyPropertyChanged.

edited May 23 '17 at 12:14

Community

1
1

answered Feb 02 '15 at 14:21

Steven Rands

5,160
3
27
56

In this implementation, the changes will be one way only from `degreeOutput` to the gauge not vice versa. So from your answer, I've changed `degreeOutput` to a public property but now the device freezes I'm thinking as a result of changing degreeOutput to a public property: This is the class before I changed which was working: http://pastebin.com/JPhuphHe And this is the class after I changed to a public property which isn't working as it causes the device to freeze, any ideas as to why this change causes the code to freeze? http://pastebin.com/0E5mbeRw http://pastebin.com/7Dq5Smbz – Brian Var Feb 02 '15 at 20:39
1

@BrianJ The short answer is I don't know. Try changing `private double degreeOutput;` to `public double degreeOutput { get; set; }` and remove the `Degrees` property that you created. – Steven Rands Feb 03 '15 at 09:55
I need to remodel my project to MVVM it seems to set this up properly, thanks for the advice. – Brian Var Feb 03 '15 at 16:01

How to bind a field to a gauge control?

1 Answers1