How to bind custom dependecy property to control's view model?

Jan Zahradník

I need to create a control with few inputs / output with lots of internal functionality. I think the best approach is to create Dependency Properties for interaction with other application parts and have a private view model with hidden functions.

Here is my sample:

Window

<Window x:Class="WpfApplication1.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:app="clr-namespace:WpfApplication1">
<StackPanel>
    <DatePicker x:Name="DatePicker" />
    <app:MyControl DateCtrl="{Binding ElementName=DatePicker, Path=SelectedDate}" />
</StackPanel>
</Window>

MyControl

<UserControl x:Class="WpfApplication1.MyControl"
         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
         xmlns:app="clr-namespace:WpfApplication1">
<UserControl.DataContext>
    <app:ViewModel />
</UserControl.DataContext>
<Grid>
        <TextBlock Text="{Binding DateVM}" />
</Grid>
</UserControl>

Control code-behind

using System;
using System.Windows;

namespace WpfApplication1
{
public partial class MyControl
{
    public MyControl()
    {
        InitializeComponent();
    }

    public static DependencyProperty DateCtrlProperty = DependencyProperty.Register("DateCtrl", typeof(DateTime), typeof(MyControl));
    public DateTime DateCtrl
    {
        get { return (DateTime) GetValue(DateCtrlProperty); }
        set { SetValue(DateCtrlProperty, value); }
    }
}
}

ViewModel

using System;
using System.ComponentModel;

namespace WpfApplication1
{
    public class ViewModel : INotifyPropertyChanged
    {
        private DateTime _dateVM;
        public DateTime DateVM
        {
            get { return _dateVM; }
            set
            {
                _dateVM = value;
                OnPropertyChanged("DateVM");
            }
        }

        public event PropertyChangedEventHandler PropertyChanged;
        protected virtual void OnPropertyChanged(string propertyName)
        {
            var handler = PropertyChanged;
            if (handler != null) handler(this, new PropertyChangedEventArgs(propertyName));
        }
    }
}

I need to achieve is to propagate date chosen in DatePicker down to MyControl's view model. Alternatively, is there any better pattern to use?

Sheridan

What you describe is a common misconception that all views should have a view model. However, it is usually far simpler (and more appropriate) for UserControls that are used as controls to simply use their own DependencyPropertys.

The problem with your method is that you have assigned the UserControl DataContext internally, so it cannot be set from outside the control. The solution is to not set the DataContext internally, but instead to use a RelativeSource Binding to access the UserControl DependencyPropertys like this:

<TextBlock Text="{Binding DateCtrl, RelativeSource={RelativeSource 
    AncestorType={x:Type YourLocalPrefix:MyControl}}}" />

If you really have to use an internal view model, then declare a DependencyProperty of that type and data bind to it in the same way that I showed above:

<TextBlock Text="{Binding YourViewModelProperty.DateVM, RelativeSource={RelativeSource 
    AncestorType={x:Type YourLocalPrefix:MyControl}}}" />

Collected from the Internet

Please contact [email protected] to delete if infringement.

edited at
0

Comments

0 comments
Login to comment

Related

From Dev

How to bind custom dependecy property to control's view model?

From Dev

Custom Control and View Model Binding with Property Changed

From Dev

How to bind a property of control to another control's property

From Dev

How to bind a property of control to another control's property

From Dev

How to bind data to a control's Visibility property

From Dev

How to bind data to a control's Visibility property

From Dev

How to bind a property in the view model of a usercontrol to a property in another usercontrol

From Dev

How to bind to a control's property which is inside control template?

From Dev

How to bind app's view-model to custom element using a promise?

From Dev

How to bind enabled/disabled status to a control instead of view model?

From Dev

Bind Property of a custom class to View

From Dev

Bind a property to another property of a custom control

From Dev

Bind a custom type property to a custom control

From Dev

How to programmatically bind a (dependency) property of a control that's inside a DataTemplate?

From Dev

How do I bind a WPF control's margin to a property?

From Dev

How to bind control to object property?

From Dev

How to bind control to object property?

From Dev

Bind to wpf custom control dependency property for tooltip?

From Dev

(Windows 10 UWP) How to bind Header property in PivotItem control into custom HeaderTemplate in Pivot control?

From Dev

How to bind user control property to other property?

From Dev

How to bind to a property in view but not in viewmodel?

From Dev

Bind a custom view to page model in xamarin forms

From Dev

Trouble binding user control to view model property

From Dev

WPF custom control, model as dependency property

From Dev

How to data-bind control's property within ControlTemplate, to the data-context of the window that contains the control with this template?

From Dev

How to directly bind two data properties into one control property using OData model?

From Dev

How to directly bind two data properties into one control property using OData model?

From Dev

Should I Bind a model property to View's progressbar value in this situation or other better way to do?

From Dev

How to Bind to Another Control Property in WPF

Related Related

  1. 1

    How to bind custom dependecy property to control's view model?

  2. 2

    Custom Control and View Model Binding with Property Changed

  3. 3

    How to bind a property of control to another control's property

  4. 4

    How to bind a property of control to another control's property

  5. 5

    How to bind data to a control's Visibility property

  6. 6

    How to bind data to a control's Visibility property

  7. 7

    How to bind a property in the view model of a usercontrol to a property in another usercontrol

  8. 8

    How to bind to a control's property which is inside control template?

  9. 9

    How to bind app's view-model to custom element using a promise?

  10. 10

    How to bind enabled/disabled status to a control instead of view model?

  11. 11

    Bind Property of a custom class to View

  12. 12

    Bind a property to another property of a custom control

  13. 13

    Bind a custom type property to a custom control

  14. 14

    How to programmatically bind a (dependency) property of a control that's inside a DataTemplate?

  15. 15

    How do I bind a WPF control's margin to a property?

  16. 16

    How to bind control to object property?

  17. 17

    How to bind control to object property?

  18. 18

    Bind to wpf custom control dependency property for tooltip?

  19. 19

    (Windows 10 UWP) How to bind Header property in PivotItem control into custom HeaderTemplate in Pivot control?

  20. 20

    How to bind user control property to other property?

  21. 21

    How to bind to a property in view but not in viewmodel?

  22. 22

    Bind a custom view to page model in xamarin forms

  23. 23

    Trouble binding user control to view model property

  24. 24

    WPF custom control, model as dependency property

  25. 25

    How to data-bind control's property within ControlTemplate, to the data-context of the window that contains the control with this template?

  26. 26

    How to directly bind two data properties into one control property using OData model?

  27. 27

    How to directly bind two data properties into one control property using OData model?

  28. 28

    Should I Bind a model property to View's progressbar value in this situation or other better way to do?

  29. 29

    How to Bind to Another Control Property in WPF

HotTag

Archive