Metro Nuggets

Bitesized tidbits for building Modern (Metro) apps.

Coding4Fun Toolkit: Introducing LockScreenPreview

Previously I spoke about the SuperImage control that came into 2.0.6 of the Coding4Fun Toolkit today, well now I want to introduce you to another new control, LockScreenPreview. LockScreenPreview is a control for Windows Phone 8 and Windows Store (not Windows Phone 7), that does exactly what the control name suggests it does, it offers you a preview of what a user’s lock screen will look like.

In Windows Phone 8 and Windows 8, a developer can allow the user to use their app to customise the lock screen on their device, this includes setting the wallpaper image, some notification text and a notification icon. But if you wanted to show the user what that could look like, you were really left to show either a static image Blue Peter style (“here’s one I made earlier”) or they would have to create a similar control themselves.

The control is easy to use, you provide it with either an image, or Content (more later), up to three lines of text, and a notification icon.

Let’s start with a screenshot with the control elements:

Windows Store:WindowsStoreLockScreenPreview

Windows Phone:

As you can see, pretty simple, really.

Content Or Image?

I know some developers like to create their Live Tiles and Lock Screens using xaml and then dumping that out to an image afterwards, so how will that work with this control? Really easily actually, just don’t set an ImageSource for LockScreenImageSource, and set its Content instead. That way if you use a control to generate the image, you can give the user a truly live feel for how their lock screen is going to look.

Please note though, ImageSource trumps Content, if you use both, only the Image will be shown.

My image is in IsolatedStorage

Not a problem, under the hood, what’s used to display the image is actually a SuperImage, which means we get all the benefits of using that control, which includes the IsolatedStorage URI schema support, so knock yourself out with that one.

There’s already a wiki page on the Nokia Developer site that shows how this control could be used to create a Lock Screen settings page, it’s worth checking out’Facebook’_style_lockscreen_settings_page


One response to “Coding4Fun Toolkit: Introducing LockScreenPreview

  1. Pingback: TWC9: TechEd++, VS/TFS 2013, C4F Toolkit 2.0.6, Azure Updates and more - Windows Azure Blog

Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

%d bloggers like this: