Part 26 - Exercise: The Daily Rituals App
Description
Download the source code for this lesson at http://absolutebeginner.codeplex.com/
In this exercise we’ll build a project that combines many of the things we talked about previously into a single example. The Daily Rituals project is essentially it's a goal-tracking app. The idea is, for 30 days, you'll track your progress against all the goals you've created. ![]()
For example, I'll create a new ritual or goal for myself. I’ll click the + Add icon in the Command Bar …![]()
Which allows me to add a new Ritual. I’ll create dummy data for this demo, the Goal Name “Ritual 1” and the Goal Description: “Description of my new ritual”, and I will click the Add button …![]()
I’ll return to the main screen where I can see a list of rituals. (I’ve added a second one in the screen shot, below):![]()
I can click the “I Did This Today” button which will keep track of the days I completed this goal and it will show progress on a Progress Control below the Ritual. The progress bar will fill up over 30 days of establishing these daily rituals.
I’ll begin by (1) creating a new Blank App project (2) called Daily Rituals. (3) I’ll click the OK button on the New Project dialog to create the project.![]()
First, I’ll create a new folder called DataSource:![]()
Then right-click to Add > New Item … in that folder.
In the Add New Item dialog, (1) I’ll add a Class (2) named DataSource.cs then (3) click the Add button:![]()
First, I’ll create a simple Ritual class using the prop code snippet to create the auto-implemented properties. I’ll also add the proper using statement for the ObservableCollection<T> using the Control + [dot] keyboard shortcut.![]()
Second, I’ll flesh out the DataSource class adding a private field of type ObservableCollection<Ritual> called _rituals. I’ll create a new instance of ObservableCollection<Ritual> in the constructor. As you may anticipate, the rest of the DataSource class will define methods that operate on this private field.![]()
We’ll follow the pattern we’ve seen several times before now, creating a helper method called ensureDataLoaded() that will determine whether or not the _rituals collection contains instances of Ritual. If not, then we’ll call the (yet to be implemented) getRitualDataAsync() method.![]()
We delegate the responsibility of retrieving data from a serialized file back into an object graph stored in the _rituals collection to the getRitualDataAsync() method. We’ve seen this code before when working with serialized types that we need to “re-hydrate” back into an object graph. Most of the heavy lifting is performed by the DataContractJsonSerializer and the ApplicationData.Current.LocalFolder.OpenStreamForReadAsync() method.![]()
There are several things we’ll have to fix with this code, including the creation of a constant for the fileName which I’ll define near the top of the DataSource class:![]()
… and I’ll also need to add various using statements to satisfy all of the class references:![]()
Next, I’ll implement the corollary to the getRitualDataAsync(), the saveRitualDataAsync() method which will be delegated the responsibility of persisting / “de-hydrating” the object graph stored in the _rituals field to disk. Here again, most of the heavy lifting is performed by the DataContractJsonSerializer and the Application.Current.LocalFolder.OpenStreamForWriteAsync() method.![]()
We will want to allow one of our pages to add new Rituals to the _rituals collection. Therefore, we’ll implement a public method that will do that:![]()
Furthermore, we’ll want to retrieve the _rituals collection:![]()
We have enough of the data model in place. Next we can focus on the AddRitual.xaml page. I’ll right-click the project name and select Add > New Item … to display the Add New Item dialog. I’ll (1) select a Blank Page, (2) name it AddRitual.xaml, and (3) click the Add button:![]()
Before we begin work on the new page, we’ll need to be able to reference the DataSource class from the entire project. To do so, (1) in the App.xaml.cs, (2) I’ll create a public static field called DataModel (3) which will necessitate the need to add a using statement to the DataModel namespace.
<img title="clip_image036" src="https://files.channel9.msdn.com/wlwimages/19940ab4423a448c83e6a3180155d1c1/clip_



