Easy-to-follow video tutorials help you learn software, creative, and business skills.Become a member
It's time to stop looking and start writing. Let's bring in our ShakespeareSonnets and write some code to be able to put it on the screen. The first thing we do is come to the Solution, come to the Sonnets project and Add a New Folder, and we will call it Content. Inside the Content folder, we will Add an Existing Item for those of you with the exercise files, that's going to be in the Sonnets_End folder for this chapter, and it's called ShakespeareSonnets.xml.
Similar to the data we used for units converter for images and so forth, we have to make sure that this is content, so when we go the Properties page, in this content but we need to make sure it's says Copy always. So it's actually gets included into our build. We are done with properties, and now to actually make this run, what we are going to do is we are going to come down to the MainViewModel and look at its LoadData method. So we come down here, and we see the LoadData method that came from the template which puts scan data into the view model.
We want to put real life Shakespeare data in it, so we are going to select comments ahead of that method and entire LoadData method, delete it and put our code in. Let's take a look at what this does. What it does is load the content of our ShakespeareSonnets.xml into an XDocument, and you can see that the XDocument has a little red squiggles underneath it which means we need to add a new name space. So let's go the top and type using System.Xml.Linq.
you see from the red squiggle under Linq that we don't have the proper assembly so let's go to the Solution Explorer, right-click on References, select Add Reference click here to sort the list by name, and when it's in ascending order, we will come down to the bottom, and we will find System.Xml.Linq. We will click OK and red squiggles go away which means we have that code that we need. So now let's scroll back down to our LoadData method. So we load the contents of the ShakespeareSonnets.xml file into a XDoc.
Let's take a look what that file looks like. Each sonnet has a number, an id, it has a Roman numeral letter, and it has a body, and that goes on for all 154 sonnets. So in order to load this into our data structures, what we do is select the Sonnets Descendants so that we get all of the sonnet data, and we are going to do for each loop, creating a new instance of ItemViewModel for each sonnet. We create the instance, we set the LineOne property equal to the Roman numeral character of the sonnet that we extract from the XML.
Then we are going to go through, and iterate through each line and the reason that we are going to do that is because we need to do two things and the LineTwo property of the Item view model, we want to put first line of the sonnet, and then the line 3 property of the ItemViewModel, we want to put the entire sonnet with lines 13 and 14 indented. We have a counter to know which line we are on, we have a string so we can accumulate the body, and we go get each one of the line elements inside the body and do before each over that.
We say, it was the first line, we set the LineTwo property because that's going to show up on our master page where we have the roman numerals and the first line of the sonnet, and then we say if the LineNumber is less than 13, we simply put the line in as it is if the line is 13 or greater, we put in the line and an extra of couple of spaces in order to indent those last two lines. Finally, when we are done iterating over the lines, we set the LineThree property of our ItemViewModel. Now at the end here, we now have a new ItemViewModle instance, and we added to the items collection for this page so that we see all the items in the main page list box and so we also have those two extracts, remember over in the details page we looked at the fact that it comes back to this items property and extracts the selected one to show on the details page.
So let's go ahead and give this a try and voila, we have 154 sonnets, and if we come down to our favorite sonnet and click on it, there we go, Shall I compare thee to a summers day? Right there in front of us. Let's exit the app, and we need to do the same two things here that we did at the end of the unit's converter. Let's add the above box, and let's customize the icons. We will come here, we will say add new items, select Windows Phone Portrait Page call it About.
In this case we are going to use the same code snippet we used for units converter and change the title, like up here let's say SONNETS, over the Solution Explorer and open the About code and the same thing, you will select it, we will use the code snippet, change the title of the app Let's say SONNETS and change the namespace here. And finally, we will come over to the MainPage.xaml.
Now so far we haven't have any application bar going on in this particular thing so we are going to come down here, and we are going to uncomment the application bar xml that's in the template. We can do that by coming to Edit > Advanced > Uncomment Selection. We are going to delete the ApplicationBarIconbutton elements because we don't have any of those, and we are going to delete the two template menu item ones and twos, and then add our codes in here.
Change this to the to say About sonnets. And finally, we will come to our MainPage.xaml, go to the bottom and add the method which we actually invoke the About box, and we are good to go. Let's give it one last run. One of things that can happen to you when you copy, code, end our xaml from another projects and put it into a new project. What happens is that our About.xaml up here has the name of our namespace for our Class.
So for instead of UnitsConverter, this needs to be sonnets. Some of this is going to happen to your many times as you move things around between projects. I know it is the name space in the code, have to be correct. The name space in the xaml has to match. Now if we try to run this Right now, we would end up with some compile errors because we change the xaml let's go over to the Solution Explorer and right-click here and say Rebuild Solution because that will allow xaml and the code to get in sync. So the compiler knows the two of them are together.
So now when we run it, we will deploy off here to the emulator, it was our sonnets, here is our About box, and when we come back, we can look and see there is our new icon, which is the roman numeral for 154. Now we are done with this app, and this is what we are going to do with these one, we will pin it to the Start menu. So there now we are now done with app number two, here in Windows Phone SDK Essential Training.
Get unlimited access to all courses for just $25/month.Become a member
61 Video lessons · 100158 Viewers
56 Video lessons · 113178 Viewers
71 Video lessons · 82038 Viewers
131 Video lessons · 39367 Viewers
Access exercise files from a button right under the course name.
Search within course videos and transcripts, and jump right to the results.
Remove icons showing you already watched videos if you want to start over.
Make the video wide, narrow, full-screen, or pop the player out of the page into its own window.
Click on text in the transcript to jump to that spot in the video. As the video plays, the relevant spot in the transcript will be highlighted.