Advanced WinRT
CC Attribution - NonCommercial - ShareAlike 3.0 Unported:
You are free to use, adapt and copy, distribute and transmit the work or content in adapted or unchanged form for any legal and non-commercial purpose as long as the work is attributed to the author in the manner specified by the author or licensor and the work or content is shared also in adapted form only under the conditions of this
Cleeren, Gill
Windows Runtime (aka WinRT) is the new kid on the block for developers. It forms the foundation of the development of Windows 8 Metro style applications. But what exactly is WinRT and what does it enable developers to do? In this session, we’ll take a look at how WinRT is opening up Windows 8 to developers. We will cover several, more advanced topics using WinRT, including MVVM, file access, background tasks, push notifications, the async pattern and more.
 Okay, good evening everyone and thanks for staying so late at this after this long day of great sessions here So in this last session of today, I'm going to be talking to you about some more advanced stuff in Windows runtime or win RT So it's not gonna be a level 400. I don't think it's time yet for level 400 in win RT This is this is like the session after you've seen all the introduction talks from Microsoft You've done some playing with it, but you still have quite a lot of questions So what I did is I get at quite a few topics that I think are interesting At least for me that were interesting and I hope they will be for you as well So let me quickly introduce myself because we have a lot of things to do. So my name is a jill klaren I come from Belgium. I think it's a third time here at NDC and I work at a company called Ordina where I'm doing mostly XAML stuff WPF and and self-light their projects I'm a civil light MVP and a regional director for Microsoft and I've written a book I've actually written two books in civil light and My blog my email my Twitter you can read them from there as well I will post all these demos as well as the slides on my blog properly tomorrow So this is the new book that I have released on civil light 5 It's called civil light 5 data and services cookbook. It's available in the store here as well The reason I'm including it here because there's actually a lot of things here in this book that are relevant for Windows 8 Development as well this book focuses mostly on the enterprise stuff So services data binding MVVM rear services also covering some Windows phone and I haven't Counted yet by I think let's say 60 70 percent should be at least applicable to Windows 8 Metastyle apps as well So there's a lot of interesting things in there if you're doing XAML XAML development currently or start planning it Planning on doing it in the coming months All right So what I did is I actually created a presentation. It's way too long unless you want to stay here until 9 everyone Yeah, okay, cool okay, so So what I'm going to do is I'm gonna introduce you the topic that I'm gonna be that I have prepared for you and Then we'll do some vote. We'll do a vote and On which topics that seem most interesting to you and we'll pick out the ones that get the most votes So I have something on periodic tile updates as well as push notifications So periodic tasks, you don't hear people talk a lot about periodic tasks They basically are a polling system to a service that updates the tile push notifications some Sometimes it's also a bit complicated Then we have a very big block on data. I'm not gonna split that up because that depends on the other So there's a big block on data and services that contains things like data binding. What is possible? What is not possible? Some things on data controls Some things on OData how you can interact with OData How you can do background downloads how you can access regular WCF services JSON service What is available in winRT to do that? And we're gonna finish that part if we if we get to it at least by taking a look at the live SDK services to interact or to allow your apps to interact with the live SDK for example to include the SkyDrive I have a part on localization that might be interesting because your apps are gonna be deployed in a worldwide app store So localization of your apps is gonna be very important Asynchronous development. I have some slides on async for the people have never seen any async Happening or what it's doing or how it's actually working. I have something on files Local and roaming data. How is that actually working? You heard Microsoft talk a lot about roaming data But what are the options to do local saving? What are the options to do remote saving and how can we interact with the local file system? Can we interact with the local file system? I have a part on reusable components something that you built and managed code and you can for example reuse in C++ or in JavaScript and There is also a part on background tasks and Lockscreen apps the back of tricks will do that in any case. It's that's two three minutes of some code samples that might seem interesting Okay, so we'll do this by popular demand Who wants to see something on prelactile updates and push notifications? No one wants to see something. Okay, that's not good If we're gonna end up with a list of zero then we can all go home Okay, so no one wants to see that. Okay. Who wants to see data and services? Yeah, quite a few. Yeah, that's one two three four five six seventeen if I can correctly a sink Three five six six or so Local files data acts as a local data taxes roaming data one two three four five six seven eight ten I'm very good at counting people Building reusable components That's a very small so we can do that for sure great. That's that thing that was 12 if I'm not mistaken. Yeah Oh 12 might have been 13 didn't catch that area and I'm background tasks and lock screen apps That's a bit more that's 15 so that should be so we should be starting with this one Then whoops, then we're gonna do a background Okay, so that's from the form to the back then And reusable components, I think we're gonna be around of out of time by then but we'll see where we get And then we'll do the back of tricks. So the data parts of course the longest past that's bit of my One of the things that I like doing most working with data services hands the book. Okay, so the first part is gonna be Data and services and look how handy I did that you can create areas in your Or how is it called sections in Windows in PowerPoint presentations? Handy if you allow the public to choose what you want to see. Okay, so Let's start with data and services First thing I want to talk about is data binding who loves data binding Everyone loves data by everyone who has done some XAML development was done MVVM loves data binding I'm sure they do now if you've taken a look at the At winRT and I hope I assume most of you have taken a look at some chat sessions of Microsoft Played with winRT already. Maybe I've already built the next Angry Birds in winRT. I don't know You will have noticed that not everything that you know Coming from WPF coming from Silverlight is supported in in Metastyle apps in winRT. So what is supported by the way one big disclaimer This entire presentation is running on consumer preview I didn't have the time to upgrade. I think it's 30 demos in total to Since since how many days it's released now four days. So Maybe there are some changes Could be that some things are not really correct like I'm saying them anymore So my apologies for that in advance. So in consumer preview at least What do we have that is supported to regular data binding? What I mean by that is the data binding syntax hasn't changed The the mode one way two way that is supported element binding So binding and one element to another element is supported Converters are supported not 100% in the sense that the parameters change model binding So you bind to an object That you set as a data context that is supported indexes data templates who doesn't love data templates I love them Collection view source something that was added in silverlight if I'm not mistaken silverlight three The notification system so the I know to decay those are the I know to fair property changed and I know to find collection changed that also works Binding to Jason services WCF services will see that later on and we can see data binding exceptions in the output window boo-hoo anyway If you see this list, I might have missed a few things But there is something that's that's quite a few things that actually aren't there. There's no string format There's no format value. So the binding base properties not there because the market extensions not there implicit data templates Not there data binding breakpoints. I love that feature in in silverlight five there That's that's doesn't work in win RT at least in the version and that we're using here today. So to to To make a statement here, we are more or less with data binding engine in win RT at the level of Silverlight to silverlight three ish somewhere in between That means a lot of features that if you've done silverlight if you're doing WPF Are not available in win RT, which is a bit of a Setback basically I'm gonna very quickly show you a couple of Demos so I couldn't of course start my demos up front Where is Data binding so I'm gonna show you some very basic data binding samples just To set the record straight so that everyone knows what we can and cannot do Okay, so I'm gonna run this I Have spent hours on this demos create making them nice as you can see here. I have the original background So what does work an element binding works as you can see here? I have a list box I can click on one of the items in the list box and a text block is automatically being updated It doesn't follow the screen there, right? It's readable. Okay So you can see an element binding works if we take a look at the syntax. That's very quickly do that That's not waste too much time. So an element binding is all about XAML codes. Go away you go away What's this now an empty window? Okay, that's cool Thank you. So We have here an element binding we have a text block here and that's text blocks as text property is Bound to another element which is that list box main list box and it is binding to the selected item That was added in self-light in self-light three if I'm not mistaken. So binding to elements works then object binding Yeah, I'm gonna skip on that one observable collections works So for example here, I have a bound this list box to an observable collection And I'm gonna add some Persons to it as you can see here. I'm not updating that list box It's automatically being updated for me. So if we take a look at that that is the observable collection one That's what you see here. We have an observable collection of person instances and to that Initially, I add only two and when I click on that add person I add some other persons to that list box Automatically, it doesn't have we don't have to do anything manually. It works because of the observable collection We all know that right, so we're not gonna spend too much time there Notify property changed also works there we go now We're bound to something that doesn't have any values set yet now I'm gonna change that object because that object implements the I notify property change property change the event is being called Oh, it's being raised this updates this person. Sorry is now shown in the UI and that interface hasn't changed as much as a As long as I looked at it So we have the changeable person class here that implements the I notify property change which has an event called property changed that we raise Whenever the object sorry the property is changing. You have to do that manually that hasn't changed from WPF or self-right either Converters as you can see here. They work. This is sample from the SDK. I'm not mistaking so here we have a letter great and it's actually binding the Value of this slide here to a value as you can see here So if you get a hundred percent you are superstar if you get below the fifth oops if you get below the 50 percent You get an F. Okay So that is converters for you. So a converter is a class that implements the I value converter interface as you can see here the I value converter Which has a convert and convert back method which gets in the value does it converge in this case to? to a string and I'm sorry to To an integer everyone I'm taking yeah, and then checks Returns the string value and that is being shown in the UI that instant that converter is instantiated And it's used here in the binding expression text element name and then we have the converter being used Nothing out of the ordinary I think and then we have we have data bind as we data templates data templates also still keep on working So here we see a list box in this case and the items contain the color inside of the object themselves And we are binding So we are using a data template as we have done that in WPF and silver light for many years now in winarty in the exact same way So we have here on that list box an item template and the item template is set to a data template Which contains a border that's giving the background color So we are binding the background to that color and the tech look is being used as well nothing special really cool things They still work so those are the things more or less that still work If you're coming from another sample technology now one thing that is Was not possible in silver light Is binding to anonymous types? It wasn't possible in silver light to bind to anonymous type For example, you do this query through this link to object query and you're gonna bind to the result It wasn't possible to do that in in in silver light. It doesn't didn't work Now you can simply say well, I'm gonna create a new object on the fly as an anonymous type It's like new blah blah blah and it's actually possible to bind for example your data template to properties inside of that Anonymous type that wasn't possible before let me prove that to you So that's still in the same demo So what I'm gonna do now here is I'm gonna bind to that same list box using in the data template I'm gonna do a query on my items and I'm gonna get all the values that are that that have the Word red in them as you can see here. That's so that's the red the reds and the red devils or something So, how do we do that? Let's take a look at the code so anonymous types that this one So we have here a link query a link to object query the teams is a class that Is basically inheriting from a listing team so a generic list and so what do we do? We add some new team instances. That's what we do when we create a new teams object for this demo Now I'm going to do a link query from team teams where the name contains red select me a new anonymous type And I'm gonna return that and see that we have a team city team name and team color here And if we now take a look at the XAML code that generated the view that we saw just seconds ago We see that we have a list box item template and we are simply binding to team color and team name If you try that in silver light, it won't work. This is something that works in metro didn't work in winner team Sorry, it didn't work in silver All right, so that demo can go away Okay now Controls binding to control that's basically the same thing There are some new controls interesting controls added in Windows 8 in metro list controls basically List you the grid view the flip view the semantic zoom. I'm not gonna spend time on Explaining you what each of these controls do I'm gonna spend some time on a few extra features the first one I can't show you because it doesn't really work at least I didn't found out find out how it really works in consumer Preview I found to be the bug in consumer preview But anyway, it should be it should be happening in the maybe it works in the release preview So what is this cool feature now? Imagine that you have a grid view that is binding to a list of thousands of thousands of images returned from flicker now In essence the grid view doesn't have any issue with that It is internally virtualized meaning that it will only create the items that are physically in the view and a few extra ones So you had that in silver light you had that in WPF with the list box So for example as well it only created the items in memory that was being shown at a certain point now virtualized Is it sorry internally? It is virtualized now If however you are binding to a An XML that is being returned for example from flicker that is containing 10 10 thousands of of Tags image tags it might be a bit of a burden on your service Because it might be a bit too much for your service in fact because maybe you say well The user searches for Oslo and there's going to be 10 thousands of pictures of Oslo So you don't want to you don't want to return that service response or you don't want to make that service response that big So the grid view however has two properties that allow it to when you start or when the user starts flipping through them That notices that you are at the end of what has been loaded And then you can use the load more items async and it has more items It has more items has has to be set to true And then at some point an event is going to be triggered that allows you to do some asynchronous loading in the background of the next 100 images Image tags that's possible. However, I can't show it to you because it doesn't work I didn't actually find how I find out how it really works I found there is a bug in it. So it's going to be probably fixed in the new future Now, however, what I can show you is semantic zoom. I noticed that a lot of people Like the semantic zoom, but really don't know how it works. It's Some it's a bit complicated To give you a very quick intro to semantic zoom semantic zoom is the thing that you can pinch on To go from a zoomed out level to zoomed in level Basically, it is two grids on top of each other to grid views effect on top of each other That you can if you are on the lower level the zoomed in level That's basically all your data and when you zoom out it's going to be Another view of your data, perhaps a grouped view of your data You can use that you can use that on the screen Using pinch you can also do that with the mouse Using this call wheel where you can use it with the control and the plus and the minus sign on the keyboard now In fact the grid view sorry the semantic zoom control uses two controls that implement the isomantic zoom And at this point that is just the list view and the grid view that are available here So it needs two of these controls. It needs either two lists used two grids of our combination of the two So that's the code that you see there at the bottom Some typical samples. I'm going to quickly show you a few screenshots. There we go So this is how a semantic zoom is ideally used. For example, you have a store there and that store has Has a has a number of categories if I'm not mistaken Yeah, so it has a an overview of the of the apps grouped per category And when you so the lower one on the right is the zoomed out view and my new pinch It will load up the items that uh of all categories for all subcategories That's a typical way of using the semantic zoom. This is not a nice Implementation for example the zoomed out view shows you the number of messages per day Grouped per day that is and the zoomed in view simply shows you all the messages I'm going to skip the other ones. It's basically the same download the slides. You can see them all now The question is of course, how do you implement that semantic zoom the semantic zoom? However has Again in release can sorry not in really can it in consumer preview A few things in in terms of data binding that don't really work that probably will be fixed When when everything is is final Let's run it first. I'm going to show it very quickly. It's an ugly looking demo, but that's that's not why we're here So this is the zoomed in view. It shows me a couple of movies and then I can use So we use the mouse control And and the scroll wheel here or I can also do this programmatically switch views if I click on this fantasy view I'm immediately brought to the fantasy Category in this case. There's not not much space on the on the right there anymore So it zooms in so that fantasy in any case is in view. That's how a semantic zoom works Now, let's take a look at the code for the semantic zoom. That's not what I had to do. There we go So, um the semantic zoom control In this case, I'm using a collection view source. Again, this is one implementation. It's of course possible to do it in another way Let's first take a look at the view model perhaps So this is the class the view model which exposes a list of movie category instances under the movie category property And a movie category as you can see there at the bottom Has a list of movie instances and each movie, of course has a couple of properties And then in the constructor in here. We're instantiating this are hard coded And then we are grouping the movies by category And instantiating that movie categories And then we have this list. Now the data is actually ready to be consumed using a semantic zoom control So what have I done here? I have a collection view source And I'm binding it to movie categories. Of course in the code behind in this case In here we are setting a new instance of the view model to data context. This is not real MVVM. I know that I've been there. I've done that So in any case we're setting the collection view source and we're binding it to the movie categories property on the view model So far so good. Now we specify the items path To be movies. Remember each movie category Each movie category has a property movies So now it knows that the movie category has items and that are located in the movies property. That's one thing Okay, now my use my semantic zoom control That has two views a zoomed out view and a zoomed in view So the zoomed out view is the top level one. The zoomed in view is the one at the bottom So the zoomed out view Is a grid view I specified a grid view here. I could have used on this view if I wanted that I'm using a grid view here And that one Is simply saying well, I'm the zoomed in view is now binding to the movie categories Um It's actually binding to the collection view source and that's how it knows that the data is grouped And the items are going to be the movies now. Then I define the grid view The grid view itself Has an items panel, which is basically how the different Blocks are each groups. Sorry how each of the groups are going to be stacked in this case, which is a virtualizing stack panel horizontally And then we go into the group definition now we specify how a group is going to be shown Here we specify that each group in the group had a template Has to be a button right With the category name on there. We map is it still running? No, it's not running anymore So if we uh If we take a look again, so in here So that's the category that you see here. That's a button. I can click on it doesn't do anything, but it's a button That's what you see here Um and then the item sorry the The the panel for each of the items inside of the group is in this case a variable sized wrap grid That's basically specifying how all the movies inside of each group are going to be visualized Then In the uh, yeah, so in here now This is basically a bit of a bit of a bug. I think I think they're going to change that It doesn't automatically find those movies in here. So I do need to specify In here to the grouped sorry to to the to the zoomed out view What are going to be the collection groups? So how it needs to show all the different groups and that's what i'm doing here So on that grouped uh items use source so the view source for my uh for my data binding I specify views or collection groups and I specify those as the item source for my zoomed out view So basically that means that the data context is not uh going through I assume that it's going to be changed when things are final The zoomed in view however that works out of the box Sorry the the uh this one here So for the uh the zoomed out view that we specify that uh each uh group is going to be a group.category name You just simply specify for each group in my data take the category name and show that in the zoomed out view That is one way of doing it There are other ways of doing it, but this is one way that I found that is reasonable to do with my uh semantic zoom control Okay, let's continue if you have questions we'll do them at the end because we have so much thing to talk about and um Then we'll we'll have some time more time for everyone to to look at things. Okay What about o data people are using o data here? Couple of people yeah now o data is I would say it's quite popular, but judging from this room, I would say not Um to o data is basically what you create with the wcf data service. It allows you to create or to expose your model over a service using uh a query based syntax you can ask your model for uh Basically you can perform a query against your model Now again in consumer preview and I imagine this is not updated at this point yet for uh release preview There was an o data client library available Um again if you're coming from from wpf a silverlight Uh, you probably know that there was in dot net in general. There was an o data client library available That makes it much easier to work with wcf data services. So normally you would have to create the uri yourself Get in the xml that is being returned by the by the service and then Go pass that xml into objects the client library does all that for you. It basically allows you to do right there Is to your wcf data service and uh create object automatically It does work, but not everything is implemented yet. Uh, probably The biggest thing that is not implemented at this point is the ability to create Uh, your uh, your service reference in visual studio. That doesn't work yet if you try doing that to Wcf data services data service. It doesn't work at this point. You have to use something called the data svc Util which is comparable to svc util but then for wcf data services Okay, let's quickly take a look at that Um, let us uh Go to uh, not this one Let's take a look at o data All right All right So it's it's hitting the breakpoint we'll take a look at the break on you just a second So with this it is now we are now talking with the netflix data as uh, wcf data service Or the netflix o data endpoint Um, netflix is a movie service and they have a great api to browse all their movies that they Expose can't get it in belgium. Can you get it here? Not flicks as it exists here already No, I don't think so. I don't think it exists in any country in belgium. So anyway, they have a great api They have an old data endpoint and we're using that one in this case to browse the movies In uh in in this weird categories that we see here Okay Not gonna open those movies Okay, now how does this actually work so what you need to do is um You need to use the data svc utl which is included when you install the client library And then you can you can point it to the o data endpoint and then it will create for you your um proxy Let's say what would normally be created by adding a service reference, but it doesn't work in consumer preview So when I do that I get this class that is being generated for me As you can see here. That is basically my context my data service context that is being generated Exactly the same as in other technologies. There's not really a much of a difference happening here Now, um inside of my code, uh, and let's go let's perhaps run it again Then we can see what is happening. So what is happening here is I am going to load uh genres from um from uh Netflix, but I'm going to do a query I'm not going to say look give me all the genres because they have tons of genres What I'm going to do is I'm going to say give me all the uh genres that contain sci-fi So I'm going to talk with that context the code that was generated in the using the data svc utl And if you've never seen o data, so this is what is going to happen. Uh, where is the query here? um So what is going to happen? Let's zoom in on this. Let's try that there we go The query as you can now see it is now talking it's readable. Yeah, so uh, it is now It has it has built up a query. So it has translated my link query into uh A uri And that uri is going to return me a unique response So that if you don't use the client library you have to do yourself and that is basically uh, not very Fun thing to do. So it's automatically translating me that query into a uri. I'm going to launch that query to Netflix There we go and now it has gotten in the response and now basically I'm going to go through all these genres build up where it's going to get the um Now it has to download for each of the categories an image It's gonna I think it's going to take the first image of the first move that it finds and then it's going to do another call to o data The o data endpoint now notice what we haven't talked about yet Is that of course we are using the await here and here as well If you've done o data work in a previous life You'll probably recognize that this is more or less the same thing You build up a data service query by talking to your context you execute that query you wait for the response Asynchronously using the awaits and we'll talk about the wait later if you have time and then we get in the response And because of the o data client library, it returns me objects. It doesn't return me xml It basically returns xml, but that o data client library is uh materializing my xml into Into objects and I can use those objects in as you can see here It's automatically creating me new genre objects. Okay cool way of working wcf data service Not always that easy, but it's a cool technology if you get into it. It's really Um, consumable for many other technologies all right another thing that uh, if you were in my windows phone talk, uh, we've looked at Uh at background downloads in windows phone um Now in windows 8 the same problem is coming up again that we have in windows 7 7 What if we want to build an application that needs to do downloads in the background? Because of the fact that we are limited to do one application in the foreground If you build an application that needs to download stuff the user has to either Leave that application on the screen or otherwise his download is is not going to continue. Of course, you can't snap it Yeah, okay, that's one solution, but you never know if the user is going to be able to snap So that's not a good solution either. So, um In windows uh met in windows 8 even after we have the windows networking background transfer which has a background Downloader and to that background downloader. We can add download operations Which is basically saying create me a download operation for a ui Sorry a ui add that to the background downloader and that background downloader is going to take over the download It doesn't matter if your application remains on the foreground or not. It doesn't matter It's basically a different executable. Uh, and that is the background transfer host dot a say Exe that is going to run even if the application gets killed It's going to continue the download for you if the application is uh, is is not running in the foreground anymore Even if it gets if it's precious even if it's uh, it being killed the download is going to continue for you The only thing the only way that I found that I could stop the background transfer host is by deleting the file It's actually downloading then it automatically crashes and stops downloading. It supports credentials. It supports Uh, things like custom cookies like setting the headers. That's uh, that's sometimes very important I've done this for a project in silver light. It's can can be very interesting and Another interesting thing it can also report progress while it is running in a different executable It's a different service basically on the machine. It is capable of communicating back to the windows Metastyle app what the progress of the download is Okay, let's take a look at that uh background transfer this one Till what time do we have 40 6 6 40, right? And that one guy was just going to stated until nine. Yeah someone over there Okay Okay, let's take a look at downloading stuff. I am going to um I'm gonna copy a link that I have somewhere over here, which is the big bunny uh movie It's quite big. It's about a gigabyte. I think so at this point my application check. There's basically no backgrounds for my app running So, uh, let's uh remove this thing. Let's put in something different here And I'm going to download something called avi There we go. I'm gonna start to download normally should start it if we get network connection. There we go So it says downloading Fingers crossed If it waits till out there we go So it's now downloading and you see that my app is actually getting progress being reported uh to uh to the ui Yeah, of course. I'm not uh scrolling all the way back. So it's actually quite fast network already on 2 percent If we now take a look at the task manager You'll see somewhere over here. There we go The background transfer download upload host my app is now not the foreground app. In fact, it's not suspended But if I kill it, it keeps on downloading this so you see that this is a different executable That is downloading that's performing my download for me while I don't have to do it. It's doing that for me All right, um, let's go back to the app and let's cancel that because otherwise it keeps on downloading Is it cancelled? Yeah, okay In Norway the network is much faster than in Belgium. Anyway Uh, okay, let's take a look at how this thing works So, um Not this one. Let's keep that one. Let's take a look at what we do when we click on the start download button So first I'm going to build the ui where uh that I want that I want to download from from the from the ui From the from the sorry from the text box that I'm going to specify where the file has to be located notice if we have time for files, I think that was one one that you voted high Um, you cannot put this file in the c slash whatever you can't do that You can put it for example in a known folder of the application or also in the local API storage API of the application so the storage file Gets created in this case. I'm putting this in the pictures library. I could have put it in my documents. I don't know Um, what I'm doing is I'm going to create a file for the download and I'm going to create a unique name That's not that has nothing to do with downloading effect but then then I create an instance of the background downloader and I specify Uh that the downloader should create a download and that is going to result in the creation of a download operation instance Yeah The download operation instance in fact is not Anything it doesn't do anything yet So that download now passing to this handle download async and in that handle download async I need to start that download async and that is actually going to start the background transfer host executable and download the file Asyncously so in here, I say download start async passing in um, the something called a cancellation task A cancellation token source. I'm sorry. Uh, and also passing in an uh, a delegate to Return me progress in this case the progress callback that's defined two lines above in here Um, so what happens when I uh, so what happens to report the progress this download progress is being called In this case this happens on the background thread. So I need to marshal back to my UI And therefore I'm using this marshal log Helping method in this case. Uh, so this is going to be called To update the UI about the progress of the download and then when I click on cancel That's what's happening here when I click on cancel that cancellation token source is the is the way of Download canceling the download everything that is associated with this cancellation token source Can be cancelled asynchronously. So basically killing the download That's what I'm doing here. I'm saying everything that's associated with this cancellation token source cancel it And then let's restart all over create a new cancellation token source and create a new list of active downloads I've skipped on that one. Okay All right, let us continue Let's go back to the slides Talk a bit about services in general what works asmx wcf Rest services. They are supported Using xml using json that works as well RSS is supported and sockets are supported. They don't have a demo of socket set. That's all it's quite complicated In terms of wcf, that's always a very important one. Many people use wcf What is supported again more or less on par with silverlight? The basic htp binding works the custom binding works for example If you want to combine it with binary text encoding, sorry binary encoding The net tcp binding works and the net htp binding works That that Indeed means that the wshtp binding doesn't work. I assume for reasons that are the same as in silverlight So because of the fact that the private key would then be on the client So more or less the same thing as silverlight In terms of encoding so binary encoding is supported text encoding is supported Security again, more or less the same thing as silverlight You can pass in credentials if you've seen my talk. I think I did it here one or two years ago on silverlight security There I talked about passing username password in the header of the message with wcf that is possible in Metro as well using the transport with message credential or transport credential only So it is possible to do authentication with a service. That is an important one that that works So for the rest, yeah, again, I'm not going to read it all for you One thing to notice with wcf Again in consumer preview There is no file. So no configuration code generated for you. Everything happens in the reference.cs Which is a bit of a pity actually In the reference.cs so in the file that gets generated when you create a proxy There is a method called Configure endpoint which is partial which you can use in your code Again as partial of course to configure the endpoint to configure the binding basically That's how it's done at this point. Everything also is task-based. So again, everything is asynchronous just like with the odata endpoint from netflix everything in in Communication with services is asynchronously task-based of course And one thing that you shouldn't be forgetting is that the application needs internet capability If you want to talk with the wcf service and you forgot the internet capability, it's not going to be able to reach out to the internet Okay, let's take a look at a very simple demo So let's go to service access So i'm going to use this one and then use I'm gonna let's let's let's use just a public service. So in this case i'm using a an asmx endpoint In the project in here You can see that no configuration code has been harmed in the making of this of this solution But it wasn't generated either. So that means that everything That we need to do in terms of configuration has to be done in the reference.cs You can't change that because once you update your service reference, it's gone But there is a configure endpoint in here Figure endpoint there you go Where is it? Uh, that's not what I wanted. So the configure endpoint The configure endpoint is a partial method that you can use to do the configuration of your endpoint in your own code Let's hope that that changes In terms of talking with the service. So this is an asmx service. So it uses the basic htp vining Um, that is the asmx sample that's this one. So what I'm going to do is I'm going to instantiate my service client As you can see here on the first line and then I'm going to talk with my service It is all generating task based methods. So I can await them So I don't have to do any callbacks like I should like I should have to do to do in a silver light So I can use the tasks that are being returned by the get city Get better get city weather by zip async So this method the rest of this method is only executed when the method So the callback is or the call is returning if you take a quick look at this So you see that you're working with the services more or less the same thing There's not that much that changed apart from some things that are a bit missing So this is a us weather service. So I think about a very bad tv show that was on many years ago So indeed in Beverly Hills, it is now 59 59 degrees Fahrenheit. Okay. So this has communicated with the service. It works. The application itself has the internet capability There we go in the capabilities. It has the internet capability set to true because otherwise I would not be able to connect with that service This is an amx service. Now. What about rest services? Oops, we've seen that already. What about rest services in in Silverlight you would have used the Web client in silver light. Sorry in metro. The web client doesn't exist anymore. You have to use a replacement Which is called the HTTP client There's not much difference. You can use more or less the same thing or you can do more or less the same things It's a bit of a different API, but the results are the same What you can do with that HTTP client is the get async, put async, post async and delete async So it is basically possible to work with restful services The response of a rest service is well json or xml If the service is returning json or you build the rest service that returns json, well, you can consume it from winRT You can use the json object On which you can call the parse. You can call the get name string the get named number Or you can also use the indexer, which you should never do, but you can do it And then you can also use the data contact json serializer that is included in winRT If you have a response coming back in xml format, you can use the xml serializer You can use xml reader rather and link to xml, which is probably the preferred way of doing it I'm going to quickly show you a very small demo where I'm going to talk with Flickr The image service So they have a great REST API And you can use it via some things you can only use via xml, some things you can use using json as well So we're going to search, of course we are in Oslo, so we're going to search for Oslo A couple of times back I had some embarrassing pictures showing up But in Oslo people are very nice, I think. There we go Okay, so these are pictures being returned, so this is actually an xml response and it's downloading the pictures on the fly As you can see, notice by the way that this is virtualized. It didn't create me thousands of images, actually hundreds of images Because Flickr normally returns 100 If I scroll very quickly, you see that it hasn't insesated the elements yet That's because it is doing this thing virtualized, that is doing by default. What the hell is this? Okay, anyway, so let's take a look at the code So REST service So what I'm going to do is I'm going to create a client Actually, I'm going to call this method createClient in which I'm going to instantiate the HTTP client method As you can see here So I'm going to instantiate the HTTP client, the web client is gone And then the HTTP client, let's go back up Has a method called getAsync What do I pass in? Well, the uri basically of the page that I want to download, the response that I want to download In this case, it is a formatted string in which I pass in some parameters that are Viable for Flickr I get back Of course, this is asynchronous. I get back in HTTP was HTTP response message And then I'm going to pass because this is XML Sorry, I needed this one So what I'm going to do is I'm going to read out the content coming back from Flickr by saying response.content.readSstringAsync It's just going to return me a string that I can pass using the link to XML implementations So an XML document in this case, sorry, what am I saying? An x document And then I'm going to loop through the results using a link to XML query and I'm going to bind that in my UI That's more or less the same thing, something that you already know All right The final thing that we're going to take a look at in the data part is skydryff There is a live SDK available for Windows Metrostyle apps. I don't know if it's updated for release preview already But because of the fact that in Windows 8 you can log in with your Microsoft account, your previous live account It is possible to build apps that integrate automatically with the skydryff API that automatically is also using The live SDK, sorry, the live single sign-in So you can build an application That doesn't require the user to log in again or to build an integrated sign-in experience If the user hasn't signed in with the live ID account and that therefore you can build an application that for example downloads the pictures from your skydryff. Let's take a look at that So let's open the photo sky application Yeah, why am I asking that now For some reason today it opens every solution in the full blown visual studio while normally it Uses the express edition. I don't know anyway So let's take a look and hopefully this will work So it's going to go out take my Unlocked in with my live ID and it's going to take a look at my skydryff and download all the pictures that I have On there as I have this is test account. So there's only a couple of pictures Uh, so let's skip on the breakpoints And I'll do them in just a second should that There we go. Everything happens asynchronously. So you don't know what is going to happen first. There we go There the pictures are coming. I hadn't didn't have to log in again because I'm already logged into windows I have a single sign-on experience. I'm logged into windows with my live ID. I should say my microsoft account now Which sounds a bit weird, but anyway Okay, so let's take a look. You saw the pictures popping up there and notice here the uh, msn guy Or how is this thing called? Uh, it's also up there. Basically. This is a sign-in button and that's the thing that triggers everything Let's let's perhaps restart it and you can see everything that starts happening at some point It's going to get the session from uh from that sign-in button if you install the live sdk on the And the group items page Somewhere over here. There is There is a sign-in button and that sign-in button you have to put on your On your ui it allows the user to sign in if he hasn't signed in that could be that user is using a local account And then the session changed event is going to be triggered It's automatically triggered if the application gets in the live sdk gets in the Uh, the the live sorry the the microsoft account from the local device and that will trigger a session changed That session changed will automatically Get in the uh, let's let's go back to the breakpoint and then it's gonna you're gonna see what happened So basically what i'm doing is I have in my uh application xaml I have a property called session which is of type live connect Live connect session and that session is going to be set because of the fact that in the In the session changed event here, I'm setting it get it in I will see that the live connection status is connected. I get in the session. I'm going to save that Okay, what I'm then going to do is I'm going to download all the images from uh from my I am from my uh sky drive in this case. So i'm going to use something called a live connection client passing in the session And then there was some basic query syntax basically that you have to use And you say client would get get me all my albums get me all my albums That's going to result in a live operation result and then things start getting a bit more complicated As you can see here, you have to ask that live operation result dot result which returns you dynamic And on that dynamic you can start looping in this case on the data property and then in that case I get in all the uh the The albums and for each of these albums and then I have to go back out to live and ask me the pictures that are in there It's the bits. It's still not really easy to work with but it works And most of the most important thing here is of course to take away that it is possible to build a single sign-in Uh experience with the microsoft account of the logged in user all right I think we're way behind but anyway, so, uh, let's take a look at background um apps Okay, that is all the way at the back. Let's collapse a few things here Am I happy that I built that in background tasks? okay Now background tasks are a bit of a hot topic. I think in windows 8 Since by default we can only run one application at the same time Now you hear microsoft talk a lot about background apps And lock screen apps. Now. What is the difference? Is there a difference and how do we get uh, what the difference basically is? Now by default only one application can run you know that by now Uh, only one application again can receive all the resources of the system because that is the main application That's running. You know what I have can basically do something in the background That's not really true However, because of the fact that there is a background task API in windows, uh eight in every nocti that allows us to run code in the background Exactly like windows phone. It is not the same code that will run in the foreground It is not your app that keeps on doing stuff in the background. It's a separate part of your app That is basically registering itself with the system and saying well, I want to do something in the background. Okay, that works It's more or less the same thing as windows phone again There are some differences for example. This one can add more than one background agent. Let's call it Windows phone can only add one okay Now how does this actually work? Well, basically what you need to create is uh a separate project that creates A background task and that background task is going to be created using a class called a background task builder And a background task builder can register a class that implements the ibackground task interface And that ibackground task interface has a method called run And that becomes basically the code that will be uh called when the background task is going to execute That's how it works. So from your app use the from your main app. You use the background task builder that registers a class that implements the ibackground task in Interface and then that code can run in the background now how it can remember come back to that in just a second Now this code will Be managed by an external process which is called the background task host Uh, and it can also happen in process now in process is is a specific case Normally it is executed by a specific executable the background task host exit Now one is this useful. Well in many cases, I think uh things like voice over IP applications iam message messaging applications Mail applications they need to do some checking. Is there already a new mail on the server? Yes, no, they need to check that every time to keep you updated Now when does this code run? Well this code can run periodically or in response to system events now that periodically is basically also a very specific case Now when does the code run? In windows 8 in metro apps the background task runs all the time It doesn't matter if the application is running if it is suspended or if it is if it is terminated The background task runs completely independent from the main application It doesn't bother taking a look at if the main application is ready is finished is running or not it runs You register it it runs it keeps on running Now when does it run and that's an important one? now basically an application So a background task can only run when a trigger is triggering the execution of it Now what are the triggers that exist? Well you see a list here You see a very important one at the very top which is the time trigger But sadly it has a little star next to it Anyways, when there's a star there's always some little letters and that says some little small text that says it requires lock permission Now what is lock permission? Coming back to that in just a second. Basically that means that it cannot not every app can build Background tasks that run every now and then that run based on a time trigger time trigger says after 30 minutes or so That's not possible for every app to do that There's some other ones as you can see as a mass receive network state change things that might or might not seem useful And then the execution can also be linked to a condition So the trigger happens, but you can also optionally specify a condition that has to be true for the trigger to execute and therefore your code execute For example, that can be internet available in and out available user present user not present But is he logged on or is he away? Okay, might seem a bit complicated. It's complicated for me as well um So I already said this, okay How does this actually work so your main app? says well, I have a background task to register so when it first runs It says well, I will register this task using the background task builder with this and this and this trigger At some point so that it does that with an external service with the system at some point that trigger will fire And then the system will say well now we execute your code. For example, the internet is available trigger Well, then it's going to execute the the your code when there is internet available again or network state change, I should say Okay Remember in the slide with all the triggers we had a star next to the time trigger To use a time trigger your application has to be a lock screen application So it's not enough that your application your application can simply say well, I'll run to run some code in the background every app can do that But to become a lock screen app is Requires that the user says well, yeah, I want to allow this application on my lock screen Therefore saying to the system while this application is important Well, I'm going to pin it to my lock screen and then that is that is a trigger for the system Not another trigger like this, but the trigger to say well this application is important. It can do more on the system It has lock screen permission. Therefore, it can do more on the system. It can do background tasks based on time So that run every five minutes every 10 minutes checking for a new map, for example So that is the difference There's a difference between a background task. Everyone can create as many background tasks as they want But they cannot all be linked to time triggers other triggers as well. But the time thing is I think the most important one So when they are on the lock screen and now I'm going to do something very dangerous I'm going to go to the lock screen So here you see Down there at the bottom. Those are the apps that are available on the lock screen Applications, there's a maximum of seven applications that are on the lock screen that can do stuff based on time I'll login again. There we go When user places the application over there the application can Show a batch update like it like a push notification Sorry like a tile update. It can show a tile. Let me rephrase it. You have on a tile update You have the regular tile update and you have batch updates. It can show a batch update on the lock screen And then the user can also select one application that he says, well, that's a really important one That one can also show a tile update on the lock screen The user says well, it's so important for me that it's a very important one It's so important for me that it should show me real-time information What you need to do for that is you need to specify, of course, the image that it has to show that's quite normal But in any case The user remains in control There we go It is in the configuration panel. There is a lock screen window or a lock screen pane Where the user can specify which apps he wants to allow on his lock screen Therefore saying this app can do more therefore saying this application can access Or can execute based on time And there's one down there at the bottom and instead of showing it on the slide. Let me go to the settings and the lock screen So here you see that these are apps that are Able of showing updates on the lock screen and then from these I can also show an application that has Um that is going to be allowed to show a tile update on the lock screen Therefore saying well, this can even do more but in terms of of being able to run in time Only the apps that are pinned to the lock screen can execute a background task Uh on based on on a time basis Let me quickly show that to you and then we'll have to round up because we're already over time. I'm sorry Talked a bit too much So let's first take a look at background tasks. How do we create a regular background task? So if you take a look at the solution manager, you see that we have two Two projects one that has a class sample background task That implements the I background task and it has a method run and we're going to implement that and that code is going to be the code that is executed so, um This this background task is already registered. So I'm going to register now a background task Unregister it and now I need to disable my internet. Don't need it anymore today What did I disable here? I think I disabled my bluetooth I know I have wired connection So now the network state changed there we go. So this background task is triggered based on the network state Um, it's not available. I think it is and then I click it in again and there you go You see it starts running again So there we go. It is in this case running So this application is in communicating with the foreground. It's it can do that if you want that so it can run whether or not the application is in the foreground or not So this application could never have used a time trigger So now we have so this is the background code that the code that just starts running The run method is is executing and in this case Uh, normally, uh, that's an important thing as well to notice here. Normally this code would just run top to bottom But I don't want this to run and then stop doing its thing. So in this instead what I do is I ask for a deferral The deferral basically says well instead of going through wait until I give you that referral back deferral back And then I instantiate the periodic timer and it starts running and it has a periodic timer callback on the timer elapsed And that updates the timer progress and at some point when the timer is complete Then we say well now it's okay to shut me down deferral is complete That's the background code the ui code has to register Let me scroll up Uh, this one I'm registering a background task Passing in the name of the class has to run passing in the name of the task to find it afterwards Passing in the internet not available trigger and don't not passing in a condition Let's go to this one. This method is actually doing the registration of the background task by saying background task builder I'm going to instantiate you pass in the name Of the task passing what has to execute set a trigger that was the internet available trigger Not passing in a condition in this case and then I'm creating a background task registration And that is in that case going to register the the builder. So it's sorry. It's going to Say builder dot register and that's going to return me a background task registration Which I can use to do stuff with my ui. I can sort the updating of the ui I'm going to show you the rest. I'm going to quickly show you the lock screen apps And then we're going to round up So lock screen apps For some reason it changed default to visual studio fool. Anyway, so, um, let's run this one as well So this app One thing one second. I need to update the name of the app because it's filtering it on name I probably already denied it lock screen access. So now from the code I am going to request lock screen access There is no Action taken yet and the user it's not on lock screen. So if this would now try to do a time trick, which would fail it It would never be executed So now for my app, I'm going to say well, dear user, can I please go on the lock screen? I am your mail app I should go on the lock screen user says, okay allow this Let's now go back to the lock screen And now also say here You see it was already here lock screen application sample seven Now I specified this app to be the app that I want to get most updates from Let's go back to the app this one come on And now I'm going to send a tile notification and a batch notification The batch notification is going to show at the bottom and a tile notification is going to show at the very top Let's log off again And you see now that there is a tile notification next to the clock and there is a batch notification shown at the very bottom This can now this is now registered as a task that will do some code Every now and then because it can use a time trigger and it will be able to receive updates and and get updates and also receive push notifications and show them on the lock screen So, um, I'm very sorry, but I think we have I think you're going to throw us out of the room if I keep on going Unless you want to do some other things Should we should we stop? I can stay until eight. I have nothing to do So I think we're we're gonna have to round up maybe let's let's round up with uh with uh With the bag of tricks and then then we'll then I'll really shut up. Um Um, sorry, I have a train to catch you have a train to catch. Okay. That's a valid excuse if someone else has to take that train please go And so we're gonna I'm gonna show you the bag of tricks, which is I think five Code snippets that sounded interesting to me You can download every slide every demo of uh of my blog so Don't worry. You get them all for free By just being here Your presence has made me so happy so, um for example From code it is possible to change the lock screen image I'm gonna use a file picker And I'm going to select an image it's possible and I'm gonna put that as my lock screen image I now log off You see that it's christmas already Um, so it's possible to do a lock screen image change That's wrong I think It's also possible to check from code and that might be interesting in some in some applications to detect the input If you have to check what uh, what input uh methods are available You can do so. Uh, for example, this this laptop only has a keyboard and a mouse and it says touch is not present Yeah, I wrote some code for that, but it's capable of checking that itself. You can do that from from the api It's also possible to detect the devices that are connected Um, that does give you some some weird results in this case But it's for example possible to check the connected devices Uh, the trend the other mouse and stuff like that the camera you can detect it And finally It's possible to detect the lockdown user Which is in this case very appropriate in this case So it says it says the lockdown user says it's it's time to go home. So I'm not going to go over the code Uh, download everything from my blog take a look at the code at your own pace. I hope you enjoyed it I'm sorry. We couldn't do everything. It was planned on not doing everything. I hope you enjoyed it Uh, thanks for being here and I hope you enjoyed the rest of the conference. Thanks
 Okay, good evening everyone and thanks for staying so late at this after this long day of great sessions here  So in this last session of today, I'm going to be talking to you about some more advanced stuff in  Windows runtime or win RT  So it's not gonna be a level 400. I don't think it's time yet for level 400 in win RT  This is this is like the session after you've seen all the introduction talks from Microsoft  You've done some playing with it, but you still have quite a lot of questions  So what I did is I get at quite a few topics that I think are interesting  At least for me that were interesting and I hope they will be for you as well  So let me quickly introduce myself because we have a lot of things to do. So my name is a jill klaren  I come from Belgium. I think it's a third time here at NDC and I work at a company called  Ordina where I'm doing mostly XAML stuff  WPF and and self-light their projects  I'm a civil light MVP and a regional director for Microsoft and I've written a book  I've actually written two books in civil light and  My blog my email my Twitter you can read them from there as well  I will post all these demos as well as the slides on my blog  properly tomorrow  So this is the new book that I have released on civil light 5  It's called civil light 5 data and services cookbook. It's available in the store here as well  The reason I'm including it here because there's actually a lot of things here in this book that are relevant for Windows 8  Development as well this book focuses mostly on the enterprise stuff  So services data binding MVVM rear services also covering some Windows phone and I haven't  Counted yet by I think let's say 60 70 percent should be at least applicable to Windows 8  Metastyle apps as well  So there's a lot of interesting things in there if you're doing XAML XAML development currently or start planning it  Planning on doing it in the coming months  All right  So what I did is I actually created a presentation. It's way too long unless you want to stay here until 9 everyone  Yeah, okay, cool  okay, so  So what I'm going to do is I'm gonna introduce you the topic that I'm gonna be that I have prepared for you and  Then we'll do some vote. We'll do a vote and  On which topics that seem most interesting to you and we'll pick out the ones that get the most votes  So I have something on periodic tile updates as well as push notifications  So periodic tasks, you don't hear people talk a lot about periodic tasks  They basically are a polling system to a service that updates the tile push notifications some  Sometimes it's also a bit complicated  Then we have a very big block on data. I'm not gonna split that up because that depends on the other  So there's a big block on data and services that contains things like data binding. What is possible?  What is not possible?  Some things on data controls  Some things on OData how you can interact with OData  How you can do background downloads how you can access regular WCF services JSON service  What is available in winRT to do that?  And we're gonna finish that part if we if we get to it at least by taking a look at the live SDK  services to interact or to allow your apps to interact with the live SDK for example to include  the SkyDrive  I have a part on localization that might be interesting because your apps are gonna be deployed in a worldwide app store  So localization of your apps is gonna be very important  Asynchronous development. I have some slides on async for the people have never seen any async  Happening or what it's doing or how it's actually working. I have something on files  Local and roaming data. How is that actually working? You heard Microsoft talk a lot about roaming data  But what are the options to do local saving? What are the options to do remote saving and how can we interact with the local file system?  Can we interact with the local file system?  I have a part on  reusable components something that you built and managed code and you can for example reuse in C++ or in JavaScript and  There is also a part on background tasks and  Lockscreen apps the back of tricks will do that in any case. It's that's two three minutes of some code samples that might seem interesting  Okay, so we'll do this by popular demand  Who wants to see something on prelactile updates and push notifications?  No one wants to see something. Okay, that's not good  If we're gonna end up with a list of zero then we can all go home  Okay, so no one wants to see that. Okay. Who wants to see data and services?  Yeah, quite a few. Yeah, that's one two three four five six seventeen if I can correctly  a sink  Three five six six or so  Local files data acts as a local data taxes roaming data one two three four five six seven eight ten  I'm very good at counting people  Building reusable components  That's a very small so we can do that for sure great. That's that thing that was 12 if I'm not mistaken. Yeah  Oh 12 might have been 13 didn't catch that area and I'm background tasks and lock screen apps  That's a bit more that's 15 so that should be so we should be starting with this one  Then whoops, then we're gonna do a background  Okay, so that's from the form to the back then  And reusable components, I think we're gonna be around of out of time by then but we'll see where we get  And then we'll do the back of tricks. So the data parts of course the longest past that's bit of my  One of the things that I like doing most working with data services hands the book. Okay, so the first part is gonna be  Data and services and look how handy I did that you can create areas in your  Or how is it called sections in Windows in PowerPoint presentations?  Handy if you allow the public to choose what you want to see. Okay, so  Let's start with data and services  First thing I want to talk about is data binding who loves data binding  Everyone loves data by everyone who has done some XAML development was done MVVM loves data binding  I'm sure they do now  if you've taken a look at the  At winRT and I hope I assume most of you have taken a look at some chat sessions of Microsoft  Played with winRT already. Maybe I've already built the next Angry Birds in winRT. I don't know  You will have noticed that not everything that you know  Coming from WPF coming from Silverlight is supported in in  Metastyle apps in winRT. So what is supported by the way one big disclaimer  This entire presentation is running on consumer preview  I didn't have the time to upgrade. I think it's 30 demos in total to  Since since how many days it's released now four days. So  Maybe there are some changes  Could be that some things are not really correct like I'm saying them anymore  So my apologies for that in advance. So in consumer preview at least  What do we have that is supported to regular data binding? What I mean by that is the data binding syntax hasn't changed  The the mode one way two way that is supported element binding  So binding and one element to another element is supported  Converters are supported not 100% in the sense that the parameters change model binding  So you bind to an object  That you set as a data context that is supported indexes data templates who doesn't love data templates  I love them  Collection view source something that was added in silverlight if I'm not mistaken silverlight three  The notification system so the I know to decay those are the I know to fair property changed and I know to find collection changed that also works  Binding to Jason services WCF services will see that later on and we can see data binding exceptions in the output window boo-hoo  anyway  If you see this list, I might have missed a few things  But there is something that's that's quite a few things that actually aren't there. There's no string format  There's no format value. So the binding base properties not there because the market extensions not there implicit data templates  Not there data binding breakpoints. I love that feature in in silverlight five there  That's that's doesn't work in win RT at least in the version and that we're using here today. So  to  to  To make a statement here, we are more or less with data binding engine in win RT at the level of  Silverlight to silverlight three ish somewhere in between  That means a lot of features that if you've done silverlight if you're doing WPF  Are not available in win RT, which is a bit of a  Setback basically I'm gonna very quickly  show you a couple of  Demos so I couldn't of course start my demos up front  Where is  Data binding so I'm gonna show you some very basic data binding samples just  To set the record straight so that everyone knows what we can and cannot do  Okay, so I'm gonna run this I  Have spent hours on this demos create making them nice as you can see here. I have the original background  So what does work an element binding works as you can see here?  I have a list box I can click on one of the items in the list box and a text block is automatically being updated  It doesn't follow the screen there, right? It's readable. Okay  So you can see an element binding works if we take a look at the syntax. That's very quickly do that  That's not waste too much time. So an element binding is all about XAML codes. Go away you go away  What's this now an empty window? Okay, that's cool  Thank you. So  We have here an element binding we have a text block here and that's text blocks as text property is  Bound to another element which is that list box main list box and it is binding to the selected item  That was added in self-light in self-light three if I'm not mistaken. So binding to elements works  then  object binding  Yeah, I'm gonna skip on that one observable collections works  So for example here, I have a bound this list box to an observable collection  And I'm gonna add some  Persons to it as you can see here. I'm not updating that list box  It's automatically being updated for me. So if we take a look at that that is the observable collection one  That's what you see here. We have an observable collection of person instances and to that  Initially, I add only two and when I click on that add person I add some other persons to that list box  Automatically, it doesn't have we don't have to do anything manually. It works because of the observable collection  We all know that right, so we're not gonna spend too much time there  Notify property changed also works there we go now  We're bound to something that doesn't have any values set yet now  I'm gonna change that object because that object implements the I notify property change property change the event is being called  Oh, it's being raised this updates this person. Sorry is now shown in the UI and that interface hasn't changed as much as a  As long as I looked at it  So we have the changeable person class here that implements the I notify property change which has an event called property changed that we raise  Whenever the object sorry the property is changing. You have to do that manually that hasn't changed from WPF or self-right either  Converters as you can see here. They work. This is sample from the SDK. I'm not mistaking  so here we have a letter great and it's actually binding the  Value of this slide here to a value as you can see here  So if you get a hundred percent you are superstar if you get below the fifth oops if you get below the 50 percent  You get an F. Okay  So that is converters for you. So a converter is a class that implements the  I value converter interface as you can see here the I value converter  Which has a convert and convert back method which gets in the value does it converge in this case to?  to a string and I'm sorry to  To an integer everyone I'm taking yeah, and then checks  Returns the string value and that is being shown in the UI that instant that converter is instantiated  And it's used here in the binding expression text element name and then we have the converter being used  Nothing out of the ordinary I think and then we have we have data bind as we data templates data templates also still keep on working  So here we see a list box in this case and the items contain the color inside of the object themselves  And we are binding  So we are using a data template as we have done that in WPF and silver light for many years now in winarty in the exact same way  So we have here on that list box an item template and the item template is set to a data template  Which contains a border that's giving the background color  So we are binding the background to that color and the tech look is being used as well nothing special really cool things  They still work so those are the things more or less that still work  If you're coming from another sample technology  now one thing that is  Was not possible in silver light  Is binding to anonymous types? It wasn't possible in silver light to bind to anonymous type  For example, you do this query through this link to object query and you're gonna bind to the result  It wasn't possible to do that in in in silver light. It doesn't didn't work  Now you can simply say well, I'm gonna create a new object on the fly as an anonymous type  It's like new blah blah blah and it's actually possible to bind for example your data template to properties inside of that  Anonymous type that wasn't possible before let me prove that to you  So that's still in the same demo  So what I'm gonna do now here is I'm gonna bind to that same list box using in the data template  I'm gonna do a query on my items and I'm gonna get all the values that are that that have the  Word red in them as you can see here. That's so that's the red the reds and the red devils or something  So, how do we do that? Let's take a look at the code so anonymous types that this one  So we have here a link query a link to object query the teams is a class that  Is basically inheriting from a listing team so a generic list and so what do we do?  We add some new team instances. That's what we do when we create a new teams object for this demo  Now I'm going to do a link query from team teams where the name contains red select me a new anonymous type  And I'm gonna return that and see that we have a team city team name and team color here  And if we now take a look at the XAML code that generated the view that we saw just seconds ago  We see that we have a list box item template and we are simply binding to team color and team name  If you try that in silver light, it won't work. This is something that works in metro didn't work in winner team  Sorry, it didn't work in silver  All right, so that demo can go away  Okay now  Controls binding to control that's basically the same thing  There are some new controls interesting controls added in Windows 8 in metro list controls basically  List you the grid view the flip view the semantic zoom. I'm not gonna spend time on  Explaining you what each of these controls do  I'm gonna spend some time on a few extra features the first one  I can't show you because it doesn't really work at least I didn't found out find out how it really works in consumer  Preview I found to be the bug in consumer preview  But anyway, it should be it should be happening in the maybe it works in the release preview  So what is this cool feature now?  Imagine that you have a grid view that is binding to a list of thousands of thousands of images returned from flicker now  In essence the grid view doesn't have any issue with that  It is internally virtualized meaning that it will only create the items that are physically in the view and a few extra ones  So you had that in silver light you had that in WPF with the list box  So for example as well it only created the items in memory that was being shown at a certain point now virtualized  Is it sorry internally? It is virtualized now  If however you are binding to a  An XML that is being returned for example from flicker that is containing 10 10 thousands of of  Tags image tags it might be a bit of a burden on your service  Because it might be a bit too much for your service in fact because maybe you say well  The user searches for  Oslo and there's going to be 10 thousands of pictures of Oslo  So you don't want to you don't want to return that service response or you don't want to make that service response that big  So the grid view however has two properties that allow it to when you start or when the user starts flipping through them  That notices that you are at the end of what has been loaded  And then you can use the load more items async and it has more items  It has more items has has to be set to true  And then at some point an event is going to be triggered that allows you to do some asynchronous loading in the background of the next 100 images  Image tags that's possible. However, I can't show it to you because it doesn't work  I didn't actually find how I find out how it really works  I found there is a bug in it. So it's going to be probably fixed in the new future  Now, however, what I can show you is semantic zoom. I noticed that a lot of people  Like the semantic zoom, but really don't know how it works. It's  Some it's a bit complicated  To give you a very quick intro to semantic zoom semantic zoom is the thing that you can pinch on  To go from a zoomed out level to zoomed in level  Basically, it is two grids on top of each other to grid views effect on top of each other  That you can if you are on the lower level the zoomed in level  That's basically all your data and when you zoom out it's going to be  Another view of your data, perhaps a grouped view of your data  You can use that you can use that on the screen  Using pinch you can also do that with the mouse  Using this call wheel where you can use it with the control and the plus and the minus sign on the keyboard now  In fact the grid view sorry the semantic zoom control uses two controls that implement the isomantic zoom  And at this point that is just the list view and the grid view that are available here  So it needs two of these controls. It needs either two lists used two grids of our combination of the two  So that's the code that you see there at the bottom  Some typical samples. I'm going to quickly show you a few screenshots. There we go  So this is how a semantic zoom is ideally used. For example, you have a store there and that store has  Has a has a number of categories if I'm not mistaken  Yeah, so it has a an overview of the of the apps grouped per category  And when you so the lower one on the right is the zoomed out view and my new pinch  It will load up the items that uh of all categories for all subcategories  That's a typical way of using the semantic zoom. This is not a nice  Implementation for example the zoomed out view shows you the number of messages per day  Grouped per day that is and the zoomed in view simply shows you all the messages  I'm going to skip the other ones. It's basically the same download the slides. You can see them all now  The question is of course, how do you implement that semantic zoom the semantic zoom? However has  Again in release can sorry not in really can it in consumer preview  A few things in in terms of data binding that don't really work that probably will be fixed  When when everything is is final  Let's run it first. I'm going to show it very quickly. It's an ugly looking demo, but that's that's not why we're here  So this is the zoomed in view. It shows me a couple of movies and then I can use  So we use the mouse control  And and the scroll wheel here or I can also do this programmatically switch views if I click on this fantasy view  I'm immediately brought to the fantasy  Category in this case. There's not not much space on the on the right there anymore  So it zooms in so that fantasy in any case is in view. That's how a semantic zoom works  Now, let's take a look at the code for the semantic zoom. That's not what I had to do. There we go  So, um the semantic zoom control  In this case, I'm using a collection view source. Again, this is one implementation. It's of course possible to do it in another way  Let's first take a look at the view model perhaps  So this is the class the view model which exposes  a list of movie category instances  under the movie category property  And a movie category as you can see there at the bottom  Has a list of movie instances and each movie, of course has a couple of properties  And then in the constructor in here. We're instantiating this are hard coded  And then we are grouping the movies by category  And instantiating that movie categories  And then we have this list. Now the data is actually ready to be consumed using a semantic zoom control  So what have I done here? I have a collection view source  And I'm binding it to movie categories. Of course in the code behind in this case  In here we are setting a new instance of the view model to data context. This is not real MVVM. I know that I've been there. I've done that  So in any case we're setting the collection view source and we're binding it to the movie categories property on the view model  So far so good. Now we specify the items path  To be movies. Remember each movie category  Each movie category has a property movies  So now it knows that the movie category has items and that are located in the movies property. That's one thing  Okay, now my use my semantic zoom control  That has two views a zoomed out view and a zoomed in view  So the zoomed out view is the top level one. The zoomed in view is the one at the bottom  So the zoomed out view  Is a grid view I specified a grid view here. I could have used on this view if I wanted that I'm using a grid view here  And that one  Is simply saying well, I'm the zoomed in view is now binding to the movie categories  Um  It's actually binding to the collection view source and that's how it knows that the data is grouped  And the items are going to be the movies now. Then I define the grid view  The grid view itself  Has an items panel, which is basically how the different  Blocks are each groups. Sorry how each of the groups are going to be stacked in this case, which is a virtualizing stack panel  horizontally  And then we go into the group definition now we specify how a group is going to be shown  Here we specify that each group in the group had a template  Has to be a button  right  With the category name on there. We map is it still running? No, it's not running anymore  So if we uh  If we take a look again, so in here  So that's the category that you see here. That's a button. I can click on it doesn't do anything, but it's a button  That's what you see here  Um  and then the item sorry the  The the panel for each of the items inside of the group is in this case a variable sized wrap grid  That's basically specifying how all the movies inside of each group are going to be visualized  Then  In the uh, yeah, so in here now  This is basically a bit of a bit of a bug. I think I think they're going to change that  It doesn't automatically find those movies in here. So I do need to specify  In here to the grouped sorry to to the to the zoomed out view  What are going to be the collection groups?  So how it needs to show all the different groups and that's what i'm doing here  So on that grouped uh items use source so the view source for my uh for my data binding  I specify views or collection groups and I specify those as the item source for my zoomed out view  So basically that means that the data context is not uh going through  I assume that it's going to be changed when things are final  The zoomed in view however that works out of the box  Sorry the the uh  this one here  So for the uh the zoomed out view that we specify that uh each uh group is going to be a group.category name  You just simply specify for each group in my data take the category name and show that in the zoomed out view  That is one way of doing it  There are other ways of doing it, but this is one way that I found that is reasonable to do with my uh semantic zoom control  Okay, let's continue if you have questions we'll do them at the end because we have so much thing to talk about and um  Then we'll we'll have some time more time for everyone to to look at things. Okay  What about o data people are using o data here?  Couple of people yeah now o data is  I would say it's quite popular, but  judging from this room, I would say not  Um to o data is basically what you create with the wcf data service. It allows you to create or to expose your model  over a service  using uh a query based syntax you can ask your model for uh  Basically you can perform a query against your model  Now again in consumer preview and I imagine this is not updated at this point yet for uh release preview  There was an o data client library available  Um again if you're coming from from wpf a silverlight  Uh, you probably know that there was in dot net in general. There was an o data client library available  That makes it much easier to work with wcf data services. So normally you would have to create the uri yourself  Get in the xml that is being returned by the by the service and then  Go pass that xml into objects the client library does all that for you. It basically allows you to do right there  Is to your wcf data service and uh create object automatically  It does work, but not everything is implemented yet. Uh, probably  The biggest thing that is not implemented at this point is the ability to create  Uh, your uh, your service reference in visual studio. That doesn't work yet if you try doing that to  Wcf data services data service. It doesn't work at this point. You have to use something called the data svc  Util which is comparable to svc util but then for wcf data services  Okay, let's quickly take a look at that  Um, let us uh  Go to uh, not this one  Let's take a look at o data  All right  All right  So it's it's hitting the breakpoint we'll take a look at the break on you just a second  So with this it is now we are now talking with the netflix data as uh, wcf data service  Or the netflix o data endpoint  Um, netflix is a movie service and they have a great api to browse all their movies that they  Expose can't get it in belgium. Can you get it here? Not flicks as it exists here already  No, I don't think so. I don't think it exists in any country in belgium. So anyway, they have a great api  They have an old data endpoint and we're using that one in this case to browse the movies  In uh in in this weird categories that we see here  Okay  Not gonna open those movies  Okay, now how does this actually work  so what you need to do is um  You need to use the data svc utl which is included when you install the client library  And then you can you can point it to the o data endpoint and then it will create for you your um proxy  Let's say what would normally be created by adding a service reference, but it doesn't work in consumer preview  So when I do that I get this class that is being generated for me  As you can see here. That is basically my context my data service context that is being generated  Exactly the same as in other technologies. There's not really a much of a difference happening here  Now, um inside of my code, uh, and let's go let's perhaps run it again  Then we can see what is happening. So what is happening here is I am going to load uh genres from um  from uh  Netflix, but I'm going to do a query  I'm not going to say look give me all the genres because they have tons of genres  What I'm going to do is I'm going to say give me all the uh genres that contain sci-fi  So I'm going to talk with that context the code that was generated in the using the data svc utl  And if you've never seen o data, so this is what is going to happen. Uh, where is the query here?  um  So what is going to happen? Let's zoom in on this. Let's try that there we go  The query as you can now see it is now talking it's readable. Yeah, so uh, it is now  It has it has built up a query. So it has translated my link query into  uh  A uri  And that uri is going to return me a unique response  So that if you don't use the client library you have to do yourself and that is basically uh, not very  Fun thing to do. So it's automatically translating me that query into a uri. I'm going to launch that query to Netflix  There we go and now it has gotten in the response and now basically I'm going to go through all these genres  build up where it's going to get the um  Now it has to download for each of the categories an image  It's gonna I think it's going to take the first image of the first move that it finds and then it's going to do another  call to o data  The o data endpoint now notice what we haven't talked about yet  Is that of course we are using the await here and here as well  If you've done o data work in a previous life  You'll probably recognize that this is more or less the same thing  You build up a data service query by talking to your context you execute that query you wait for the response  Asynchronously using the awaits and we'll talk about the wait later if you have time and then we get in the response  And because of the o data client library, it returns me objects. It doesn't return me xml  It basically returns xml, but that o data client library is uh materializing my xml into  Into objects and I can use those objects in as you can see here  It's automatically creating me new genre objects. Okay cool way of working wcf data service  Not always that easy, but it's a cool technology if you get into it. It's really  Um, consumable for many other technologies  all right  another thing that uh, if you were in my windows phone talk, uh, we've looked at  Uh at background downloads in windows phone  um  Now in windows 8 the same problem is coming up again that we have in windows 7 7  What if we want to build an application that needs to do downloads in the background?  Because of the fact that we are limited to do one application in the foreground  If you build an application that needs to download stuff the user has to either  Leave that application on the screen or otherwise his download is is not going to continue. Of course, you can't snap it  Yeah, okay, that's one solution, but you never know if the user is going to be able to snap  So that's not a good solution either. So, um  In windows uh met in windows 8 even after we have the windows networking background transfer which has a background  Downloader and to that background downloader. We can add download operations  Which is basically saying create me a download operation for a ui  Sorry a ui add that to the background downloader and that background downloader is going to take over the download  It doesn't matter if your application remains on the foreground or not. It doesn't matter  It's basically a different executable. Uh, and that is the background transfer host dot a say  Exe that is going to run even if the application gets killed  It's going to continue the download for you if the application is uh, is is not running in the foreground anymore  Even if it gets if it's precious even if it's uh, it being killed the download is going to continue for you  The only thing the only way that I found that I could stop the background transfer host is by deleting the file  It's actually downloading then it automatically crashes and stops downloading. It supports credentials. It supports  Uh, things like custom cookies like setting the headers. That's uh, that's sometimes very important  I've done this for a project in silver light. It's can can be very  interesting and  Another interesting thing it can also report progress while it is running in a different executable  It's a different service basically on the machine. It is capable of communicating back to the windows  Metastyle app what the progress of the download is  Okay, let's take a look at that  uh background transfer  this one  Till what time do we have 40 6 6 40, right?  And that one guy was just going to stated until nine. Yeah someone over there  Okay  Okay, let's take a look at downloading stuff. I am going to um  I'm gonna copy a link that I have somewhere over here, which is the big bunny uh  movie  It's quite big. It's about a gigabyte. I think so at this point my application check. There's basically no backgrounds for my app  running  So, uh, let's uh remove this thing. Let's put in something different here  And I'm going to download something called avi  There we go. I'm gonna start to download normally should start it if we get network connection. There we go  So it says downloading  Fingers crossed  If it waits till out there we go  So it's now downloading and you see that my app is actually getting progress being reported uh to uh to the ui  Yeah, of course. I'm not uh scrolling all the way back. So it's actually quite fast network already on 2 percent  If we now take a look at the task manager  You'll see somewhere over here. There we go  The background transfer download upload host my app is now not the foreground app. In fact, it's not suspended  But if I kill it, it keeps on downloading this so you see that this is a different executable  That is downloading that's performing my download for me while I don't have to do it. It's doing that for me  All right, um, let's go back to the app and let's cancel that because otherwise it keeps on downloading  Is it cancelled? Yeah, okay  In Norway the network is much faster than in Belgium. Anyway  Uh, okay, let's take a look at how this thing works  So, um  Not this one. Let's keep that one. Let's take a look at what we do when we click on the start download button  So first I'm going to build the ui where uh that I want that I want to download from from the from the ui  From the from the sorry from the text box that I'm going to specify where the file has to be located notice if we have time  for files, I think that was one one that you voted high  Um, you cannot put this file in the c slash whatever you can't do that  You can put it for example in a known folder of the application or also in the local API storage API of the application  so the storage file  Gets created in this case. I'm putting this in the pictures library. I could have put it in my documents. I don't know  Um, what I'm doing is I'm going to create a file for the download and I'm going to create a unique name  That's not that has nothing to do with downloading effect  but then then I create an instance of the background downloader and I specify  Uh that the downloader should create a download and that is going to result in the creation of a download operation instance  Yeah  The download operation instance in fact is not  Anything it doesn't do anything yet  So that download now passing to this handle download async and in that handle download async  I need to start that download async and that is actually going to start the background transfer host executable and download the file  Asyncously so in here, I say download start async passing in  um, the something called a cancellation task  A cancellation token source. I'm sorry. Uh, and also passing in  an uh, a delegate to  Return me progress in this case the progress callback that's defined two lines above in here  Um, so what happens when I uh, so what happens to report the progress this download progress is being called  In this case this happens on the background thread. So I need to marshal back to my UI  And therefore I'm using this marshal log  Helping method in this case. Uh, so this is going to be called  To update the UI about the progress of the download and then when I click on cancel  That's what's happening here when I click on cancel that cancellation token source is the is the way of  Download canceling the download everything that is associated with this cancellation token source  Can be cancelled asynchronously. So basically killing the download  That's what I'm doing here. I'm saying everything that's associated with this cancellation token source cancel it  And then let's restart all over create a new cancellation token source and create a new list of active downloads  I've skipped on that one. Okay  All right, let us continue  Let's go back to the slides  Talk a bit about services in general what works asmx wcf  Rest services. They are supported  Using xml using json that works as well  RSS is supported and sockets are supported. They don't have a demo of socket set. That's all it's quite complicated  In terms of wcf, that's always a very important one. Many people use wcf  What is supported again more or less on par with silverlight?  The basic htp binding works the custom binding works for example  If you want to combine it with binary text encoding, sorry binary encoding  The net tcp binding works and the net htp binding works  That that  Indeed means that the wshtp binding doesn't work. I assume for reasons that are the same as in silverlight  So because of the fact that the private key would then be on the client  So more or less the same thing as silverlight  In terms of encoding so binary encoding is supported text encoding is supported  Security again, more or less the same thing as silverlight  You can pass in credentials if you've seen my talk. I think I did it here one or two years ago on silverlight security  There I talked about passing  username password in the header of the message with wcf that is possible in  Metro as well using the transport with message credential or transport credential only  So it is possible to do authentication with a service. That is an important one that that works  So for the rest, yeah, again, I'm not going to read it all for you  One thing to notice with wcf  Again in consumer preview  There is no file. So no configuration code generated for you. Everything happens in the reference.cs  Which is a bit of a  pity actually  In the reference.cs so in the file that gets generated when you create a proxy  There is a method called  Configure endpoint which is partial which you can use in your code  Again as partial of course to configure the endpoint to configure the binding basically  That's how it's done at this point. Everything also is task-based. So again, everything is asynchronous  just like with the odata endpoint from netflix everything in  in  Communication with services is asynchronously task-based of course  And one thing that you shouldn't be forgetting is that the application needs internet capability  If you want to talk with the wcf service and you forgot the internet capability, it's not going to be able to reach out to the internet  Okay, let's take a look at a very simple demo  So let's go to service access  So i'm going to use this one and then use  I'm gonna let's let's let's use just a public service. So in this case i'm using a an asmx endpoint  In the project in here  You can see that no configuration code has been harmed in the making of this of this solution  But it wasn't generated either. So that means that everything  That we need to do in terms of configuration has to be done in the reference.cs  You can't change that because once you update your service reference, it's gone  But there is a configure endpoint in here  Figure endpoint there you go  Where is it?  Uh, that's not what I wanted. So the configure endpoint  The configure endpoint is a partial method that you can use to do the configuration of your endpoint in your own code  Let's hope that that changes  In terms of talking with the service. So this is an asmx service. So it uses the basic htp vining  Um, that is the asmx sample that's this one. So what I'm going to do is I'm going to instantiate my service client  As you can see here on the first line and then I'm going to talk with my service  It is all generating task based methods. So I can await them  So I don't have to do any callbacks like I should like I should have to do to do in a silver light  So I can use the tasks that are being returned by the get city  Get better get city weather by zip async  So this method the rest of this method is only executed when the method  So the callback is or the call is returning if you take a quick look at this  So you see that you're working with the services more or less the same thing  There's not that much that changed apart from some things that are a bit missing  So this is a us weather service. So I think about a very bad tv show that was on many years ago  So indeed in Beverly Hills, it is now 59 59 degrees Fahrenheit. Okay. So this has communicated with the service. It works. The application itself has the internet capability  There we go in the capabilities. It has the internet capability set to true because otherwise I would not be able to connect with that service  This is an amx service. Now. What about rest services?  Oops, we've seen that already. What about rest services in  in  Silverlight you would have used the  Web client in silver light. Sorry in metro. The web client doesn't exist anymore. You have to use a replacement  Which is called the HTTP client  There's not much difference. You can use more or less the same thing or you can do more or less the same things  It's a bit of a different API, but the results are the same  What you can do with that HTTP client is the get async, put async, post async and delete async  So it is basically possible to work with restful services  The response of a rest service is well json or xml  If the service is returning json or you build the rest service that returns json, well, you can consume it from winRT  You can use the json object  On which you can call the parse. You can call the get name string the get named number  Or you can also use the indexer, which you should never do, but you can do it  And then you can also use the data contact json serializer that is included in winRT  If you have a response coming back in xml format, you can use the xml serializer  You can use xml reader rather and link to xml, which is probably the preferred way of doing it  I'm going to quickly show you a very small demo where I'm going to talk with Flickr  The image service  So they have a great REST API  And you can use it via some things you can only use via xml, some things you can use using json as well  So we're going to search, of course we are in Oslo, so we're going to search for Oslo  A couple of times back I had some embarrassing pictures showing up  But in Oslo people are very nice, I think. There we go  Okay, so these are pictures being returned, so this is actually an xml response and it's downloading the pictures on the fly  As you can see, notice by the way that this is virtualized. It didn't create me thousands of images, actually hundreds of images  Because Flickr normally returns 100  If I scroll very quickly, you see that it hasn't insesated the elements yet  That's because it is doing this thing virtualized, that is doing by default. What the hell is this?  Okay, anyway, so let's take a look at the code  So REST service  So what I'm going to do is I'm going to create a client  Actually, I'm going to call this method createClient in which I'm going to instantiate the HTTP client method  As you can see here  So I'm going to instantiate the HTTP client, the web client is gone  And then the HTTP client, let's go back up  Has a method called getAsync  What do I pass in? Well, the uri basically of the page that I want to download, the response that I want to download  In this case, it is a formatted string in which I pass in some parameters that are  Viable for Flickr  I get back  Of course, this is asynchronous. I get back in HTTP was HTTP response message  And then I'm going to pass because this is XML  Sorry, I needed this one  So what I'm going to do is I'm going to read out the content coming back from Flickr by saying response.content.readSstringAsync  It's just going to return me a string that I can pass using the link to XML implementations  So an XML document in this case, sorry, what am I saying? An x document  And then I'm going to loop through the results using a link to XML query and I'm going to bind that in my UI  That's more or less the same thing, something that you already know  All right  The final thing that we're going to take a look at in the data part is skydryff  There is a live SDK available for Windows  Metrostyle apps. I don't know if it's updated for release preview already  But because of the fact that in Windows 8 you can log in with your Microsoft account, your previous live account  It is possible to build apps that integrate automatically with the skydryff API that automatically is also using  The live SDK, sorry, the live single sign-in  So you can build an application  That doesn't require the user to log in again or to build an integrated sign-in experience  If the user hasn't signed in with the live ID account and that therefore you can build an application that for example  downloads the pictures from your skydryff. Let's take a look at that  So let's open the photo sky application  Yeah, why am I asking that now  For some reason today it opens every solution in the full blown visual studio while normally it  Uses the express edition. I don't know anyway  So let's take a look and hopefully this will work  So it's going to go out take my  Unlocked in with my live ID and it's going to take a look at my skydryff and download all the pictures that I have  On there as I have this is test account. So there's only a couple of pictures  Uh, so let's skip on the breakpoints  And I'll do them in just a second should that  There we go. Everything happens asynchronously. So you don't know what is going to happen first. There we go  There the pictures are coming. I hadn't didn't have to log in again because I'm already logged into windows  I have a single sign-on experience. I'm logged into windows with my live ID. I should say my microsoft account now  Which sounds a bit weird, but anyway  Okay, so let's take a look. You saw the pictures popping up there and notice here the uh, msn guy  Or how is this thing called? Uh, it's also up there. Basically. This is a sign-in button and that's the thing that triggers everything  Let's let's perhaps restart it and you can see everything that starts happening at some point  It's going to get the session from uh from that sign-in button if you install the live sdk  on the  And the group items page  Somewhere over here. There is  There is a sign-in button and that sign-in button you have to put on your  On your ui it allows the user to sign in if he hasn't signed in that could be that user is using a local account  And then the session changed event is going to be triggered  It's automatically triggered if the application gets in the live sdk gets in the  Uh, the the live sorry the the microsoft account from the local device and that will trigger a session changed  That session changed will automatically  Get in the uh, let's let's go back to the breakpoint and then it's gonna you're gonna see what happened  So basically what i'm doing is I have in my uh application xaml  I have a property called session which is of type live connect  Live connect session and that session is going to be set because of the fact that in the  In the session changed event here, I'm setting it get it in  I will see that the live connection status is connected. I get in the session. I'm going to save that  Okay, what I'm then going to do is I'm going to download all the images from uh from my  I am from my uh sky drive in this case. So i'm going to use something called a live connection client passing in the session  And then there was some basic query syntax basically that you have to use  And you say client would get get me all my albums get me all my albums  That's going to result in a live operation result and then things start getting a bit more complicated  As you can see here, you have to ask that live operation result dot result which returns you dynamic  And on that dynamic you can start looping in this case on the data  property and then in that case I get in all the uh the  The albums and for each of these albums and then I have to go back out to live and ask me the pictures that are in there  It's the bits. It's still not really easy to work with but it works  And most of the most important thing here is of course to take away that it is possible to build a single sign-in  Uh experience with the microsoft account of the logged in user  all right  I think we're way behind but anyway, so, uh, let's take a look at background um apps  Okay, that is all the way at the back. Let's collapse a few things here  Am I happy that I built that in background tasks?  okay  Now background tasks are a bit of a hot topic. I think in windows 8  Since by default we can only run one application at the same time  Now you hear microsoft talk a lot about background apps  And lock screen apps. Now. What is the difference? Is there a difference and how do we get uh, what the difference basically is?  Now by default only one application can run you know that by now  Uh, only one application again can receive all the resources of the system because that is the main application  That's running. You know what I have can basically do something in the background  That's not really true  However, because of the fact that there is a background task API in windows, uh eight in every nocti that allows us to run  code in the background  Exactly like windows phone. It is not the same code that will run in the foreground  It is not your app that keeps on doing stuff in the background. It's a separate part of your app  That is basically registering itself with the system and saying well, I want to do something in the background. Okay, that works  It's more or less the same thing as windows phone again  There are some differences for example. This one can add more than one background agent. Let's call it  Windows phone can only add one  okay  Now how does this actually work? Well, basically what you need to create is  uh  a separate  project that creates  A background task and that background task is going to be created using a class called a background task builder  And a background task builder can register a class that implements the ibackground task interface  And that ibackground task interface has a method called run  And that becomes basically the code that will be uh called when the background task is going to execute  That's how it works. So from your app use the from your main app. You use the background task builder  that  registers a class that implements the ibackground task in  Interface and then that code can run in the background now how it can remember come back to that in just a second  Now this code will  Be managed by an external process which is called the background task host  Uh, and it can also happen in process now in process is is a specific case  Normally it is executed by a specific executable the background task host exit  Now one is this useful. Well in many cases, I think uh things like  voice over IP applications iam message messaging applications  Mail applications they need to do some checking. Is there already a new mail on the server?  Yes, no, they need to check that every time to keep you updated  Now when does this code run? Well this code can run  periodically or in response to system events now that periodically is basically also a very specific case  Now when does the code run?  In windows 8 in metro apps the background task runs all the time  It doesn't matter if the application is running if it is suspended or if it is if it is terminated  The background task runs completely independent from the main application  It doesn't bother taking a look at if the main application is ready is finished is running or not it runs  You register it it runs it keeps on running  Now when does it run and that's an important one?  now basically  an application  So a background task can only run when a trigger is triggering the execution of it  Now what are the triggers that exist? Well you see a list here  You see a very important one at the very top which is the time trigger  But sadly it has a little star next to it  Anyways, when there's a star there's always some little letters and that says some little small text that says it requires lock permission  Now what is lock permission? Coming back to that in just a second. Basically that means that it cannot not every app can build  Background tasks that run every now and then that run based on a time trigger time trigger says after 30 minutes or so  That's not possible for every app to do that  There's some other ones as you can see as a mass receive network state change things that might or might not seem useful  And then the execution can also be linked to a condition  So the trigger happens, but you can also  optionally specify a  condition that has to be true for the trigger to execute and therefore your code execute  For example, that can be internet available in and out available user present user not present  But is he logged on or is he away?  Okay, might seem a bit complicated. It's complicated for me as well  um  So I already said this, okay  How does this actually work so your main app?  says well, I have a background task to register so when it first runs  It says well, I will register this task using the background task builder with this and this and this trigger  At some point so that it does that with an external service with the system at some point that trigger will fire  And then the system will say well now we execute your code. For example, the internet is available trigger  Well, then it's going to execute the the your code when there is internet available again or network state change, I should say  Okay  Remember in the slide with all the triggers we had a star next to the time trigger  To use a time trigger your application has to be a lock screen application  So it's not enough that your application your application can simply say well, I'll run to run some code in the background every app can do that  But to become a lock screen app is  Requires that the user says well, yeah, I want to allow this application on my lock screen  Therefore saying to the system while this application is important  Well, I'm going to pin it to my lock screen and then that is that is a trigger for the system  Not another trigger like this, but the trigger to say well this application is important. It can do more on the system  It has lock screen permission. Therefore, it can do more on the system. It can do background tasks based on time  So that run every five minutes every 10 minutes checking for a new map, for example  So that is the difference  There's a difference between a background task. Everyone can create as many background tasks as they want  But they cannot all be linked to time triggers other triggers as well. But the time thing is I think the most important one  So when they are on the lock screen and now I'm going to do something very  dangerous  I'm going to go to the lock screen  So here you see  Down there at the bottom. Those are the apps that are available on the lock screen  Applications, there's a maximum of seven applications that are on the lock screen that can do stuff based on time  I'll login again. There we go  When user places the application over there  the application can  Show a batch update like it like a push notification  Sorry like a tile update. It can show a tile. Let me rephrase it. You have on a tile update  You have the regular tile update and you have batch updates. It can show a batch update on the lock screen  And then the user can also select one application that he says, well, that's a really important one  That one can also show a tile update on the lock screen  The user says well, it's so important for me that it's a very important one  It's so important for me that it should show me real-time information  What you need to do for that is you need to specify, of course, the image that it has to show that's quite normal  But in any case  The user remains in control  There we go  It is in the configuration panel. There is a lock screen window or a lock screen pane  Where the user can specify which apps he wants to allow on his lock screen  Therefore saying this app can do more therefore saying this application can access  Or can execute based on time  And there's one down there at the bottom and instead of showing it on the slide. Let me go to the settings and the lock screen  So here you see that these are apps that are  Able of showing updates on the lock screen and then from these I can also show an application that has  Um that is going to be allowed to show a tile update on the lock screen  Therefore saying well, this can even do more but in terms of of being able to run in time  Only the apps that are pinned to the lock screen can execute a background task  Uh on based on on a time basis  Let me quickly show that to you and then we'll have to round up because we're already over time. I'm sorry  Talked a bit too much  So let's first take a look at background tasks. How do we create a regular background task?  So if you take a look at the solution manager, you see that we have two  Two projects one that has a class sample background task  That implements the  I background task and it has a method run and we're going to implement that and that code is going to be the code that is executed  so, um  This this background task is already registered. So I'm going to register now a background task  Unregister it and now I need to disable my internet. Don't need it anymore today  What did I disable here?  I think I disabled my bluetooth  I know I have wired connection  So now the network state changed there we go. So this background task is triggered based on the network state  Um, it's not available. I think it is and then I click it in again and there you go  You see it starts running again  So there we go. It is in this case running  So this application is in communicating with the foreground. It's it can do that if you want that so it can run whether or not the application is in the foreground or not  So this application could never have used a time trigger  So now we have so this is the background code that the code that just starts running  The run method is is executing and in this case  Uh, normally, uh, that's an important thing as well to notice here. Normally this code would just run  top to bottom  But I don't want this to run and then stop doing its thing. So in this instead what I do is I ask for a deferral  The deferral basically says well instead of going through wait until I give you that referral back deferral back  And then I instantiate the periodic timer and it starts running and it has a  periodic timer callback on the timer elapsed  And that updates the timer progress and at some point when the timer is complete  Then we say well now it's okay to shut me down deferral is complete  That's the background code the ui code  has to register  Let me scroll up  Uh, this one  I'm registering a background task  Passing in the name of the class has to run passing in the name of the task to find it afterwards  Passing in the internet not available trigger and don't not passing in a condition  Let's go to this one. This method is actually doing the registration of the background task by saying background task builder  I'm going to instantiate you pass in the name  Of the task passing what has to execute set a trigger that was the internet available trigger  Not passing in a condition in this case and then I'm creating a background task registration  And that is in that case going to register the the builder. So it's sorry. It's going to  Say builder dot register and that's going to return me a background task registration  Which I can use to do stuff with my ui. I can sort the updating of the ui  I'm going to show you the rest. I'm going to quickly show you the lock screen apps  And then we're going to round up  So lock screen apps  For some reason it changed default to visual studio fool. Anyway, so, um, let's run this one as well  So this app  One thing one second. I need to update the name of the app because it's filtering it on name  I probably already denied it lock screen access. So now from the code I am going to request lock screen access  There is no  Action taken yet and the user it's not on lock screen. So if this would now try to do a time trick, which would fail it  It would never be executed  So now for my app, I'm going to say well, dear user, can I please go on the lock screen? I am your mail app  I should go on the lock screen  user says, okay allow this  Let's now go back to the lock screen  And now also say here  You see it was already here lock screen application sample seven  Now I specified this app to be the app that I want to get most updates from  Let's go back to the app  this one  come on  And now I'm going to send a tile notification and a batch notification  The batch notification is going to show at the bottom and a tile notification is going to show at the very top  Let's log off again  And you see now that there is a tile notification next to the clock and there is a batch notification shown at the very bottom  This can now this is now registered as a task that will do some code  Every now and then because it can use a time trigger and it will be able to  receive updates and and get updates and also receive push notifications and show them on the  lock screen  So, um, I'm very sorry, but I think we have I think you're going to throw us out of the room if I keep on going  Unless you want to do some other things  Should we should we stop?  I can stay until eight. I have nothing to do  So I think we're we're gonna have to round up maybe let's let's round up with uh with uh  With the bag of tricks and then then we'll then I'll really shut up. Um  Um, sorry, I have a train to catch you have a train to catch. Okay. That's a valid excuse if someone else has to take that train  please go  And so we're gonna I'm gonna show you the bag of tricks, which is I think five  Code snippets that sounded interesting to me  You can download every slide every demo of uh of my blog so  Don't worry. You get them all for free  By just being here  Your presence has made me so happy  so, um  for example  From code it is possible to change the lock screen image  I'm gonna use a file picker  And I'm going to select an image it's possible and I'm gonna put that as my lock screen image  I now log off  You see that it's christmas already  Um, so it's possible to do a lock screen image change  That's wrong I think  It's also possible to check from code and that might be interesting in some in some applications to detect the input  If you have to check what uh, what input uh methods are available  You can do so. Uh, for example, this this laptop only has a keyboard and a mouse and it says touch is not present  Yeah, I wrote some code for that, but it's capable of checking that itself. You can do that from from the api  It's also possible to detect the devices that are connected  Um, that does give you some some weird results in this case  But it's for example possible to check the connected devices  Uh, the trend the other mouse and stuff like that the camera you can detect it  And finally  It's possible to detect the lockdown user  Which is in this case very appropriate in this case  So it says it says the lockdown user says it's it's time to go home. So I'm not going to go over the code  Uh, download everything from my blog take a look at the code at your own pace. I hope you enjoyed it  I'm sorry. We couldn't do everything. It was planned on not doing everything. I hope you enjoyed it  Uh, thanks for being here and I hope you enjoyed the rest of the conference. Thanks
