I’m really excited to be hosting a few events in the Microsoft Raleigh office focused on Windows 8 development. The first on revolves around our APIMASH starter kits – a great way to get started building mashup style applications in Windows 8, with templates and examples in both C# and HTML/JS. The other sessions are intro to gaming, developing some simple games using Construct2, and GameMaker/other frameworks as time allows. Here are the events/times: APIMASH: Tue 6/4/2013 from 10:00am to 2:00pm and Tue 6/11/2013 from 10:00am to 2:00pm Intro to Gaming: Wed 6/5/2013 from 10:00am to 2:00pm and Wed 6/11/2013 from 10:00am to 2:00pm Here’s a more official description of each event: Game Development for Beginners In this beginner level workshop we will cover the basics of game design, programming and publication. We will build a casual game and publish it to the Windows Store. This workshop is great for students, hobbyists and professional developers who want to learn the basics of game development and publish their first app to the store as no programming skills are required! Windows 8 App Mashup Series In this workshop you will learn how to develop Windows 8 apps based on well-known web service API's such as Twitter, Meetup, ESPN, EchoNest and data from the World Health Organization WHO. Your app could entertain or even change the world. This workshop is great for students, hobbyists and professional developers who want to learn the basics of app development and publish their first app to the store. For more info, stay tuned to the MSDN Events page!
We’re coming up on the annual Carolina Code Camp here in Charlotte and this year we thought it would fun to hold a hackathon leading up to the code camp, rather than simply run an all-day event at the code camp. Here’s your chance to develop a great app for Windows 8, elev8 your skillset, and potentially win some cool stuff Here are the details: The short version: develop a Windows 8 app, optionally attend some of our workshops, and submit it to the challenge. At some point you need to be in person -- either at one of the workshops, or at the code camp -- as we need to prepare the demos and verify you are human. Winners will be determined at the Carolina Code Camp. The details: This app challenge is open to all Developers Guild members and members from the local community. Download the free Visual Studio 2012 Express tools and other related SDKs here to begin developing your app. Apps entered will be voted upon at the Carolina Code Camp on Saturday, May 4, 2013 by the attendees and organizers. While it is strongly encouraged you attend the Carolina Code Camp to demo your application, you do not need to be present to win (you will need to arrange to pick up your prize, if you win). However, you must attend one of the Charlotte Windows App Developers workshops to demo and showcase your app prior to the code camp so we can have it loaded and ready for review. All apps must be original and new (published after 3/26) and must be submitted to the Windows store. In the event it’s not approved yet and publically available, send some screenshots to show the app’s current progress. The package files can be copied over to a demo machine, or you can bring your own machine the code camp to demo the application. Want some help developing your app? Attend one of the Charlotte Windows App Developers meetups. Prizes: 1st Place: Lenovo IdeaPad Yoga 11 and Nokia Lumia 820 Windows Phone. 2nd Place: $250 Visa Gift Card, Wedge Mobile Keyboard and Wedge Touch Mouse. 3rd Place: $250 Visa Gift Card As an additional incentive, the first 10 entries will receive a 4,000 XBOX Live Points card valued at $50! Also, don’t forget about the Keep The Cash offer from Microsoft. Earn $100 for every qualified app you enter. See site for more details.
Abstract: In Part 5 of of their “Using Windows Azure to Build Back-End Services for Windows 8 apps” series Peter Laudati, Brian Hitney and Andrew Duthie show us how to quickly add the ability to implement push notifications for his GameLeader Service using Azure Mobile Services. Check out the full article here. Watch Part 1 | Part 2 | Part 3 | Part 4 After watching this video, follow these next steps: Step #1 – Try Windows Azure: No cost. No obligation. 90-Day FREE trial. Step #2 – Download the Tools for Windows 8 App Development Step #3 – Start building your own Apps for Windows 8 Subscribe to our podcast via iTunes or RSS If you're interested in learning more about the products or solutions discussed in this episode, click on any of the below links for free, in-depth information: Register for our Windows Azure Hands-on Lab Online (HOLO) events today! Windows Azure Hands-on Labs Online Blogs: Brian Hitney’s blog Peter Laudati’s blog Andrew Duthie’s Blog Videos: Microsoft DevRadio: How to Get Started with Windows Azure Microsoft DevRadio: (Part 1) What is Windows Azure Web Sites? Microsoft DevRadio: (Part 2) Windows Azure Web Sites Explained Microsoft DevRadio: How to Integrate TFS Projects with Windows Azure Web Sites Virtual Labs: MSDN Virtual Labs: Windows Azure Download MP3 (Audio only) MP4 (iPod, Zune HD) High Quality MP4 (iPad, PC) Mid Quality MP4 (WP7, HTML5) High Quality WMV (PC, Xbox, MCE)
Abstract: In Part 4 of of their “Using Windows Azure to Build Back-End Services for Windows 8 apps” series Peter Laudati, Brian Hitney and Andrew Duthie show us how to build the same game leaderboard service on top of Windows Azure Mobile Services. Tune in as Andrew demos for us how to get started as well as lays out what some of the +/- are for using Azure Mobile Services for this kind of service. Check out the full article here. Watch Part 1 | Part 2 | Part 3 After watching this video, follow these next steps: Step #1 – Try Windows Azure: No cost. No obligation. 90-Day FREE trial. Step #2 – Download the Tools for Windows 8 App Development Step #3 – Start building your own Apps for Windows 8 Subscribe to our podcast via iTunes or RSS If you're interested in learning more about the products or solutions discussed in this episode, click on any of the below links for free, in-depth information: Register for our Windows Azure Hands-on Lab Online (HOLO) events today! Windows Azure Hands-on Labs Online Blogs: Brian Hitney’s blog Peter Laudati’s blog Andrew Duthie’s Blog Videos: Microsoft DevRadio: How to Get Started with Windows Azure Microsoft DevRadio: (Part 1) What is Windows Azure Web Sites? Microsoft DevRadio: (Part 2) Windows Azure Web Sites Explained Microsoft DevRadio: How to Integrate TFS Projects with Windows Azure Web Sites Virtual Labs: MSDN Virtual Labs: Windows Azure Download MP3 (Audio only) MP4 (iPod, Zune HD) High Quality MP4 (iPad, PC) Mid Quality MP4 (WP7, HTML5) High Quality WMV (PC, Xbox, MCE)
Abstract: Back for part 3 in their series for “Using Windows Azure to Build Back-End Services for Windows 8 apps”, Peter Laudati, Brian Hitney and Andrew Duthie show us how easy it is to host services built with the ASP.NET Web API using the new Windows Azure Web Sites feature. Check out the full article here. Part 1 | Part 2 After watching this video, follow these next steps: Step #1 – Try Windows Azure: No cost. No obligation. 90-Day FREE trial. Step #2 – Download the Tools for Windows 8 App Development Step #3 – Start building your own Apps for Windows 8 Subscribe to our podcast via iTunes or RSS If you're interested in learning more about the products or solutions discussed in this episode, click on any of the below links for free, in-depth information: Register for our Windows Azure Hands-on Lab Online (HOLO) events today! Windows Azure Hands-on Labs Online Blogs: Brian Hitney’s blog Peter Laudati’s blog Andrew Duthie’s Blog Videos: Microsoft DevRadio: How to Get Started with Windows Azure Microsoft DevRadio: (Part 1) What is Windows Azure Web Sites? Microsoft DevRadio: (Part 2) Windows Azure Web Sites Explained Microsoft DevRadio: How to Integrate TFS Projects with Windows Azure Web Sites Virtual Labs: MSDN Virtual Labs: Windows Azure Download MP3 (Audio only) MP4 (iPod, Zune HD) High Quality MP4 (iPad, PC) Mid Quality MP4 (WP7, HTML5) High Quality WMV (PC, Xbox, MCE)
I’ve gotten a few requests about how to do a mashup in Dark Skies … so, thought I’d do a blog post on how it was put together.
First, what’s a mashup? A mashup is an application that combines data from multiple sources into what is, hopefully, a more useful or interesting way to view the data. They are often done as web applications because the data is often pulled from online sources. But, mashups are ideal for Windows 8 and Windows Phone apps, too.
Dark Skies is simply a mashup that combines 3 main sources of data. maps (from Bing), light pollution data (from sources like these: Save The Night, NOAA, and P. Cinzano), and favorite astronomy viewing locations and looks like so:
What makes this interesting is the level of zooming, so you get really specific:
Specific is good, but add in data sharing and you, hopefully, have an ideal mashup experience.
Overlaying pins is easy as the map. In fact, there’s a small sample on putting pins on a map here. The harder part is storing the data, and for this, Windows Azure Mobile Services works really well. I’ve talked about that in previous posts.
The light pollution data is available from a variety of sources but in this case, a high res version with a color that can be made transparent (black) is ideal.
Credit: P. Cinzano, F. Falchi (University of Padova), C. D. Elvidge (NOAA National Geophysical Data Center, Boulder). Copyright Royal Astronomical Society. Reproduced from the Monthly Notices of the RAS by permission of Blackwell Science.
There are two fundamental problems in overlaying the two: first, the image should be sliced into small tiles to make it bandwidth sensitive (the uncompressed TIF file is 200MB). The second is that the image doesn’t exactly line up. It’s close, but there are subtle errors that get introduced despite both maps appearing to be Mercator projections.
There are a number of tools that can help you solve this problem, but in this case, I used MapCruncher. It’s from Microsoft, and it hasn’t been updated since 2007, but … it works.
The idea is that MapCruncher can both transform/skew an image to fit the projection of the map, and carve it up into nice, little tiles. Let’s take the following image:
If I want to overlay this image at a specific point on the map. Let’s say that the two eyes should be where Lake Superior and Lake Huron are. In MapCruncher, we’d bring in the image as an asset, and start defining matching points in the image, like so:
It’s not until we hit the lock button near the bottom left that the image is scaled/skewed/transformed to fit. The closer an image is to being the same scale, the better/few points are required to get it look right. Once you hit the Render button in the bottom left, it will go to town and slice and dice the image up, based on the zoom depth requested. More on that in a second.
In this case, it generated some 92 tiles. When we preview the results, we can see the data is overlaid nicely:
The tiles produced are laid out and named format known as quadkeys. You can read a lot more about it here, but in short, each tile is scaled to fit the appropriate dimensions based on the current zoom level:
The pattern to this approach makes it very easy to know exactly what tile you need, and at what zoom level (detail). Additionally, all of these files can be stored in a flat data structure (like a folder) which makes storage quite simple. The best part is, Bing maps already knows how to build a quad key, so all you have to do is create a tile layer, and specify the quadkey as a parameter by putting it in curly braces, like so:
MapTileLayer pollutionTileLayer = new MapTileLayer();
pollutionTileLayer.TileSource = "myurl.com/{quadley}.png";
But, this isn’t quite ideal. One problem that I ran into is that if there are a large number of quad keys you don’t have (which is the case even in my app), there are a HUGE number of 404’s because the app has no way of knowing there isn’t a tile available for a specific quad key. While the user doesn’t directly see this, it’s a lot of wasted traffic and just not clean. The way to solve that is to roll your own GetTileUri handler.
In my next post, I’ll detail the steps involved in setting that up!
Abstract: Peter Laudati, Brian Hitney and Andrew Duthie are back for part 2 of their series and in today’s episode Andrew shows us how to deploy the OData Service for his Windows 8 app to Windows Azure as well as outlines the advantages and disadvantages to building back-end services via this approach. After watching this video, follow these next steps: Step #1 – Try Windows Azure: No cost. No obligation. 90-Day FREE trial. Step #2 – Download the Tools for Windows 8 App Development Step #3 – Start building your own Apps for Windows 8 Subscribe to our podcast via iTunes or RSS If you're interested in learning more about the products or solutions discussed in this episode, click on any of the below links for free, in-depth information: Register for our Windows Azure Hands-on Lab Online (HOLO) events today! Windows Azure Hands-on Labs Online Blogs: Brian Hitney’s blog Peter Laudati’s blog Andrew Duthie’s Blog Videos: Microsoft DevRadio: How to Get Started with Windows Azure Microsoft DevRadio: (Part 1) What is Windows Azure Web Sites? Microsoft DevRadio: (Part 2) Windows Azure Web Sites Explained Microsoft DevRadio: How to Integrate TFS Projects with Windows Azure Web Sites Virtual Labs: MSDN Virtual Labs: Windows Azure Download MP3 (Audio only) MP4 (iPod, Zune HD) High Quality MP4 (iPad, PC) Mid Quality MP4 (WP7, HTML5) High Quality WMV (PC, Xbox, MCE)
Recently, a colleague of mine, Adam Hoffman, posted a great tip on serializing a generic List<t> to a Windows 8 App’s RoamingSettings. As Adam points out, taking advantage of roaming storage is so easy to do, it’s criminal not to take advantage of it. There are three basic types of data: local, roaming, and temporary. The APIs are all used similarly, and more info on them can be found here.
There are a few things to keep in mind when using roaming data. One is: the data might change after the app is running – perhaps the data hadn’t been synchronized from another machine yet, or the app is concurrently being used elsewhere. You can plug into the DataChanged event handler to be notified when the roaming data for your app changes – and if it does change, decide what you want to do. You might choose to refresh the settings, or allow the user to decide if they’d like to use these new settings.
The biggest thing to be keep in mind, however, is the RoamingStorageQuota. By design, roaming storage was intended to be for preferences or small amounts of data. At present, the quota is set to a paltry 100KB – although that seems unnecessarily small, if you have hundreds of apps taking advantage of this feature, I can see where bandwidth conversation might come into play.
Accessing the RoamingStorageQuota returns a ulong of the current quota in KB:
ulong quota = ApplicationData.Current.RoamingStorageQuota;
Perhaps at some point the 100KB number will be increased. If your app exceeds that number, the data will be persisted locally, however will not roam. This can be a difficult bug to track down, particularly if you’re roaming important data. Also, when running on a developer machine, the RoamingStorageQuota returns 0 – presumably, because the data can’t roam as it’s not a store-based app (yet). I’ve asked some people internally to confirm this, but in short, means you’ll have to anticipate the value coming back – I’m assuming that return value is 100.
Building off of Adam’s example, we could do something like:
private static string SerializeToString(object obj)
{
XmlSerializer serializer = new XmlSerializer(obj.GetType());
using (StringWriter writer = new StringWriter())
{
serializer.Serialize(writer, obj);
return writer.ToString();
}
}
public void Save()
{
ApplicationDataContainer settingsRoaming =
ApplicationData.Current.RoamingSettings;
this.LastModified = DateTime.Now;
string serializedData = SerializeToString(this);
if ((ulong)UnicodeEncoding.Unicode.GetByteCount(serializedData) <=
ApplicationData.Current.RoamingStorageQuota*1024)
{
settingsRoaming.Values["appSettings"] = serializedData;
}
else
{
//handle the situation
}
}
I realized after writing this (and using this logic myself) that it wouldn’t be a good idea: a single setting can be at most 8KB, while a composite value can be up to 64KB in size. A composite setting represents an atomic unit, and can store much more information obviously. They can be used as follows:
// Composite setting
Windows.Storage.ApplicationDataCompositeValue composite =
new Windows.Storage.ApplicationDataCompositeValue();
composite["intVal"] = 1;
composite["strVal"] = "string";
roamingSettings.Values["exampleCompositeSetting"] = composite;
.
Now, I’m making an assumption that the data is stored in Unicode, 2 bytes per character. I could be wrong. Also, I’m uncertain of the actual size of each element in the settings – a DateTime is typically 8 bytes but I’m uncertain if it gets serialized and consumes only 8 bytes of roaming storage.
In addition to all this, roaming data also can contain folders and files. While obviously limited in size, this may be preferred depending on the type of data your app is using.
The bottom line is: be cautious if trying to roam user-generated data instead of predictable application settings, and consider serializing them as a JSON object graph to a file, to conserve space (XML-based serialization is verbose). For other thoughts on this, see another one of my colleague’s posts on the subject: Windows 8 Games and Roaming Data.
Abstract: Peter Laudati and Brian Hitney welcome fellow Developer Evangelist, Andrew Duthie to the show as they kick off their series on how to build back-end services for their Windows 8 apps using Windows Azure. Tune in for part 1 as Andrew gives an overview of the series and introduces some potential techniques you could incorporate as you build your back-end services. After watching this video, follow these next steps: Step #1 – Try Windows Azure: No cost. No obligation. 90-Day FREE trial. Step #2 – Download the Tools for Windows 8 App Development Step #3 – Start building your own Apps for Windows 8 Subscribe to our podcast via iTunes or RSS If you're interested in learning more about the products or solutions discussed in this episode, click on any of the below links for free, in-depth information: Register for our Windows Azure Hands-on Lab Online (HOLO) events today! Windows Azure Hands-on Labs Online Blogs: Brian Hitney’s blog Peter Laudati’s blog Andrew Duthie’s Blog Videos: Microsoft DevRadio: How to Get Started with Windows Azure Microsoft DevRadio: (Part 1) What is Windows Azure Web Sites? Microsoft DevRadio: (Part 2) Windows Azure Web Sites Explained Microsoft DevRadio: How to Integrate TFS Projects with Windows Azure Web Sites Virtual Labs: MSDN Virtual Labs: Windows Azure Download MP3 (Audio only) MP4 (iPod, Zune HD) High Quality MP4 (iPad, PC) Mid Quality MP4 (WP7, HTML5) High Quality WMV (PC, Xbox, MCE)
A lot of apps require internet connectivity to function – like my app, Dark Skies. One thing I overlooked when first releasing Dark Skies was a graceful check for network connectivity. If the app launches and there is no connectivity, it should fail gracefully and notify the user. Ideally, we should also plug into the Network Status Changed event handler, so our app is notified when the internet goes up or down during the app’s session. There are a couple of ways to accomplish this. If you’re checking for internet connectivity occasionally, you can do something like this: public static bool IsNetworkAvailable()
{
try
{
ConnectionProfile profile = NetworkInformation.GetInternetConnectionProfile();
if (profile == null)
{
return false;
}
else
{
var networkAdapterInfo = profile.NetworkAdapter;
if (networkAdapterInfo == null)
{
return false;
}
else
{
return true;
}
}
}
catch (Exception e)
{
#if DEBUG
throw;
#endif
return false;
}
}
.csharpcode, .csharpcode pre
{
font-size: small;
color: black;
font-family: consolas, "Courier New", courier, monospace;
background-color: #ffffff;
/*white-space: pre;*/
}
.csharpcode pre { margin: 0em; }
.csharpcode .rem { color: #008000; }
.csharpcode .kwrd { color: #0000ff; }
.csharpcode .str { color: #006080; }
.csharpcode .op { color: #0000c0; }
.csharpcode .preproc { color: #cc6633; }
.csharpcode .asp { background-color: #ffff00; }
.csharpcode .html { color: #800000; }
.csharpcode .attr { color: #ff0000; }
.csharpcode .alt
{
background-color: #f4f4f4;
width: 100%;
margin: 0em;
}
.csharpcode .lnum { color: #606060; }
If you’re checking for connectivity frequently, you’ll likely want to cache that result in a variable, and simply change the cached status when the network status changes. Wiring up the event is pretty simple:
NetworkInformation.NetworkStatusChanged += NetworkInformation_NetworkStatusChanged;
.csharpcode, .csharpcode pre
{
font-size: small;
color: black;
font-family: consolas, "Courier New", courier, monospace;
background-color: #ffffff;
/*white-space: pre;*/
}
.csharpcode pre { margin: 0em; }
.csharpcode .rem { color: #008000; }
.csharpcode .kwrd { color: #0000ff; }
.csharpcode .str { color: #006080; }
.csharpcode .op { color: #0000c0; }
.csharpcode .preproc { color: #cc6633; }
.csharpcode .asp { background-color: #ffff00; }
.csharpcode .html { color: #800000; }
.csharpcode .attr { color: #ff0000; }
.csharpcode .alt
{
background-color: #f4f4f4;
width: 100%;
margin: 0em;
}
.csharpcode .lnum { color: #606060; }
And then the event handler can do whatever you’d like:
private async void NetworkInformation_NetworkStatusChanged(object sender)
{
// ...
}
.csharpcode, .csharpcode pre
{
font-size: small;
color: black;
font-family: consolas, "Courier New", courier, monospace;
background-color: #ffffff;
/*white-space: pre;*/
}
.csharpcode pre { margin: 0em; }
.csharpcode .rem { color: #008000; }
.csharpcode .kwrd { color: #0000ff; }
.csharpcode .str { color: #006080; }
.csharpcode .op { color: #0000c0; }
.csharpcode .preproc { color: #cc6633; }
.csharpcode .asp { background-color: #ffff00; }
.csharpcode .html { color: #800000; }
.csharpcode .attr { color: #ff0000; }
.csharpcode .alt
{
background-color: #f4f4f4;
width: 100%;
margin: 0em;
}
.csharpcode .lnum { color: #606060; }
When the app loads, we’ll display a notification of some kind that internet connectivity is required:
Because the nature of tablets and internet connectivity, the state of the connection may change frequently. Having a simple way to check for network connectivity and handling changes to the network status is a great way to ensure a smooth user experience!
Oh – it’s also a good idea to check before doing anything that might throw a network-based exception. For example, on app load, I made the mistake of always acquiring a push notification channel:
await PushNotificationChannelManager.CreatePushNotificationChannelForApplicationAsync();
.csharpcode, .csharpcode pre
{
font-size: small;
color: black;
font-family: consolas, "Courier New", courier, monospace;
background-color: #ffffff;
/*white-space: pre;*/
}
.csharpcode pre { margin: 0em; }
.csharpcode .rem { color: #008000; }
.csharpcode .kwrd { color: #0000ff; }
.csharpcode .str { color: #006080; }
.csharpcode .op { color: #0000c0; }
.csharpcode .preproc { color: #cc6633; }
.csharpcode .asp { background-color: #ffff00; }
.csharpcode .html { color: #800000; }
.csharpcode .attr { color: #ff0000; }
.csharpcode .alt
{
background-color: #f4f4f4;
width: 100%;
margin: 0em;
}
.csharpcode .lnum { color: #606060; }
If the network is unavailable, this will throw an exception. So, be sure to check for network connectivity and/or handle exceptions when setting up push notifications:
private async void AcquirePushChannel()
{
try
{
if (IsNetworkAvailable())
{
CurrentChannel =
await PushNotificationChannelManager.
CreatePushNotificationChannelForApplicationAsync();
}
}
catch (Exception ex)
{
#if DEBUG
throw;
#endif
}
}