Windows
Bing my lockscreen
I am very proud to announce my very first Windows 8 application: Bing my lockscreen – which does pretty much what the title says it does. In short: Bing has the greatest images & now you can get use them for your lock screen!
Bing My Lockscreen allows you to select from the eight most recent
Bing images and quickly select which of them to set your lock screen to use.
In addition Bing My Lockscreen allows you to automatically have your lockscreen updated daily with the latest image from Bing - thus ensuring a constant supply of inspiring and interesting new content for you!
You can get the app from the store using the download link below!
This app is also in the Apptivate competition so please go there and vote for it by clicking the image below:
Bing my lockscreen makes use of icons created by the awesome (& free) Metro Studio 2.
Updates
29 September 2012
- Fixed a crash when the app didn't have Internet.
- Fixed the duplicate rate & review buttons.
- Minor tweaks
10 October 2012
- Background updating now works really well - you will also get prompted to turn it on and there is a settings charm to control it.
- Updated the resolution of images to 1366x1024
- Added share support
- Lots of little fixes
18 October 2012
- Image resolution now at 1920x1200!
- Added Live Tile Support
- Notification of new images when launching the app too
- Lots of fixes
31 October 2012
- Fixed: Crashing when setting images - this affected some users based on their country.
- Many internal optimizations and fixes.
Windows Store app Development Snack: Localised Resources & the Store
For more posts in this series, see the series index.
One of my applications had two sets of images, one with English and the other with Russian. While it is great to support both languages I did not want to fully localise the application, such as changing all the labels because I do not have the time & resources to do that. When I setup the project I put the English images in a folder named Comic/en and the Russian images in Comic/ru.
When I built the application I noticed some smart messages in the compiler about finding localised content – which I thought was nice and just ignored it.
(The text there is: MakePRI : warning 0xdef00522: Resources found for language(s) 'en, ru' but no resources found for default language(s): 'en-US'. Change the default language or qualify resources with the default language. http://go.microsoft.com/fwlink/?LinkId=231899)
The problem is that when you upload to the Windows Store that information is used to figure out what markets your application should be localised for, this meant I needed to submit a description for English, US-English & Russian! This would allow me to write the description in different languages but since that is not in my scope it became a hassle.
The “fix” was to prefix the folder with lang (so en became langen) – this tricked the compiler into not seeing this as localised and removed the problem.
Windows Store app Development Snack: InvalidOperationException for Share & Settings
For more posts in this series, see the series index.
With one of my earliest apps I kept having a problem with a COM exception being raised, when trying to setup the Share & Settings event handlers. A key factor is it didn’t happen all the time. I had it the following code on the constructor of my ViewModel class:
this.DTM = Windows.ApplicationModel.DataTransfer.DataTransferManager.GetForCurrentView(); DTM.DataRequested += ShareRequest;
Eventually I figured out that the exception was raised if the event was already attached, but this was in my view model class and this was in the constructor of the class (so should be new and fresh every time) – this didn’t make much sense to me. However the answer was in front of me the entire time: GetForCURRENTVIEW.
Windows 8 apps can be built in one of two ways:
- Page Model – This is the same model as Windows Phone 7 where when you want a new UI you navigate to entire new page, or view.
- Composition Model – In this model you have a single page, and you inject content in the form of user controls into the page. I am working with AtomicMVVM which follows this pattern.
The problem with the composition model, is that the events are tied to the page (or view) & since I never changed the page (just the content was swopped in and out), the event handlers were never being changed.
The solution for me was to make it possible for the view models to state if they have Share or Settings and then have a single place in the constructor to setup the configuration for the charms. I used a simple interface based system for this which the following code should illustrate. Since the event handler was attached once – the exception went away. This also allows my view to be very smart about the share & settings events and what it passes to those.
// during the startup I bind once to the event. Note that I onlt do this once the UI is up.
bootstrapper.AfterStartCompletes += () =>
{
SettingsPane.GetForCurrentView().CommandsRequested += SettingCommandsRequested;
};
void SettingCommandsRequested(SettingsPane sender, SettingsPaneCommandsRequestedEventArgs args)
{
var settings = Bootstrapper.CurrentViewModel as ISettings;
args.Request.ApplicationCommands.Clear();
// if the view model implements the interface then I can call the method to set the commands it needs.
if (settings != null)
{
settings.LoadCommands(args.Request.ApplicationCommands);
}
}
For a complete example of this see the Metro Demo in the AtomicMVVM samples: MetroDemo
Windows Store app Development Snack: Secondary tiles with text
For more posts in this series, see the series index.
The call to pin a secondary tile looks like this:
SecondaryTile(string tileId, string shortName, string displayName, string arguments, TileOptions tileOptions, Uri logoReference);
The important part for this post is the last parameter: Uri logoReference. This is the the path to the image you want to show on the tile – but I had a problem, I didn’t want to show an image! I just had some text I wanted to show on the tile. After a lot of digging the solution was non trivial – generate an image at runtime. This was made even harder as the Render method in WPF does not exist in the XAML implementation used in WinRT.
WinRT does include a WritableBitmap class which allows you to create a in memory bitmap, manipulate the pixels and save to a file format with the BitmapEncoder classes. The problem for me is I do not want to fiddle with pixels manually – this lead me to WritableBitmapEx which is a great library for having primitives (fill, line, circle etc…), the only down side was that I wanted text, not graphic primitives.
More searching lead to two posts on StackOverflow from XXX (post 1, post 2) which provided a solution:
- Create a sprite map using a free tool called SpriteFont201
- Use the code provided in the answers with WritableBitmapEx to extract the sprites and combine them with a WritableBitmap.
I took the code and adjusted it slightly so text would always be centred and allowed me to play with font scaling. I’ve attached the modified code to the post below.
In the end the code I used looks like this:
public async Task<StorageFile> CreateImage()
{
uint width = 512;
uint height = 512;
var writableBitmap = BitmapFactory.New((int)width, (int)height);
writableBitmap.Clear((App.Current.Resources["SecondTileColour"] as SolidColorBrush).Color);
writableBitmap.DrawStringHoriztonallyCentred(this.DisplayPostalCode, 50, "title", Colors.White, 4);
writableBitmap.DrawStringHoriztonallyCentred(this.Town, 175, "title", Colors.White, 2);
writableBitmap.DrawStringHoriztonallyCentred(this.City, 275, "title", Colors.White, 2);
writableBitmap.DrawStringHoriztonallyCentred(string.Format("box code: {0}", this.BoxCode), 375, "title", Colors.White, 2);
writableBitmap.DrawStringHoriztonallyCentred(string.Format("street code: {0}", this.StreetCode), 450, "title", Colors.White, 2);
var file = await Windows.Storage.ApplicationData.Current.LocalFolder.CreateFileAsync(Guid.NewGuid().ToString("N"), Windows.Storage.CreationCollisionOption.ReplaceExisting);
using (var fileStream = await file.OpenAsync(Windows.Storage.FileAccessMode.ReadWrite))
{
var encoder = await BitmapEncoder.CreateAsync(BitmapEncoder.PngEncoderId, fileStream);
encoder.SetPixelData(BitmapPixelFormat.Bgra8, BitmapAlphaMode.Straight, width, height, 96, 96, writableBitmap.ToByteArray());
await encoder.FlushAsync();
}
return file;
}
Windows Store app Development Snack: Being a sharing target while your app is running
For more posts in this series, see the series index.
Being a share target seems like a great idea to get people to use your application more, however it does have a fairly complex problem: if I do a share to my application, while my application is running what happens – does it start a new instance or use the existing instance. You may say this can’t happen since Windows 8 doesn’t allow more than one application to run at a time… but you would be wrong.
Snap view in Windows 8 allows for two Metro style applications to run side by side thus allowing two apps to run at the same time. In fact you can run three apps at a time: one snapped, one filled and then you do a share target which launches a third app!
So back to the question, what happens if you app is say running in snapped view and you do a share from the filled app to your app which is currently snapped? The answer is it uses your existing application but from a separate thread.
To test this I put a simple Boolean field into the constructor of my App class which I set to true, then when the OnShareTargetActivated event was raised I checked the value of that Boolean field, and it was true if the app was running!
You should come up with a solution for this (or at least test it) – in my case the OnShareTargetActivated wrote to the application store and then my main UI which used that would poll for changes. I had to do this rather than triggering the UI because the OnShareTargetActivated was launched in a separate thread and trying to trigger caused a cross thread issue (I did try dispatcher fixes but that lead to a variety of COM issues).
Windows Store app development snack: Why is the store showing the wrong currency?
For more posts in this series, see the series index.
To the right is a screen shot from the Windows 8 Store app on my machine, note the app called Cozy and in particular its price, it is in dollars… and I live in South Africa where we use Rands. :/
The store settings are controlled by the Windows Region settings, so to fix this you need to change the settings, which you can get by search for region:
Once in the region app go to location and change it from United States to South Africa, or where ever you are:
Next time you launch the store (you may need to do a reboot) it will be in the right country! ![]()
Windows Store app Development Snack: A better architecture diagram
For more posts in this series, see the series index.
I have been talking a lot about Windows 8 recently and my slides have been using the architecture images Microsoft releases at Build 2011 & that awesome one Doug Seven created. However I have still found a lot of discussion exists even with those and they are showing their age.
I have tried to create a new one recently that addresses those issue:
- Age: DirectX can be used by VB/C# in addition to C++ now.
- Age: How does Windows Phone 8 fit the picture – note this may change, it is based on my assumptions and half info we have gotten.
- Discussion: Is WinJS = WinRT?
- Discussion: is .NET = WinRT?
- Discussion: Can I use my own JavaScript libraries like jQuery?
- Discussion: Can I use WinJS on the web?
- Discussion: Can I build desktop apps on Windows 8?
- Discussion: Can desktop apps run on Windows 8 ARM CPU's.
- Discussion: How does the language projection fit in?
Clearly this wouldn’t work in a single image – so I have created a slide deck that has a great overview image and also has build up experiences where step-by-step it builds the image with information and hopefully during that answers all the questions.
Where do I start to learn Windows 8?
I have been asked at the talks I do, where can I go to learn Windows 8? What material is available? There is a LOT of content available for Windows 8. For me personally I learnt initially from the Windows 8 Camp in a box and building my own test apps. However the ever amazing Bruce Nicholson provided me with a fantastic list recently (so go thank him):
- Designing Apps with Metro Principles and Windows Personality: http://channel9.msdn.com/Events/TechEd/NorthAmerica/2012/DEV351
- Building Windows 8 Metro style UIs: http://channel9.msdn.com/Events/TechEd/NorthAmerica/2012/DEV354
- Building Metro style Apps with XAML: What .NET Developers Need to Know: http://channel9.msdn.com/Events/TechEd/NorthAmerica/2012/DEV353
- Windows 8 Touch Language: Covered in Build 2011 session “Designing Metro style apps that are touch-optimized” (http://channel9.msdn.com/events/BUILD/BUILD2011/APP-391T) , and MSDN deign guidance document “Touch interaction design (Metro style apps)” (http://msdn.microsoft.com/en-US/library/windows/apps/hh465415)
- Declaring capabilities: Covered in Build 2011 session “How to declare your app’s capabilities” (http://channel9.msdn.com/Events/BUILD/BUILD2011/APP-398T)
- AppBar: Covered in MSDN design guidance document “Commanding design for Metro style apps” (http://msdn.microsoft.com/en-us/library/windows/apps/hh761499.aspx), and
- Search - Covered in Teched 2012 session “Integrating with Windows 8 Experiences” (http://channel9.msdn.com/Events/TechEd/NorthAmerica/2012/DEV356 )
- Live tiles – Covered in Webcast “Bring Your Windows 8 Metro Style Apps to Life with Tiles and Notifications” (http://channel9.msdn.com/Events/Windows-Camp/MSDN-Webcast-Series-Building-Windows-8-Metro-Style-Apps/Bring-Your-Windows-8-Metro-Style-Apps-to-Life-with-Tiles-and-Notifications)
- Async programming in C# 5.0 – Covered in Teched 2012 session “Async Made Simple in Windows 8, with Visual C# and Visual Basic” (http://channel9.msdn.com/Events/TechEd/NorthAmerica/2012/DEV332)
- HTML5/JS discussion – Covered in Teched 2012 sessions “Building Metro style Apps with HTML and JavaScript” (http://channel9.msdn.com/Events/TechEd/NorthAmerica/2012/DEV366)
- “A Lap Around Microsoft Expression Blend for HTML” (http://channel9.msdn.com/Events/TechEd/NorthAmerica/2012/DEV368)
- Networking – MSDN documentation: “Networking (Metro style apps)” (http://msdn.microsoft.com/en-us/library/windows/apps/xaml/hh452751(v=win.10).aspx)
- External data – MSDN article: “Accessing data and files (Metro style apps using C#/VB/C++ and XAML)” (http://msdn.microsoft.com/en-us/library/windows/apps/xaml/hh758319.aspx)
- Settings – MSDN guidance documents “Guidelines for app settings (Metro style apps)” (http://msdn.microsoft.com/en-us/library/windows/apps/hh770544.aspx), and “Managing application data (Metro style apps using C#/VB/C++ and XAML)” (http://msdn.microsoft.com/en-US/library/windows/apps/xaml/Hh465099(v=win.10) )
- Sharing – Content is covered in Teched 2012 session “Integrating with Windows 8 Experiences” (http://channel9.msdn.com/Events/TechEd/NorthAmerica/2012/DEV356)
- PLM – MSDN guidance documents “Launching, resuming, and multitasking (Metro style apps using C#/VB/C++ and XAML)” (http://msdn.microsoft.com/en-us/library/windows/apps/xaml/Hh770837(v=win.10).aspx)
- SDK sample pack: http://code.msdn.microsoft.com/windowsapps/Windows-8-Modern-Style-App-Samples
- Guidance for porting IOS and Web applications
- Design case study: iPad to Metro style app: http://msdn.microsoft.com/en-US/library/windows/apps/hh868262
- Design case study: Website to Metro style app: http://msdn.microsoft.com/en-US/library/windows/apps/hh868264
- Deploying apps in the enterprise without using the Windows Store (how to) http://technet.microsoft.com/en-us/library/hh832040#BKMK_SideLoad
- Printing from a Metro Style app – Build session “Building Metro style apps that print” (http://channel9.msdn.com/events/BUILD/BUILD2011/PLAT-679T)


