So finally we get to the fun part the fruits of all of our middle-tier/back end labors of generating classes to interface with an XML data source that the previous posts were about can now be presented quickly and easily to an end user. I think. Well see. Well be using a WPF window to display all of our various MFL information that weve collected in the two XML files, and well provide a means of adding, updating and deleting each of these entities using as little code as possible. Additionally, I would like to dig into the performance of this solution as well as the flexibility of it if were were to modify the underlying XML schema. So first things first, lets create a WPF project and include our xml data in a data folder within. On the main window, well drag out the following controls: A combo box to contain all of the teams A list box to show the players of the selected team, along with add/delete player buttons A text box tied to the selected players name, with a save button to save any changes made to the player name A combo box of all the available positions, tied to the currently selected players position A data grid tied to the statistics of the currently selected player, with add/delete statistic buttons This monstrosity of a form and its associated project will look like this (dont forget to reference the DataFoundation project from the Presentation project): To get to the visual data binding, as we learned in a previous post, you have to first make sure the project containing your bindable classes is compiled. Do so, and then open the Data Sources pane to add a reference to the Teams and Positions classes in the DataFoundation project: Why only Team and Position? Well, we will get to Players from Teams, and Statistics from Players so no need to make an interface for them as well see in a second. As for Positions, well need a way to bind the dropdown to ALL positions they dont appear underneath any of the other classes so we need to reference it directly. After adding these guys, expand every node in your Data Sources pane and see how the Team node allows you to drill into Players and then Statistics. This is why there was no need to bring in a reference to those classes for the UI we are designing: Now for the seriously hard work of binding all of our controls to the correct data sources. Drag the following items from the Data Sources pane to the specified control on the window design canvas: Team.Name > Teams combo box Team.Players.Name > Players list box Team.Players.Name > Player name text box Team.Players.Statistics > Statistics data grid Position.Name > Positions combo box That is it! Really? Well, no, not really there is one caveat here in that the Positions combo box is not bound the selected players position. To do so, we will apply a binding to the position combo boxs SelectedValue to point to the current players PositionId value: That should do the trick now, all we need to worry about is loading the actual data. Sadly, it appears as if we will need to drop to code in order to invoke our IO methods to load all teams and positions. At least Visual Studio kindly created the stubs for us to do so, ultimately the code should look like this: Note the weirdness with the InitializeDataFiles call that is my current means of telling an IO where to load the data for each of the entities. I havent thought of a more intuitive way than that yet, but do note that all data is loaded from Teams.xml besides for positions, which is loaded from Lookups.xml. I think that may be all we need to do to at least load all of the data, lets run it and see: Yay! All of our glorious data is being displayed! Er, wait, whats up with the position dropdown? Why is it red? Lets select the RB and see if everything updates: Crap, the position didnt update to reflect the selected player, but everything else did. Where did we go wrong in binding the position to the selected player? Thinking about it a bit and comparing it to how traditional data binding works, I realize that we never set the value member (or some similar property) to tell the control to join the Id of the source (positions) to the position Id of the player. I dont see a similar property to that on the combo box control, but I do see a property named SelectedValuePath that might be it, so I set it to Id and run the app again: Hey, all right! No red box around the positions combo box. Unfortunately, selecting the RB does not update the dropdown to point to Runningback. Hmmm. Now what could it be? Maybe the problem is that we are loading teams before we are loading positions, so when it binds position Id, all of the positions arent loaded yet. I went to the code behind and switched things so position loads first and no dice. Same result when I run. Why? WHY? Ok, ok, calm down, take a deep breath. Get something with caffeine or sugar (preferably both) and think rationally. Ok, gigantic chocolate chip cookie and a mountain dew chaser have never let me down in the past, so dont fail me now! Ah ha! of course! I didnt even have to finish the mountain dew and I think Ive got it: Data Context. By default, when setting on the selected value binding for the dropdown, the data context was list_team. I dont even know what the heck list_team is, we want it to be bound to our team players view source resource instead, like this: Running it now and selecting the various players: Done and done. Everything read and bound, thank you caffeine and sugar! Oh, and thank you Visual Studio 2010. Lets wire up some of those buttons now There has got to be a better way to do this, but it works for now. What the add player button does is add a new player object to the currently selected team. Unfortunately, I couldnt get the new object to automatically show up in the players list (something about not using an observable collection gotta look into this) so I just save the change immediately and reload the screen. Terrible, but it works: Lets go after something easier: The save button. By default, as we type in new text for the players name, it is showing up in the list box as updated. Cool! Why couldnt my add new player logic do that? Anyway, the save button should be as simple as invoking MFL.IO.Save for the selected player, like this: MFL.IO.Save((MFL.Player)lbTeamPlayers.SelectedItem, true); Surprisingly, that worked on the first try. Lets see if we get as lucky with the Delete player button: MFL.IO.Delete((MFL.Player)lbTeamPlayers.SelectedItem); Refresh(); Note the use of the Refresh method again I cant seem to figure out why updates to the underlying data source are immediately reflected, but adds and deletes are not. That is a problem for another day, and again my hunch is that I should be binding to something more complex than IEnumerable (like observable collection). Now that an example of the basic CRUD methods are wired up, I want to quickly investigate the performance of this beast. Im going to make a special button to add 30 teams, each with 50 players and 10 seasons worth of stats. If my math is right, that will end up with 15000 rows of data, a pretty hefty amount for an XML file. The save of all this new data took a little over a minute, but that is acceptable because we wouldnt typically be saving batches of 15k records, and the resulting XML file size is a little over a megabyte. Not huge, but big enough to see some read performance numbers or so I thought. It reads this file and renders the first team in under a second. That is unbelievable, but we are lazy loading and the file really wasnt that big. I will increase it to 50 teams with 100 players and 20 seasons each - 100,000 rows. It took a year and a half to save all of that data, and resulted in an 8 megabyte file. Seriously, if you are loading XML files this large, get a freaking database! Despite this, it STILL takes under a second to load and render the first team, which is interesting mostly because I thought that it was loading that entire 8 MB XML file behind the scenes. I have to say that I am quite impressed with the performance of the LINQ to XML approach, particularly since I took no efforts to optimize any of this code and was fairly new to the concept from the start. There might be some merit to this little project after all Look out SQL Server and Oracle, use XML files instead! Next up, I am going to completely pull the rug out from under the UI and change a number of entities in our model. How well will the code be regenerated? How much effort will be required to tie things back together in the UI?Did you know that DotNetSlackers also publishes .net articles written by top known .net Authors? We already have over 80 articles in several categories including Silverlight. Take a look: here.
