Entile – From Zero to Toast in 5 minutes 6

Yesterday, I made two NuGet packages for Entile available in the NuGet gallery. Today, I thought I’d walk you through how to get started! I will show you how to create a completely functional app with a Live Tile as well as Toast notifications.

Prerequisites

You’ll need the following installed on your developer machine:

Create the Windows Phone 7 App

First of all, let’s create a simple Windows Phone 7 App. I’m using the Pivot template from the Silverlight Toolkit, but any template will do.

Step1-Create-App

Create the Web Application

While we are at it, we’ll create the Server part of the application too. In this case, I’m going for an empty ASP.NET MVC 3 application, but again, more or less any Web Application or WCF Service Application will do.

Step2-Create-Host

Add the NuGet packages

Open up the Library Package console (Tools->Library Package Manager->Package Manager Console). Type the following into the console (replace EntileDemo.App with the name of your Windows Phone 7 Project and EntileDemo.Host with the name of your Web Application project):

Install-Package entile-client -Project EntileDemo.App

Install-Package entile-server -Project EntileDemo.Host

Step3-Install-Package

This will download and install the client and the server part of Entile into your solution. You should now be able to build everything, but it won’t run properly just yet.

Configuring the client

Now it is time to make sure that the client knows how to talk to the server. By default, all client-side settings are found in the EntileSettings.xaml file. Open it up and change the RegistrationServiceUri and the AllowedTileUris entries to point to the name of your host. Working locally on your dev machine it will look something like this (where 1234 should be replaced by the port number of your Web Application):

<sys:String x:Key="RegistrationServiceUri">http://localhost:1234/Sample/Registration</sys:String>

<sys:String x:Key="AllowedTileUris">http://localhost:1234</sys:String>

You should also set the ChannelName to something that makes sense, perhaps “DemoChannel”?

Then we just need to hook up the settings to make the application aware of them. You do this by adding the following lines to the Application.Resources element in your App.xaml file:

<ResourceDictionary>
    <ResourceDictionary.MergedDictionaries>
        <ResourceDictionary Source="EntileSettings.xaml"/>
    </ResourceDictionary.MergedDictionaries>
</ResourceDictionary>

Step4-App-xaml

Configuring the server

Now we need to configure the Sample module found in the server. First of all, in the root of your Web Application you should now have a file called EntileStartup.cs. This is where all modules are registered, all we need to do here is to change the host name:

Step5-EntileStartup

One more thing, let’s also make sure that we can send a nice Live Tile by, again, changing the host name – this time it’s in the EntileModules\SampleService.cs file:

Step6-EntileService

Add the view

Finally (yes, this is indeed the last setup step) we are going to add the EntileView to your App. First, make sure that you have built the project. Next, open up the MainPage.xaml file and find a nice place for the EntileView user control. I chose to put it on a PivotItem called “settings”. The easiest way to get it there is to find it in the toolbox and drag it onto the xaml:

Step7-EntileView

Let’s run it, shall we?

Both projects need to run at the same time, so if you haven’t done so already, open up the properties window for your solution and set it up so that they are both set to Start:

Step8-Multiple-Startup-Projects

Now, hit F5 and wait for both the emulator to start up with your phone app, and the web project to show a default page (a 404 in my case since I’m used an empty MVC project). Switch to the screen where you put the EntileView, and hit the checkbox. This will open up a channel and register the application with your server.

Step9-Connecting-To-Server

So, we got this running, let’s show off the capabilities!

Hit the back button and pin the application to your home screen. Open up your browser and enter the following URL (as usual, substitute the host/port with your own):

http://localhost:1234/Sample/SendSampleTileToAllClients

And then to finish it all off, send a toast as well:

http://localhost:1234/Sample/SendSampleToastToAllClients

The result, hopefully, looks something like this:

Step10-Toast-And-Tile

Conclusion

I’ve shown how to use the Entile Notification Framework for Windows Phone 7 in order to get a Live Tile and Toast-enabled Windows Phone 7 Application in just a few minutes. Rest assured however that there is more to Entile than this. A few things you haven’t seen yet but that I hopefully will be blogging about soon enough:

  • Data stores
  • Adding extra information to your registrations
  • The notification queue and using a worker.
  • Running in the cloud (Azure and/or AppHarbor?)
  • … and perhaps something else you’d like to know about?

As always, please please do leave a comment, ping me (@CodingInsomnia) or @entile_fx on Twitter or why not do a blog post of your own experiences with Entile? I would really like to hear from you!

6 thoughts on “Entile – From Zero to Toast in 5 minutes

  1. Pingback: Tweets that mention Entile – From Zero to Toast in 5 minutes « Coding Insomnia -- Topsy.com

  2. Paul Feb 14,2011 07:39

    Hi,
    Great tutorial, but I’m having a problem getting it working. It seems that the client is not registering with the server. When accessing one of the methods like :http://localhost:49813/Sample/SendSampleTileToAllClients. The foreach loop exists without send anything to a client. I have rechecked my settings in the EntileSettings.xaml file and have it setup like this:
    http://localhost:49813/TileToastService/Registration. Can you see what I have wrong?

    Thanks Paul.

  3. Mario Feb 23,2011 22:43

    Hey, heard about this article on the geekspeak webcast regarding WP7 LiveTiles! Thanks for the info and I look forward to checking this out soon!

  4. A. Jeckmans Mar 3,2011 11:29

    Hi,
    I just tried to follow this ‘tutorial’. Somewhere I got stuck and decided to use a WCF application instead of MVC3, however after adding the package via NuGet and configuring everything the service crashed. It seems that the nuget package is adding the following line to the Web.config file:

    This will break any default WCF application because the template project provided by Microsoft already contains a line:
    serviceDebug includeExceptionDetailInFaults=”false” />

    Just wanted to notify you of this small error.

    • A. Jeckmans Mar 3,2011 11:30

      The comment got mangled a bit. The line I was referring to is : serviceDebug includeExceptionDetailInFaults=”true” />

Comments are closed.