DependencyProperty to change value in the ViewMode

Question

I have a UserControl which draws some lines where the coordinates (X1,X2,Y1,Y2) are bound to properties in the ViewModelClass, the ViewModelClass itself which handles the maths to draw the lines and the CodeBehind for the UserControl where you can set the value of a property which is needed in the ViewModelClass to draw the lines. The following code explains my Control and how it works:

UserControl.xaml

<Line x:Name="StartAngleLine" X1="{Binding Path=StartAngleX1}" X2="{Binding Path=StartAngleX2}" Y1="{Binding Path=StartAngleY1}" Y2="{Binding Path=StartAngleY2}" Stroke="Aqua" StrokeThickness="6"/>

UserControl.xaml.cs

public Constructor()
{
    private readonly ViewModel model = new ViewModel();
    DataContext = model;
}

public int StartAngle
{
    get { return model.StartAngle; }
    set { model.StartAngle = value; }
}

ViewModel.cs

public int StartAngle
{
    get
    {
        return startAngle;
    }

    set
    {
        if (value != startAngle)
        {
            if (value >= 0 && value <= 360)
            {
                startAngle = value;
                NotifyPropertyChanged();
                StartAngleChanged();
            }
            else
            {
                throw new ArgumentOutOfRangeException($"StartAngle", "Angle is out of range.");
            }
        }
    }
}

public double StartAngleX1
{
    get
    {
        startAngleX1 = centerX + (centerX1 * Math.Cos(StartAngle * (Math.PI / 180)));
        return startAngleX1;
    }
}

private void StartAngleChanged()
{
    NotifyPropertyChanged("StartAngleX1");
    NotifyPropertyChanged("StartAngleX2");
    NotifyPropertyChanged("StartAngleY1");
    NotifyPropertyChanged("StartAngleY2");
}

How can i set DependencyProperties (e.g. StartAngleProperty instead of StartAngle as shown in UserControl.xaml.cs) in my UserControl.xaml.cs and still make them change the Property in the ViewModelClass? Or is it better to leave things like they are in the CodeBehind and change the Properties in the ViewModelClass to DependencyProperties?

Answer 1

You could declare a dependency property in your UserControl like this:

public static readonly DependencyProperty StartAngleX1Property =
    DependencyProperty.Register(
        "StartAngleX1",
        typeof(double),
        typeof(MyUserControl),
        new PropertyMetadata(0.0));

public double StartAngleX1
{
    get { return (double)GetValue(StartAngleX1Property); }
    set { SetValue(StartAngleX1Property, value); }
}

and bind to it in the UserControl's XAML like this:

<UserControl ... x:Name="self">
    ...
    <Line X1="{Binding StartAngleX1, ElementName=self}" .../>
    ...
</UserControl>

Then there is no need to have a private view model in your UserControl. You would instead bind the UserControl's properties when you use it, like

<mycontrol:MyUserControl StartAngleX1="{Binding SomeViewModelPropery}" ... />