As it turns out, it is not terribly uncommon for a developer to need to work with some temporary data during the construction of the user interface. For example, perhaps the real data will come from a relational database...which is currently being constructed by your friendly DBA. Or, perhaps the exact business objects to be used by the program are currently little more than a collection of UML class diagrams.

When you are building a WPF or Silverlight application with Blend, you can elect to insert what is known as "sample data". As the name suggests, this provides a way for you to visualize the UI even when the live data is unavailable. As well, Blend sample data can be useful during the process of learning more about data binding techniques in general.

Fire up Blend and create a new WPF Application or Silverlight Application project named FunWithSampleData. Now, open the Data panel, and elect to insert sample data to your project:

At this point, your Data panel has been populated with a number of testing items, including a custom collection (which extends ObservableCollection) and a few default properties (named Property1 and Property2). While you could rename these default names, you might find this defaults are fine (after all, it is *sample* data). If you wish to change the names, double click on the current Collection node and rename this to PersonCollection. Likewise, rename your first two properties to FirstName and LastName:

You can add additional properties to your data store using the New Property button. If you click and hold this item, you will see you have three choices:

? Add Simple Property: Use this option to add a String, Number, Boolean, or Image property. By default, a String property is added, but this can be changed after creation.

? Add Complex Property: Use this option to create a property that can contain child properties (in other words, a new class with custom properties).

? Add Collection Property: Use this option to create a new class extending ObservableCollection.

Add a new "simple property" named Picture, which will automatically default to a String data property.

Once you have added properties, you can further configure their data types. The first approach is to change properties values by clicking on the embedded property dropdown editor. In the following figure, you can see how we can change the Picture property to an Image. Do know that the Image property can be configured to select a specific image file, but don't bother; the IDE will use some sample images by default.

In addition, you can configure all property data types if you click on the Edit Sample Values button:

Use the resulting dialog box to change the LastName property to a String data type. Notice how each property is being set to a set of default string data and image files (after all, this is in fact, sample data). Also note you can change how many test records you wish to have generated:

Once you have generated the sample data, you can drag and drop elements from the Data panel onto the artboard. Make sure you double check if the Data panel is in List mode or Details mode, as inserting sample data tends to default to "details mode". Here you can see the end result of dragging the PersonCollection on to a DataGrid control (while the Data panel was in List mode).

Also note that you have the option to transform your sample data from a flat list of objects, to a hierarchal format:

Here is the same data (which is now in a hierarchal format) bound to a new TreeView control:

If the topic of sample data is of interest to you, and I'd suspect it will be during the prototyping phase of new WPF or Silverlight projects, be aware that the Blend User Guide has a whole section on the topic, which building upon the topics examined here. Look up the Create sample data for more information:

Happy Blending!

If you are a .NET developer, you are well aware that the platform supports various ways to programmatically manipulate XML data such as the original System.Xml namespace as well as the LINQ to XML API. If your WPF or Silverlight applications need to modify XML data at runtime (add new elements, delete elements, update elements) then you will most certainly need to drop down to procedural code. However, the Blend IDE also provides a way to bind user interface elements to data which is contained in an XML document using the XML Data Source option of the Data panel.

Unfortunately, the ability to bind XML data to UI elements via an XML Data Source is only available for WPF applications. Of course, it is certainly possible to manipulate XML data in a Silverlight program, however to do so you will need to rely on procedural code. Look up the topic XML Data within the Silverlight documentation for information and code examples regarding XML data and Silverlight applications.

Given this restriction, create a new WPF Application project named WpfXmlDataBinding. If you have an XML document you would like to manipulate, you are free to use that specific *.xml file, however for this example, I will assume you are using the following Inventory.xml file:

   1: <?xml version="1.0" encoding="utf-8"?>

   2: <Inventory>

   3:   <Product ProductID ="0">

   4:     <Cost>5.00</Cost>

   5:     <Description>

   6:       Eight Times the sugar and twice the caffeine

   7:     </Description>

   8:     <Name>Super Spazz Soda Pop</Name>

   9:     <HotItem>true</HotItem>    

  10:   </Product>

  11:   <Product ProductID ="1">

  12:     <Cost>10.00</Cost>

  13:     <Description>A soothing night time cookie</Description>

  14:     <Name>Sleepy Time Cookies</Name>

  15:     <HotItem>true</HotItem>        

  16:   </Product>

  17:   <Product ProductID ="2">

  18:     <Cost>15.00</Cost>

  19:     <Description>It's Tofu, what can you say?</Description>

  20:     <Name>Joe's Tofu</Name>

  21:     <HotItem>false</HotItem>        

  22:   </Product>

  23: </Inventory>