Gill_Cleeren_-_In_and_out_in_WinRT_0_935.png Gill_Cleeren_-_In_and_out_in_WinRT_936_995.png Gill_Cleeren_-_In_and_out_in_WinRT_996_9227.png Gill_Cleeren_-_In_and_out_in_WinRT_9228_12299.png Gill_Cleeren_-_In_and_out_in_WinRT_12300_14615.png Gill_Cleeren_-_In_and_out_in_WinRT_14616_15059.png Gill_Cleeren_-_In_and_out_in_WinRT_15060_17075.png Gill_Cleeren_-_In_and_out_in_WinRT_17076_17459.png Gill_Cleeren_-_In_and_out_in_WinRT_17460_18767.png Gill_Cleeren_-_In_and_out_in_WinRT_18768_19979.png Gill_Cleeren_-_In_and_out_in_WinRT_19980_20039.png Gill_Cleeren_-_In_and_out_in_WinRT_20040_20903.png Gill_Cleeren_-_In_and_out_in_WinRT_20904_21827.png Gill_Cleeren_-_In_and_out_in_WinRT_21828_22151.png Gill_Cleeren_-_In_and_out_in_WinRT_22152_30563.png Gill_Cleeren_-_In_and_out_in_WinRT_30564_31151.png Gill_Cleeren_-_In_and_out_in_WinRT_31152_31439.png Gill_Cleeren_-_In_and_out_in_WinRT_31440_36563.png Gill_Cleeren_-_In_and_out_in_WinRT_36564_36707.png Gill_Cleeren_-_In_and_out_in_WinRT_36708_36803.png Gill_Cleeren_-_In_and_out_in_WinRT_36804_39407.png Gill_Cleeren_-_In_and_out_in_WinRT_39408_42107.png Gill_Cleeren_-_In_and_out_in_WinRT_42108_42275.png Gill_Cleeren_-_In_and_out_in_WinRT_42276_42563.png Gill_Cleeren_-_In_and_out_in_WinRT_42564_42971.png Gill_Cleeren_-_In_and_out_in_WinRT_42972_43487.png Gill_Cleeren_-_In_and_out_in_WinRT_43488_43883.png Gill_Cleeren_-_In_and_out_in_WinRT_43884_46919.png Gill_Cleeren_-_In_and_out_in_WinRT_46920_48851.png Gill_Cleeren_-_In_and_out_in_WinRT_48852_52067.png Gill_Cleeren_-_In_and_out_in_WinRT_52068_52907.png Gill_Cleeren_-_In_and_out_in_WinRT_52908_53087.png Gill_Cleeren_-_In_and_out_in_WinRT_53088_53543.png Gill_Cleeren_-_In_and_out_in_WinRT_53544_53639.png Gill_Cleeren_-_In_and_out_in_WinRT_53640_54707.png Gill_Cleeren_-_In_and_out_in_WinRT_54708_63203.png Gill_Cleeren_-_In_and_out_in_WinRT_63204_64619.png Gill_Cleeren_-_In_and_out_in_WinRT_64620_66203.png Gill_Cleeren_-_In_and_out_in_WinRT_66204_66527.png Gill_Cleeren_-_In_and_out_in_WinRT_66528_69071.png Gill_Cleeren_-_In_and_out_in_WinRT_69072_69515.png Gill_Cleeren_-_In_and_out_in_WinRT_69516_69707.png Gill_Cleeren_-_In_and_out_in_WinRT_69708_69779.png Gill_Cleeren_-_In_and_out_in_WinRT_69780_69995.png Gill_Cleeren_-_In_and_out_in_WinRT_69996_70043.png Gill_Cleeren_-_In_and_out_in_WinRT_70044_70367.png Gill_Cleeren_-_In_and_out_in_WinRT_70368_70523.png Gill_Cleeren_-_In_and_out_in_WinRT_70524_72671.png Gill_Cleeren_-_In_and_out_in_WinRT_72672_72743.png Gill_Cleeren_-_In_and_out_in_WinRT_72744_73955.png Gill_Cleeren_-_In_and_out_in_WinRT_73956_74039.png Gill_Cleeren_-_In_and_out_in_WinRT_74040_75407.png Gill_Cleeren_-_In_and_out_in_WinRT_75408_75467.png Gill_Cleeren_-_In_and_out_in_WinRT_75468_75539.png Gill_Cleeren_-_In_and_out_in_WinRT_75540_75827.png Gill_Cleeren_-_In_and_out_in_WinRT_75828_79775.png Gill_Cleeren_-_In_and_out_in_WinRT_79776_79859.png Gill_Cleeren_-_In_and_out_in_WinRT_79860_90491.png Gill_Cleeren_-_In_and_out_in_WinRT_90492_92831.png Gill_Cleeren_-_In_and_out_in_WinRT_92832_93791.png Gill_Cleeren_-_In_and_out_in_WinRT_93792_93959.png Gill_Cleeren_-_In_and_out_in_WinRT_93960_94415.png Gill_Cleeren_-_In_and_out_in_WinRT_94416_94571.png Gill_Cleeren_-_In_and_out_in_WinRT_94572_94667.png Gill_Cleeren_-_In_and_out_in_WinRT_94668_95879.png Gill_Cleeren_-_In_and_out_in_WinRT_95880_95927.png Gill_Cleeren_-_In_and_out_in_WinRT_95928_96011.png Gill_Cleeren_-_In_and_out_in_WinRT_96012_98195.png Gill_Cleeren_-_In_and_out_in_WinRT_98196_98639.png Gill_Cleeren_-_In_and_out_in_WinRT_98640_99275.png Gill_Cleeren_-_In_and_out_in_WinRT_99276_99719.png Gill_Cleeren_-_In_and_out_in_WinRT_99720_101675.png Gill_Cleeren_-_In_and_out_in_WinRT_101676_102311.png Gill_Cleeren_-_In_and_out_in_WinRT_102312_103727.png Gill_Cleeren_-_In_and_out_in_WinRT_103728_103883.png Gill_Cleeren_-_In_and_out_in_WinRT_103884_103955.png Gill_Cleeren_-_In_and_out_in_WinRT_103956_104087.png Gill_Cleeren_-_In_and_out_in_WinRT_104088_104711.png Gill_Cleeren_-_In_and_out_in_WinRT_104712_104771.png Gill_Cleeren_-_In_and_out_in_WinRT_104772_104819.png Gill_Cleeren_-_In_and_out_in_WinRT_104820_105071.png Gill_Cleeren_-_In_and_out_in_WinRT_105072_105131.png Gill_Cleeren_-_In_and_out_in_WinRT_105132_105671.png Gill_Cleeren_-_In_and_out_in_WinRT_105672_105935.png Gill_Cleeren_-_In_and_out_in_WinRT_105936_105995.png Gill_Cleeren_-_In_and_out_in_WinRT_105996_106275.png