Drag and drop from datasource to WPF window not working

Ok. I actually went thru that article, just to show good faith and let you know that I actually want to help you.

I came to the following conclusions:

  • That article show a very basic scenario of getting data from an Entity Framework context and showing it in a WPF DataGrid.
  • It doesn't have any kind of validation nor business rules.
  • It doesn't have any UI behavior such as conditionally enabling/disabling or showing/hiding any UI elements.
  • That kind of scenario is where the Designer is useful, when you don't actually need anything except getting / saving data from / to a DB.
  • Unfortunately (or fortunately for all of us developers who make a living of it), most applications will require some level of validation and business rules and some level of UI logic.
  • The designer is really useless when it comes to developing complex logic.

You can use the designer for such situations where you don't require complex logic, however I must warn you the following cons:

  • The Visual Studio WPF designer produces fixed-size, fixed-position UIs. these type of UIs don't work well when executed in computers with different screen resolutions and DPI settings. Just like winforms.
  • It also produces XAML that has many unnecessary things (such as x:Name="categoryIdColumn" and things like Margin="13,13,43,191" which are really bad from a maintainabilty / scalability point of view)
  • From what I've seen, the designer-generated XAML also contains a CollectionViewSource, this is both a good thing and a bad thing. It's a good thing because it enables Design-Time Data in the DataGrid, but it is also bad because it bloats your XAML with lots of unneeded things and introduces unnecessary <Window.Resources> that complicate things up.

Now, this is the very minimal XAML needed for that DataGrid, without Design-time data support:

<Window x:Class="MiscSamples.DesignTimeDataGrid"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="DesignTimeDataGrid">
    <DataGrid ItemsSource="{Binding}" AutoGenerateColumns="False">
        <DataGridTextColumn Header="Category Id" Binding="{Binding CategoryId}"/>
        <DataGridTextColumn Header="Name" Binding="{Binding Name}"/>
    </DataGrid>
</Window>

You see? It's actually faster to type that (much more so with the help of Intellisense) than what it takes for you to browse the property window and set these properties manually.

My suggestion is that you get familiar with XAML instead of insisting in the hard way to do things


Another very important aspect to keep in mind is that generally speaking, you don't put anything in code-behind in WPF because it's not needed, therefore that tutorial is actually going against the WPF Way of doing things, but that's Ok because it's actually an Entity Framework tutorial, not a WPF tutorial.


ease of development

You really need to reconsider what you call "ease of development". When it comes to UI development, I call "ease of development" to actually being able to do what I want with the UI without having to resort to shitty procedural code practices involving P/Invoke (whatever that means) and "owner draw" type of things for evertyhing.

WPF provides REAL ease of development as opposed to the fake ease of development exhibited by winforms

  • winforms lets you do everything with a designer (and this is just because the code the designer generates is actually so shitty that nobody would have ever used winforms if they didn't have the designer) but then when it comes to adding complex DataBinding or UI logic you're stuck with winforms' incapabilities forever.

  • WPF encourages manual XAML writing, not only because XAML is declarative (as opposed to the procedural winforms approach), but also because the levels of customizability and reusability are so high that a designer-centric approach does not make sense.


drag and drop is the easy way out

No it's not. It's actually the hard way. The easy way is to learn XAML and be able to do Things you can't even imagine to do with winforms.


If a designer-centric approach still makes sense to you, you may want to try Expression Blend


Automatically Create Data Grids from Your Models

Using a data source to drag and drop a template onto a WPF control is an excellent and fast way to get up and running!

Start by doing this: In your project create a folder named Models, then use either Entity Framework DB first or code by hand the models you want to show.

OR see discussion below on Object binding...

In that same folder create a dummy class that is a property for IEnumerable like this..

public IEnumerable<MyClassModel> MyCollection { get; set; }

From there go to the Main Visual Studio menu, to View/Other Windows/Data Source and click that link.

Data Source Wizard

Click on Object and find the MyCollection property just created above.

Now open a user control or window in WPF but keep the datasources toolbox opened.

It should default to a DataGrid, but you can right click on the datasource and change it to detail, datagrid or select individual properties of the class it represents.

Simply drag that datasource onto the XAML's grid area. The right click on the new stuff you see and click reset to set the content to be the size of the entire window.

After having done this you will have code injected into the code behind of the view as follows in the window loaded event of that window, usercontrol etc.

        // Do not load your data at design time.
         if (!System.ComponentModel.DesignerProperties.GetIsInDesignMode(this))
         {
            //Load your data here and assign the result to the CollectionViewSource.
            System.Windows.Data.CollectionViewSource myCollectionViewSource = (System.Windows.Data.CollectionViewSource)this.Resources["Resource Key for CollectionViewSource"];
            myCollectionViewSource.Source = your data
        // }

Go back to the XAML and look for the CollectionViewSource KEY property that was also inserted when you dragged the property to the XAML. It looks like this:

Collection View Source KEY

Use the Key name in the code behind, and then "Bind" the CVS to your data source which is an enumerable of type MyClassModel it can live in the View Model or in the code behind of the view as you choose.

If you only use the CollectionViewSource to as the datacontext of the grid you do not need to implement INPC for any underlying collections! The CVS updates the view automatically everytime the source is updated! Once you get good at this you can create working View prototypes of data in 2 minutes! Forget hand-coding XAML that just takes too long.

Object Binding

Create a static class with a static method that returns something like this:

enter image description here

When using the datasource wizard choose the "Object" selection.

Click Ok and you should see something like this:

enter image description here

You have just mapped all of the properties into the data source definition.