Insert this file (or your custom XML file) into your current project using the Project | Add Existing Item... menu option. Once you have done so, you should see this file within the Project panel. It is not mandatory to include an XML data file into your project in order to bind to it with the Data panel, however this does make it easy to open the file within Blend for editing.

Now, open the Data panel, and opt to add a new XML Data Source:

From the resulting dialog box, browse to whichever XML document you wish to make use of (again, here I am assuming the Inventory.xml file). Name your new XML data source InventoryXmlDataStore and store the object resource in the current document:

At this point, your Data panel should look something like what you see here:

If you examine the XAML data located in MainWindow.xaml, you will notice that a new object level resource of type XmlDataProvider has been defined:

   1: <Window.Resources>

   2:   <XmlDataProvider x:Key="InventoryDataSource" 

   3:                    Source="\Inventory.xml" 

   4:                    d:IsDataSource="True"/>

   5: </Window.Resources>

Now that we have established our XML data source, we can drag and drop the nodes from the Data panel onto the artboard, just like we did when we created an object data source. Thus, if you were to drag the entire Product node to the artboard, the IDE will generate a ListBox which displays all data for each XML element. Notice that the ItemsSource property has been bound to the <Products> node using an XPath expression:

   1: <ListBox HorizontalAlignment="Left" 

   2:   ItemTemplate="{DynamicResource ProductTemplate}" 

   3:   ItemsSource="{Binding XPath=/Inventory/Product}" 

   4:   Margin="89,65,0,77" Width="200"/>

As well, the generated template (specified by the ItemTemplate property) uses some additional XPath expressions to make to the various attributes and sub-nodes of the <Product> node:

   1: <DataTemplate x:Key="ProductTemplate">

   2:   <StackPanel>

   3:     <TextBlock Text="{Binding XPath=@ProductID}"/>

   4:     <TextBlock Text="{Binding XPath=Cost}"/>

   5:     <TextBlock Text="{Binding XPath=Description}"/>

   6:     <CheckBox IsChecked="{Binding XPath=HotItem}"/>

   7:     <TextBlock Text="{Binding XPath=Name}"/>

   8:   </StackPanel>

   9: </DataTemplate>

Again, similar to when you are working with an object data source, you can also drag individual attributes (such as ProductID) or sub-nodes (Cost, Description, etc) directly to the artboard to generate ListBox controls which only display that subset of data. Thus, if you were to drag the HotItem node to the artboard, the IDE will generate a new ListBox control using a new related data template:

   1: <!-- The ListBox -->

   2: <ListBox HorizontalAlignment="Right" 

   3:          ItemTemplate="{DynamicResource ProductTemplate1}" 

   4:          ItemsSource="{Binding XPath=/Inventory/Product}"   

   5:          Margin="0,78,54,64" Width="200"/>

   6:  

   7: <!-- The data template-->

   8: <DataTemplate x:Key="ProductTemplate1">

   9:   <StackPanel>

  10:     <CheckBox IsChecked="{Binding XPath=HotItem}"/>

  11:   </StackPanel>

  12: </DataTemplate>

So there you have it! As you can see, the Blend IDE makes it simple to bind XML data to UI elements. Of course, we could continue to alter the UI display by altering the associated data template; but that will be the topic of another post.

Happy coding!

Thanks to our loyal customers and the great work our team members are doing for those customers, we are growing. We're looking for top talent to join our award winning team. Our staff get to teach the top firms in the country on the latest technologies or use those same technologies to build great new application for clients.

If you like solving challenging problems with great technology this might be the place for you.

Here are some of the needs we have:

·         Senior Developer/Architect (.Net Silverlight WPF WCF)

