WORKING WITH
HIGH-RESOLUTION
IMAGES
LUMIA APP LABS #14
Berthier Lemieux
Technology Wizard
Sensor size 1/1.5”
Pixel size 1.1 micron
Optical Image Stabilization
Total sensor : 7712x5360 = 41.3MP
16:9 mode : 7712x43...
• By default, the PhotoCaptureDevice doesn’t
expose the 34 or 38 megapixels resolutions.
• Applications needs to specifica...
ZOOMING
BE NICE TO
YOUR
NEIGHBOURS!
High res images requires special attention
and may break other applications.
Don’t save full r...
The camera application saves
both the full resolution and
an oversampled image
simultaneously.
DUAL CAPTURE IN NOKIA CAMER...
Use the data contained
in the full resolution
image to create the
best 5MP image.
OVERSAMPLING
7136
5360
2592
1936
38.2 MP...
• The high resolution image is saved locally to the application.
• The high resolution image file, the ”original”, will ne...
Download the code from developer.nokia.com
SAMPLE APP: PHOTO INSPECTOR
1. Capture a high resolution image.
2. Save it to your local storage.
3. Do your magic.
4. Scale down the resulting image ...
captureResolution = PhotoCaptureDevice.GetAvailableCaptureResolutions(SENSOR_LOCATION).First();
var deviceName = Microsoft...
using (var store = IsolatedStorageFile.GetUserStoreForApplication())
{
var localPath = @"LocalImages";
if (!store.Director...
STEP 3 : DO YOUR MAGIC
This is easy to do, using the Nokia Imaging SDK.
STEP 4: SCALE DOWN THE RESULTING IMAGE TO 5MP
var library = new Microsoft.Xna.Framework.Media.MediaLibrary())
{
using (var picture = library.SavePictureToCameraRoll(fil...
Register your app as a rich media application (in
WMAppManifest.xml)
When launched, the NavigationContext.QueryString of
y...
protected override void OnNavigatedTo(NavigationEventArgs e)
{ …
var queryString = this.NavigationContext.QueryString;
if ...
• High resolution images are huge in size : Offer a way for users to delete the
images you’re keeping in the local storage...
Your application will capture amazing images on the Nokia Lumia 1020!
If you decide to capture high res images:
• Follow t...
• Imaging in the Lumia Developer’s Library: http://nokia.ly/WP_lib_img
• Photo Inspector example application: http://nokia...
THANK YOU!
NOKIA
IMAGING WIKI
COMPETITION
2013Q3
Write a great tutorial, guide or an article with code which
shows how to use the Nok...
Upcoming SlideShare
Loading in …5
×

LUMIA APP LABS #14: WORKING WITH HIGH-RESOLUTION IMAGES IN WINDOWS PHONE 8

5,896 views

Published on

The ability of the new Nokia Lumia 1020 smartphone to capture stunning high-resolution images opens up new innovation possibilities for app developers. In this webinar, we focus on how to use the Microsoft Windows Phone 8 Camera and Imaging APIs in your apps to manage images captured by the high-resolution camera module in the Nokia Lumia 1020 smartphone. This webinar will presents image-related dos and don’ts for your app designs, along with practical code examples for the capturing and managing of high-resolution images in ways that will provide the best possible user experience.


For detailed documentation on the imaging features in Nokia Lumia smartphones see http://www.developer.nokia.com/Resources/Library/Lumia/#!imaging.html

For more details about developing for Nokia Lumia smartphones visit http://www.developer.nokia.com/windowsphone

Check out details of the other Lumia App Labs, including the future schedule, here: http://www.developer.nokia.com/Develop/Windows_Phone/Learn/

Published in: Technology, Art & Photos
2 Comments
4 Likes
Statistics
Notes
No Downloads
Views
Total views
5,896
On SlideShare
0
From Embeds
0
Number of Embeds
3
Actions
Shares
0
Downloads
274
Comments
2
Likes
4
Embeds 0
No embeds

No notes for slide

LUMIA APP LABS #14: WORKING WITH HIGH-RESOLUTION IMAGES IN WINDOWS PHONE 8

  1. 1. WORKING WITH HIGH-RESOLUTION IMAGES LUMIA APP LABS #14 Berthier Lemieux Technology Wizard
  2. 2. Sensor size 1/1.5” Pixel size 1.1 micron Optical Image Stabilization Total sensor : 7712x5360 = 41.3MP 16:9 mode : 7712x4352 = 33.6 MP 4:3 mode : 7136x5360 = 38.2 MP NOKIA LUMIA 1020 CAMERA SENSOR
  3. 3. • By default, the PhotoCaptureDevice doesn’t expose the 34 or 38 megapixels resolutions. • Applications needs to specifically be aware of that resolution. 5 MP OR HIGH RES? Without any changes, your app will capture 5 MP images and they will look awesome!
  4. 4. ZOOMING
  5. 5. BE NICE TO YOUR NEIGHBOURS! High res images requires special attention and may break other applications. Don’t save full resolution images to the camera roll.
  6. 6. The camera application saves both the full resolution and an oversampled image simultaneously. DUAL CAPTURE IN NOKIA CAMERA PRO
  7. 7. Use the data contained in the full resolution image to create the best 5MP image. OVERSAMPLING 7136 5360 2592 1936 38.2 MP 5 MP Standard 5 MP Oversampled 5 MP
  8. 8. • The high resolution image is saved locally to the application. • The high resolution image file, the ”original”, will never be modified. That file can’t be accessed through the PhotoPickerTask. • An oversampled (5 MP) image is saved to the camera roll. • Whenever they desire, the user can reframe the image; change where and how deep they want to zoom in on the image. A new oversampled (5 MP) image is saved to the camera roll, overwriting the existing one. • It is highly recommended to follow a similar design pattern in your application. DUAL CAPTURE IN NOKIA CAMERA PRO
  9. 9. Download the code from developer.nokia.com SAMPLE APP: PHOTO INSPECTOR
  10. 10. 1. Capture a high resolution image. 2. Save it to your local storage. 3. Do your magic. 4. Scale down the resulting image to 5MP. 5. Save the 5MP image to the camera roll. 6. Implement the Rich Media extension. 7. Keep application local storage clean. STEPS
  11. 11. captureResolution = PhotoCaptureDevice.GetAvailableCaptureResolutions(SENSOR_LOCATION).First(); var deviceName = Microsoft.Phone.Info.DeviceStatus.DeviceName; if (deviceName.Contains("RM-875") || deviceName.Contains("RM-876") || deviceName.Contains("RM-877")) { // We now knows that the application runs on a Lumia 1020 captureResolution = new Windows.Foundation.Size(7712, 4352); // 16:9 ratio //captureResolution = new Windows.Foundation.Size(7136, 5360); // 4:3 ratio } _device = await PhotoCaptureDevice.OpenAsync(SENSOR_LOCATION, captureResolution); STEP 1 : CAPTURE A HIGH RESOLUTION IMAGE
  12. 12. using (var store = IsolatedStorageFile.GetUserStoreForApplication()) { var localPath = @"LocalImages"; if (!store.DirectoryExists(localPath)) { store.CreateDirectory(localPath); } using (var file = store.CreateFile(localPath + @"" + filenameBase + @".jpg")) { using (var localImage = image.AsStream()) { localImage.CopyTo(file); file.Flush(); } } } STEP 2 : SAVE HIGH RES TO LOCAL STORAGE
  13. 13. STEP 3 : DO YOUR MAGIC
  14. 14. This is easy to do, using the Nokia Imaging SDK. STEP 4: SCALE DOWN THE RESULTING IMAGE TO 5MP
  15. 15. var library = new Microsoft.Xna.Framework.Media.MediaLibrary()) { using (var picture = library.SavePictureToCameraRoll(filenameBase, libraryImage)) { savedPath = picture.GetPath(); } } } STEP 5 : SAVE THE 5MP IMAGE TO CAMERA ROLL
  16. 16. Register your app as a rich media application (in WMAppManifest.xml) When launched, the NavigationContext.QueryString of your application will contain the 2 keys: {[Action, RichMediaEdit]} {[token, {9b6bb83d-18db-45d3-9ab1-44b7a80ff2ab}]}] In your OnNavigatedTo, match the photo coming from the media library files with the locally saved photo STEP 6: IMPLEMENT THE RICH MEDIA EXTENSION
  17. 17. protected override void OnNavigatedTo(NavigationEventArgs e) { … var queryString = this.NavigationContext.QueryString; if (queryString.ContainsKey("token")) { using (Microsoft.Xna.Framework.Media.Picture picture = library.GetPictureFromToken(token)) { var localPath = picture.GetPath(); /* ... Some code removed here : Parse the path to retrieve the filename */ using (var store = IsolatedStorageFile.GetUserStoreForApplication()) { if (store.FileExists(localPathCandidate)) { return store.OpenFile(localPathCandidate, FileMode.Open); } } MATCH LOCAL FILE AND MEDIA LIBRARY FILE
  18. 18. • High resolution images are huge in size : Offer a way for users to delete the images you’re keeping in the local storage. • It is a good practice to automatically check if the image has been deleted from the media library. STEP 7 : KEEP APPLICATION LOCAL STORAGE CLEAN
  19. 19. Your application will capture amazing images on the Nokia Lumia 1020! If you decide to capture high res images: • Follow the code sample from the “Photo Inspector”. • Be nice with your other third-party applications: don’t save high resolution images to camera roll. • Use the Nokia Imaging SDK for scaling and cropping operations. SUMMARY
  20. 20. • Imaging in the Lumia Developer’s Library: http://nokia.ly/WP_lib_img • Photo Inspector example application: http://nokia.ly/PhotoInspector • Nokia Imaging SDK: http://www.developer.nokia.com/imaging • Nokia Imaging discussion board: http://nokia.ly/DiBoImg • Lumia 1020 White paper: http://nokia.ly/N1020WhiteP • Windows Phone: Building a Camera App: http://channel9.msdn.com/Events/Build/2013/2-210 • Rich media extensibility for Windows Phone 8: http://msdn.microsoft.com/en- us/library/windowsphone/develop/jj662942(v=vs.105).aspx RESOURCES
  21. 21. THANK YOU!
  22. 22. NOKIA IMAGING WIKI COMPETITION 2013Q3 Write a great tutorial, guide or an article with code which shows how to use the Nokia Imaging SDK or Camera and any other Windows Phone APIs related to imaging in useful, imaginative and innovative ways and/or provide the best feedback on the Nokia Imaging SDK. developer.nokia.com/Community/Wiki/

×