Starting with Nokia Imaging SDK

A couple of days ago, Nokia announced their new Lumia phone, Lumia 1020, that features a powerful 41 MP camera sensor. letting you shoot photos in incredible details, or as they’ve put it, “shoot first, zoom later” (nods to Lytro, I guess). Of course that kind of beast would require some serious needs for editing photos, taken by those lenses (there’s 6 in Lumia 1020 to be exact), and as it just happens, Nokia yesterday also released their Imaging SDK that allows Windows Phone (8) developers to create apps that manipulate pictures by applying various filters, resizing, etc. An SDK, that, if you will, will let you develop your next best-to Instagram app.

What can the Nokia Imaging SDK do?

The main feature of the SDK are 50+ image filters with adjustable settings, that you can apply to any image. The filters are listed here. Besides filters, there are APIs for manipulating images, like resizing, cropping and rotating.

Where do I find It?

Nokia Imaging SDK is freely downloadable from here. The SDK is free to use, but check the license here. You can skip the publisher entry form by clicking the “No thanks” button, but if you’re already a Windows Phone publisher, you can leave your publisher details to increase the chance Nokia spotting your next great app featuring their imaging SDK

Installing the SDK will get you a local version of Nokia’s libraries, as well as a demo / sample project.

Note that you can also totally skip installing the SDK manually and rather pull the required libraries into existing projects through NuGet (always a good option).

How do I start?

If you installed the SDK through the installer, there’s a simple sample project included in the package (look in Program Files (x86)\Nokia\Nokia Imaging SDK\tutorial\TutorialNokiaImagingSDK\ImagingSDKTutorial folder).

If you want more samples, Nokia has got you covered. There are currently 3 more sample projects you can download from their sample projects page:

1. Filter Effects (project download here) lets you apply different filters to photos

2. Filter Explorer (project download here) is quite powerful image editor with extensive effects gallery.

3. Real-Time Filter Demo (project download here) shows how to apply included effects to a real-time camera stream.

Hands-on

I’ve created a new Windows Phone 8 project from scratch, using the installed libraries. There are some manual steps to take when adding references and I trust these will be addressed in the forthcoming releases. You can review these steps for both manual and NuGet install here.

What I wanted to try for this post, was a few simple tasks: take the photo, apply one of the photo filters, crop the image and save it to the library.

And implementing them was quite straightforward.

First, here’s some XAML:

<Grid Background="Transparent"
      Tap="OnChangePhoto">
    <Grid.RowDefinitions>
        <RowDefinition Height="*"/>
        <RowDefinition Height="*"/>
    </Grid.RowDefinitions>
    <Image x:Name="Source" 
           Width="480" 
           Height="400" />
    <Image x:Name="Altered" 
           Width="480" 
           Height="400" 
           Grid.Row="1" />
</Grid>

It’s basically to Images stacked onto the page, each set to explicit size (more on that later). I want the “Source” image to display unaltered, raw captured photo, and “Altered” to display the manipulated image.

The code is simple too. Capture the photo:

var task = new CameraCaptureTask();
task.Completed += OnCapture;
task.Show();

Now we’re get to more exciting stuff. The meat of Nokia’s Imaging SDK lies in the EditingSession class that takes either a Bitmap class as a constructor, or an IBuffer implementation. And because we’re reading from a captured stream, IBuffer seems a closer fit:

Windows.Storage.Streams.IBuffer buffer;
using (var stream = new MemoryStream())
{
    await e.ChosenPhoto.CopyToAsync(stream);
    buffer = stream.GetWindowsRuntimeBuffer();
}

Once we get hold of the buffer, we can start the editing session:

using (var session = new EditingSession(buffer))
{

Except all you do in this session does not necessarily apply to “editing”. For example, there’s a helper method that will set the source of an image in a single statement:

await session.RenderToImageAsync(Source, OutputOption.PreserveAspectRatio);

Just don’t forget to set initial size of the image (see the XAML snippet above). The method will throw an exception if initial size is not set.

Source image is displayed, time for filters!

session.AddFilter(FilterFactory.CreateLomoFilter(.5, .5, LomoVignetting.High, LomoStyle.Neutral));

Every filter is created through Filter Factory and has different options you can set. Filter are also not just fancy artistic manipulations you can add to photo, there are also filters for mirroring, flipping, or rotating, to name a few. This is how you apply a cropping filter that cuts photos edges a bit. First, calculate the cropping rectangle and use it as a parameter:

var width = session.Dimensions.Width;
var height = session.Dimensions.Height;
var rect = new Windows.Foundation.Rect(width * .1, height * .1, width * .8, height * .8);

session.AddFilter(FilterFactory.CreateCropFilter(rect));

Done manipulating, display the “Altered” image:

await session.RenderToImageAsync(Altered, OutputOption.PreserveAspectRatio);

One task left. Save the image as JPEG:

var jpegBuffer = await session.RenderToJpegAsync();
var library = new MediaLibrary();
library.SavePicture("SDKSample.jpg", jpegBuffer.ToArray());

There are other RenderToJpeg method overloads that let you resize the image when writing to the output buffer, or specify the destination image quality.

Sounds fun, should I use it?

Nokia’s Imaging SDK is mostly valuable for its collection of filters, but it also takes the additional complexity away from working with compressed image files so it’s definitely worth looking at it.

And if you come up with a cool idea for an app that could make use of this SDK, don’t forget to enter the Nokia Future Capture competition (closes July 31st 2013).