·         C# ASP.NET Developer

·         Software Developer (.Net)

·         Software Developer (ASP.Net MVC)

·         Software Developer (C# ASP.NET)

·         Sr. Systems / Software Engineer ( C#.Net )

·         .Net Manufacturing Systems / Solutions Architect

·         C#.Net developer

·         .Net Developer

·         Systems / Solutions Architect (.Net Manufacturing)

·         ASP.Net MVC Developer

·         Senior .Net Silverlight WPF WCF Developer/Architect

·         Sr. C#.Net Systems / Software Engineer

·         Senior Java Developer\Architect

For more details on our jobs, click here.

You can also apply online or if you find a job that is perfect for a friend, we make it easy for you to send it to them.

Let us know if you find one that is perfect for you or if you know someone who may be a great fit.

We’re offering a free training certificate to anyone who refers someone that joins our firm.

Thanks!

In this introduction to WPF 4.0 training video, learn:

• Understand the motivation behind WPF
• Examine the various ‘flavors’ of WPF applications
• Overview the services provided by WPF
• Examine the core WPF assemblies and namespaces
• Work with the Window and Application class types
• Learn the syntax of XAML
• Understand the XAML / code relationship

For quick and dirty apps, data entry apps, or straight forward business apps, some experts still suggest using Winforms.  Why?  Is it quicker to create a Winforms app than a WPF app?  Not at all!  Here’s why:

1. WPF’s Canvas Layout Manager.  Do you like dragging controls on a form, setting properties, and adding some event code?  You can do all of that and more with Canvas Layout Manager.  By starting with WPF instead of Winforms, if an application, first designated as a short-term solution, ends up being a long-term application, WPF is a better application foundation.
2. Microsoft Expression Blend.  Microsoft Expression Blend makes UI development easy (really easy).  Simply drag and drop items, set properties, and do binding.  You can create prototypes without using Visual Studio.  When Blend was first released, developers thought it was for designers.  Times have changed.  With the latest version of Blend, developers can quickly build a UI.  In addition, developers can do code behind logic without opening Visual Studio.   Finally, Blend is free with MSDN.
3. Flexibility and Extensibility.  If an application is built with Winforms, future choices are limited.  With WPF, an app can easily move to a web app or a mobile device.  Not true with Winforms!  In WPF, a web or mobile version is just some markup away.
4. Application Look & Feel Consistency.  With Winforms, there are custom controls.  With WPF, developers get those controls and more… Styles... Resources... Templates!  These tools simplify UI creation and management.
5. Happy Developers.  Do you lead an application development group?  If yes, choose WPF and your developers will love you.  They’ll be more innovative and productive.  More productive developers = Happy developers.  Happy developers = Long-term employees.

In the world of Windows Presentation Foundation (WPF) or Silverlight, Prism is a set of assets that helps you build modular enterprise applications.  Often, these applications contain rich user interfaces and evolve over time as business requirements evolve.  Prism can improve your ability to deliver consistent, maintainable, and industry-standard software.  Here are 7 things you absolutely need to know about Prism before venturing into your first Prism project.

1.    Prism has had different product names

Prism was an early “code name” for the Composite Application Library (CAL), but then it was renamed to Composite Application Guidance for WPF and Silverlight.  That’s a mouthful.  Now it’s renamed again to Prism, probably for the better.

2.    Prism is on CodePlex

You can obtain Prism from CodePlex at http://compositewpf.codeplex.com/.  Earlier versions of Prism required you to download files from both CodePlex and MSDN, but thankfully it is simpler now.  You can download all the requisite libraries, source code, and documentation from the CodePlex site above.

3.    Prism has many assets

Prism is a collection of library source code (that can be modified or extended if needed), signed binaries, extensions to the Unity Application Block and Managed Extensibility Framework (MEF), reference implementations, quick starts, and documentation.  The CodePlex site also offers additional material in the form of blogs, knowledge base, and known issues.  Finally, many industry professionals, including Intertech Consultants, have written articles, blogs, white papers, and sample programs to help you learn the various aspects of Prism.

4.    Prism has multiple versions

The current production version of Prism is 2.2, which was released in May 2010.  The next release of Prism is 4.0, which is currently in Beta (drop 10).  Both versions (and earlier releases also) can be downloaded from the link provided above.  There is no Prism version 3.x.

If you’re looking to build and release a new Prism WPF (or Silverlight) application soon, then Prism 2.2 is the better choice given its stable status.  Prism 4.0 is planned for industry release in the Fall of 2010, meaning it may be your better option if you’re planning or soon beginning a new Prism WPF project.  Both of these versions target either WPF or Silverlight applications developed with Visual Studio 2010 using .NET Framework 3.5 SP1 or 4.0 as the baseline framework.  If your project doesn’t align with those requirements, then an earlier version of Prism is probably a better choice.

5.    Prism provides choices

Prism has many great pieces of functionality, but you don’t need to use all of them.  It’s like the people you friend on Facebook, or the food you eat from a buffet, you get to choose what pieces of Prism are appropriate for your application.  If you like the concept of user interface composition but nothing else, that’s fine – use that only.  If you don’t want to leverage any Prism functionality except the Event Aggregator, go for it.  You choose what’s right for each project.

From an architectural perspective, Prism provides the following options

• Bootstrapper – this provides application initialization
• Shell and Shell Presenter – these provide the general visual layout structure and behavior for an application
• Regions – these provide placeholders for visual content and enable composite views
• Modules – these plug-ins enforce vertical or horizontal slices (or both) in an application, and enforce adherence to your chosen Presentation Model pattern
• Views – these provide the content to display on the screen
• Synchronous Communication – via commands
• Asynchronous Communication – via event aggregation or services
• Services – these provide either module-specific or shared-use functionality
• Multi-targeting – this provides ability to use the same code base to deploy as either a WPF or Silverlight application

6.    Prism employs patterns

Most enterprise applications initially require or evolve to a point where common patterns are employed to provide application maintainability, performance, decoupling, etc.  Prism applications also employ patterns, many of which are supported directly in the Prism libraries or reference implementations.  Some of the key patterns you should know/learn include:

• Controller
• Dependency Injection / Inversion of Control
• Event Aggregator
• Façade
• Plug-in
• Presentation Model – either Model-View-ViewModel (MVVM) or Model-View-Presenter (MVP)
• Repository
• Service Locator

7.    Upgrading Prism 2.x applications to Prism 4.0 is not seamless

Prism 4.0 changed and deleted some namespace and assembly names, meaning you’ll need to adjust your Prism library references accordingly.  Here’s a brief summary of changes (realizing that 4.0 is not yet final release and this info could change).

Microsoft.Practices.Composite namespace changed to Microsoft.Practices.Prism across all assemblies

Composite.Presentation namespace deleted and its classes moved to Microsoft.Practices.Prism namespace

Prism 4.0 added a new XAML XmlnsDefinition of http://www.codeplex.com/prism.   Although the existing XmlnsDefinition of http://www.codeplex.com/CompositeWPF still exists, it is recommended that the new one be used.  We’re assuming that the existing definition will eventually be deleted permanently.

The bootstrapper is enhanced in Prism 4.0 to better enable use of Unity or MEF.  If you are using the UnityBootstrapper class, it is now derived from a new Bootstrapper base class in the Microsoft.Practices.Prism assembly.  Additionally, some property names and method names were changed.  Here’s a brief summary of changes (realizing that 4.0 is not yet final release and this info could change).

LoggerFacade property renamed to Logger

GetModuleCatalog method renamed to CreateModuleCatalog

ConfigureModuleCatalog was added

ConfigureServiceLocator was added

There are other library changes affecting the module catalog, regions, and event aggregator that may impact your effort required to upgrade a Prism 2.x application to 4.0.  The Prism 4.0 release documentation and API reference would be good starting points for more information.

It can be a little daunting to get started on a Prism application.  Start small, know your requirements, and preferably do a prototype to get your feet wet with the technology.  Intertech Consultants have implemented several real-life Prism applications for WPF and Silverlight; give us a call to help you guarantee your application’s success.

This is a 25 minute WPF video training from a presentation delivered by Intertech at Microsoft.