WPF Usercontrol databinding with MVVM ViewModel

Question

I have spent quite some time on this so seeking help.

Simple data binding with usercontrol with mvvm light does not work.

I have done the following.

Created a MvvmLight (WPF451) project using VS 2015 and named it WpfDataBindingUserControlT1
Added a UserControl and renamed it to SimpleUserControl.xaml
Added some lables as a children(wraped in stackpanel) to the grid inside SimpleUserControl.xaml(All code is given below)
Added a dependency properties in the code behind of the SimpleUserControl.xaml(SimpleUserControl.cs) so that these will help me in databinding.

The data binding simply does not work. I have pulled half of my hair on this so please help. I guess I am missing very simple on this.

The code is as follows.

MainWindows.xaml

MainWindow.cs ( I did not change any thing in this file.)

using System.Windows;
using WpfDataBindingUserControlT1.ViewModel;

namespace WpfDataBindingUserControlT1
{
    /// 
    /// Interaction logic for MainWindow.xaml
    /// 
    public partial class MainWindow : Window
    {
        /// 
        /// Initializes a new instance of the MainWindow class.
        /// 
        public MainWindow()
        {
            InitializeComponent();
            Closing += (s, e) => ViewModelLocator.Cleanup();
        }
    }
}

SimpleUserControl.xaml

SimpleUserControl.cs (added a dependency prop)

using System.Windows;
using System.Windows.Controls;

namespace WpfDataBindingUserControlT1
{
    /// 
    /// Interaction logic for SimpleUserControl.xaml
    /// 
    public partial class SimpleUserControl : UserControl
    {
        public string CellValue
        {
            get { return (string)GetValue(CellValueProperty); }
            set { SetValue(CellValueProperty, value); }
        }

        public static readonly DependencyProperty CellValueProperty = 
            DependencyProperty.Register("CellValue", typeof(string), typeof(SimpleUserControl), new FrameworkPropertyMetadata
            {
                BindsTwoWayByDefault = true,
            });

        public SimpleUserControl()
        {
            InitializeComponent();
        }
    }
}

MainViewModel.cs (I have not changed any thing in this)

using GalaSoft.MvvmLight;
using WpfDataBindingUserControlT1.Model;

namespace WpfDataBindingUserControlT1.ViewModel
{
    /// 
    /// This class contains properties that the main View can data bind to.
    /// 
    /// See http://www.mvvmlight.net
    /// 
    /// 
    public class MainViewModel : ViewModelBase
    {
        private readonly IDataService _dataService;

        /// 
        /// The  property's name.
        /// 
        public const string WelcomeTitlePropertyName = "WelcomeTitle";

        private string _welcomeTitle = string.Empty;

        /// 
        /// Gets the WelcomeTitle property.
        /// Changes to that property's value raise the PropertyChanged event. 
        /// 
        public string WelcomeTitle
        {
            get
            {
                return _welcomeTitle;
            }
            set
            {
                Set(ref _welcomeTitle, value);
            }
        }

        /// 
        /// Initializes a new instance of the MainViewModel class.
        /// 
        public MainViewModel(IDataService dataService)
        {
            _dataService = dataService;
            _dataService.GetData(
                (item, error) =>
                {
                    if (error != null)
                    {
                        // Report error here
                        return;
                    }

                    WelcomeTitle = item.Title;
                });
        }

        ////public override void Cleanup()
        ////{
        ////    // Clean up if needed

        ////    base.Cleanup();
        ////}
    }
}

ViewModelLocator.cs (I have not changed any thing in this as well.)

/*
  In App.xaml:
  
      
  

  In the View:
  DataContext="{Binding Source={StaticResource Locator}, Path=ViewModelName}"
*/

using GalaSoft.MvvmLight;
using GalaSoft.MvvmLight.Ioc;
using Microsoft.Practices.ServiceLocation;
using WpfDataBindingUserControlT1.Model;

namespace WpfDataBindingUserControlT1.ViewModel
{
    /// 
    /// This class contains static references to all the view models in the
    /// application and provides an entry point for the bindings.
    /// 
    /// See http://www.mvvmlight.net
    /// 
    /// 
    public class ViewModelLocator
    {
        static ViewModelLocator()
        {
            ServiceLocator.SetLocatorProvider(() => SimpleIoc.Default);

            if (ViewModelBase.IsInDesignModeStatic)
            {
                SimpleIoc.Default.Register();
            }
            else
            {
                SimpleIoc.Default.Register();
            }

            SimpleIoc.Default.Register();
        }

        /// 
        /// Gets the Main property.
        /// 
        [System.Diagnostics.CodeAnalysis.SuppressMessage("Microsoft.Performance",
            "CA1822:MarkMembersAsStatic",
            Justification = "This non-static member is needed for data binding purposes.")]
        public MainViewModel Main
        {
            get
            {
                return ServiceLocator.Current.GetInstance();
            }
        }

        /// 
        /// Cleans up all the resources.
        /// 
        public static void Cleanup()
        {
        }
    }
}

SWilko · Accepted Answer

Add this line to your SimpleUserControl.cs constructor

public SimpleUserControl()
{
    InitializeComponent();

    (this.Content as FrameworkElement).DataContext = this;
}

You're basically setting the DataContext of the first element in the UserControl.

Jerry Nixon has a great article on this here

UPDATE forgot to add get rid of the RelativeSource eg

WPF Usercontrol databinding with MVVM ViewModel

Answers (1)

Related Questions