WPF and DatabasesLinq-to-Entities, Data Persisters, Master Datail

Doncho Minkov

Telerik School Academyhttp://schoolacademy.telerik.com

Technical Trainerhttp://www.minkov.it

http://schoolacademy.telerik.com

Table of Contents Data Access Layer

Linq-to-Entities Linq-to-XML

Accessing the Data Layer DataContext

Master Detail Data Persister Paging WPF and Databases

Data Access Layer

Data Access Layer The Data Access Layer is a essential Used for access to the database

Class Library with single EntityModel class

This way we can use the same DAL with many applications

Data Access LayerLive Demo

Accessing the Data Layer

The DataContext When adding a reference to the DAL

project We can instantiate an entity model

in the XAML And set it for DataContext<Window … xmlns:datalayer=" clr-namespace:NorthwindDataLayer;assembly= NorthwindDataLayer"> <Window.DataContext> <datalayer:NorthwindEntities /> </Window.DataContext>

Accessing DAL After instantiating the EntityModel

we can simply bind some of the entities to a ItemCollection ListBox, ListView, TreeView, etc.

In MVVM it is not possible to access the DAL directly Done through the ViewModel In MVVM we need a DataPersister

object

<TreeView x:Name="TreeViewCategories" ItemsSource="{Binding Categories}">

Accessing the Data LayerLive Demo

Master Detail

Master Detail What is Master Detail?

When selecting a Category Show category info Show products in this category

<ListView Name="ListViewFamilies" ItemsSource="{Binding}" DisplayMemberPath="FamilyName"/><ListView DisplayMemberPath="Name" ItemsSource="{Binding ElementName=ListViewFamilies, Path=SelectedItem}"/>

Master Datail in MVVM Consider we have the property Categories in the ViewModel Somehow it gets data from the

Model Since Categories is a IEnumerable

we can get its ICollectionView Now we got the CurrentItem Can make property Products that

returns the products of the CurrentItem

Master DetailLive Demo

Data PersisterThe way to collect information

What is a Data Persister?

The Data Persister is the object that gives data to the Model Sometimes it is merged with the

Model It could be an EntityDataModel It could be a Linq-to-XML object It could just an object we created

How the Data Persister helps? Easier for mocking (unit testing) Better reusability

The DataPersister The DataPersister is the class that makes the connection with the Data (RDB, XML or object) Responsible for the CRUD May have validation

With this object the Model is pretty clean Almost no programming logic Loose coupling

Data PersisterLive Demo

PagingWhat is paging and why we need it?

What is Paging? A memory-management scheme

A computer can store and retrieve data from secondary storage for use in main memory

With paging the application retrieves data from secondary storage in same-size blocks called pages

Why use paging? Imagine a Database with over a

million records Store them in the dynamic memory

at once? Or take them by pieces with 100

records?

Paging TODO

PagingLive Demo

WPF and DatabasesWith MVVM

WPF and Databases Consider the usual case

You have categories with products in a Database

CRUD operations should be implemented

You have the following:

When selecting the DataContext of the Grid You get a Person object

<Grid DataContext="{Binding Person}"> <TextBox Text="{Binding Name}"/> <TextBox Text="{Binding Age}"/></Grid>

Categories EditorLive Demo

Questions?

WPF and Databases

Exercises1. Create a database holding continents,

countries and town. Countries have name, language, population and continent. Towns have name, population and country. Implement a WPF application that shows the continents in a ComboBox, countries in a ListView and the towns in a ListView and allows master-detail navigation. Use Entity Framework. Use paging and sorting for the long lists.

2. Implement add / edit / delete for the continents, countries, towns and languages. Handle the possible errors accordingly. Implement validation logic.

26

Exercises (2)3. Add a flag for each country which

should be a PNG image, stored in the database, displayed along with the country data. Implement "change flag" functionality by uploading a PNG image.

27