7.imaging on windows phone
-
Upload
nguyen-pham -
Category
Technology
-
view
636 -
download
1
Transcript of 7.imaging on windows phone
![Page 1: 7.imaging on windows phone](https://reader034.fdocuments.in/reader034/viewer/2022042814/554f4039b4c905471e8b4cf4/html5/thumbnails/1.jpg)
Nguyen Pham
Nokia Developer Champion
http://phamnguyen.info
Imaging on
Windows Phone
![Page 2: 7.imaging on windows phone](https://reader034.fdocuments.in/reader034/viewer/2022042814/554f4039b4c905471e8b4cf4/html5/thumbnails/2.jpg)
Windows Phone 8 – Imaging on Windows Phone
Microsoft confidential
• Lenses
• Nokia Imaging SDK
• Windows Phone Photo Extensibility
![Page 3: 7.imaging on windows phone](https://reader034.fdocuments.in/reader034/viewer/2022042814/554f4039b4c905471e8b4cf4/html5/thumbnails/3.jpg)
11/5/2013Microsoft confidential3
Lenses
![Page 4: 7.imaging on windows phone](https://reader034.fdocuments.in/reader034/viewer/2022042814/554f4039b4c905471e8b4cf4/html5/thumbnails/4.jpg)
Creating a Lens
• A Lens is a custom camera application which can be
accessed from within the camera application
• An application is flagged as a Lens application by
setting a flag in the manifest and providing icons
that can be used to browse for the Lens when the
camera is in use
• I’ve created a Imagine Cam lens application which I
have registered in this way
![Page 5: 7.imaging on windows phone](https://reader034.fdocuments.in/reader034/viewer/2022042814/554f4039b4c905471e8b4cf4/html5/thumbnails/5.jpg)
Creating a Lens application
• This text must be added to the WMAppManifest.xml file for the application, just after the
<Tokens> section
• There is no GUI for this alteration, you have to edit the XML directly
<Extensions><Extension ExtensionName="Camera_Capture_App"ConsumerID="{5B04B775-356B-4AA0-AAF8-6491FFEA5631}"TaskID="_default" />
</Extensions>
![Page 6: 7.imaging on windows phone](https://reader034.fdocuments.in/reader034/viewer/2022042814/554f4039b4c905471e8b4cf4/html5/thumbnails/6.jpg)
Adding the Lens Icons
• Three Icons are required, one for each Windows Phone screen size
• WVGA 173 × 173 Assets\Lens.Screen-WVGA.png
• 720p 259 × 259 Assets\Lens.Screen-720p.png
• WXGA 277 × 277 Assets\Lens.Screen-WXGA.png
• They are all placed in the Assets folder of the application
• Use a transparent background to match the Windows Phone color scheme
![Page 7: 7.imaging on windows phone](https://reader034.fdocuments.in/reader034/viewer/2022042814/554f4039b4c905471e8b4cf4/html5/thumbnails/7.jpg)
• You can also create an application that has an auto-upload behaviour for pictures that the
user may take
• The upload behaviour is a “resource intensive” background task
• The application must set the extension shown above and display a settings page where the
user can set authentication and upload options
• This is a background process and therefore might not get to run
Creating an Auto-Uploader for photos
<Extensions><Extension ExtensionName="Photos_Auto_Upload"ConsumerID="{5B04B775-356B-4AA0-AAF8-6491FFEA5632}"TaskID="_default" />
</Extensions>
![Page 8: 7.imaging on windows phone](https://reader034.fdocuments.in/reader034/viewer/2022042814/554f4039b4c905471e8b4cf4/html5/thumbnails/8.jpg)
Create Rich Media Editing
11/5/2013Microsoft confidential8
<Extensions><Extension ExtensionName="Photos_Rich_Media_Edit"ConsumerID="{5B04B775-356B-4AA0-AAF8-6491FFEA5632}"TaskID="_default" />
</Extensions>
The navigation URI looks just as you would expect:
/MainPage.xaml?Action=RichMediaEdit&token={2fad1162-7f85-4d6c-bbd6-
aee6f10e501d}
![Page 9: 7.imaging on windows phone](https://reader034.fdocuments.in/reader034/viewer/2022042814/554f4039b4c905471e8b4cf4/html5/thumbnails/9.jpg)
Other Extensions
11/5/2013Microsoft confidential9
<Extensions><Extension ExtensionName="Photos_Extra_Hub"ConsumerID="{5B04B775-356B-4AA0-AAF8-6491FFEA5632}"
TaskID="_default" /><Extension ExtensionName="Photos_Extra_Share"ConsumerID="{5B04B775-356B-4AA0-AAF8-6491FFEA5632}"
TaskID="_default" /><Extension ExtensionName="Photos_Extra_Image_Editor"ConsumerID="{5B04B775-356B-4AA0-AAF8-6491FFEA5632}"
TaskID="_default" /></Extensions>
![Page 10: 7.imaging on windows phone](https://reader034.fdocuments.in/reader034/viewer/2022042814/554f4039b4c905471e8b4cf4/html5/thumbnails/10.jpg)
Override UriMapper
11/5/2013Microsoft confidential10
class UriMapper : UriMapperBase{
public override Uri MapUri(Uri uri){
Uri mappedUri = uri;
string url = uri.ToString();if (url.Contains("ViewfinderLaunch")){
mappedUri = new Uri("/Pages/CamPage.xaml", UriKind.Relative);}else if (url.Contains("RichMediaEdit") || url.Contains("ShareContent") || url.Contains("EditPhotoContent")){
string photoUrl = url.Replace("CamPage", "PhotoPage").Replace("FileId", "token");mappedUri = new Uri(photoUrl, UriKind.Relative);
}
return mappedUri;}
}
Code in contructor of app class:RootFrame.UriMapper = new Helpers.UriMapper();
![Page 11: 7.imaging on windows phone](https://reader034.fdocuments.in/reader034/viewer/2022042814/554f4039b4c905471e8b4cf4/html5/thumbnails/11.jpg)
11/5/2013Microsoft confidential11
![Page 12: 7.imaging on windows phone](https://reader034.fdocuments.in/reader034/viewer/2022042814/554f4039b4c905471e8b4cf4/html5/thumbnails/12.jpg)
11/5/2013Microsoft confidential12
Nokia Imaging
SDK
![Page 13: 7.imaging on windows phone](https://reader034.fdocuments.in/reader034/viewer/2022042814/554f4039b4c905471e8b4cf4/html5/thumbnails/13.jpg)
Nokia Imaging SDK
• Early Beta version, makes some of the technologies that Nokia uses in its own imaging
applications available to developers
• Provides more than 50 pre-made filters and effects that have been specifically developed
for mobile imaging, with speed and memory performance as key drivers
• The SDK is super-fast, meticulous memory and code optimization
• Allows access to any image data without decoding the whole image
• Apply effects to high resolution images, without worrying about memory budget
![Page 14: 7.imaging on windows phone](https://reader034.fdocuments.in/reader034/viewer/2022042814/554f4039b4c905471e8b4cf4/html5/thumbnails/14.jpg)
Easy to use
• Add a filter to your existing project with just a few lines of C#.
• Support to be called from C++ code.
• The filters can be chained to create more effects
![Page 15: 7.imaging on windows phone](https://reader034.fdocuments.in/reader034/viewer/2022042814/554f4039b4c905471e8b4cf4/html5/thumbnails/15.jpg)
List Of Filter and Effect I
![Page 16: 7.imaging on windows phone](https://reader034.fdocuments.in/reader034/viewer/2022042814/554f4039b4c905471e8b4cf4/html5/thumbnails/16.jpg)
List Of Filter and Effect II
![Page 17: 7.imaging on windows phone](https://reader034.fdocuments.in/reader034/viewer/2022042814/554f4039b4c905471e8b4cf4/html5/thumbnails/17.jpg)
List Of Filter and Effect III
![Page 18: 7.imaging on windows phone](https://reader034.fdocuments.in/reader034/viewer/2022042814/554f4039b4c905471e8b4cf4/html5/thumbnails/18.jpg)
Core concepts
• Provided as a Windows Phone Runtime library
• One of the key benefits of this is that developers can call the
methods of the library from C#, Visual Basic, or C++.
Step 1: Include Nokia Imaging SDK Libraries into your Project
Step 2 : Create EditingSession
Step 3 : Create and add filters to EditingSession
Step 4 : Use asynchronous methods RenderToImageAsync or
RenderToJpegAsync to produce the final processed image
![Page 19: 7.imaging on windows phone](https://reader034.fdocuments.in/reader034/viewer/2022042814/554f4039b4c905471e8b4cf4/html5/thumbnails/19.jpg)
The libraries
• Before starting to use the functionality provided by the Nokia Imaging SDK, the SDK
libraries must be added to the project.
• Two ways to add the libraries are proposed:
• Using the Visual Studio NuGet package manager
• Adding references to the project. For detailed instructions
![Page 20: 7.imaging on windows phone](https://reader034.fdocuments.in/reader034/viewer/2022042814/554f4039b4c905471e8b4cf4/html5/thumbnails/20.jpg)
The libraries (Cont.)
![Page 21: 7.imaging on windows phone](https://reader034.fdocuments.in/reader034/viewer/2022042814/554f4039b4c905471e8b4cf4/html5/thumbnails/21.jpg)
Create EditingSession
• Create an Imaging SDK EditingSession using a compressed or uncompressed image:
• From a Stream (from PhotoChooserTask):
EditingSession session = await CreateEditingSessionAsync(stream);
• From a JPEG in a IBuffer:
EditingSession session = new EditingSession(jpegData);
• From a WriteableBitmap:
EditingSession session = new EditingSession(sourceBitmap);
![Page 22: 7.imaging on windows phone](https://reader034.fdocuments.in/reader034/viewer/2022042814/554f4039b4c905471e8b4cf4/html5/thumbnails/22.jpg)
Create and add filters and effects
• Use FilterFactory to create filters and effects
• Use EditingSession methods to add filters and effects:
session.AddFilter(FilterFactory.CreateCartoonFilter(true));
session.AddFilter(FilterFactory.CreateFogFilter());
• You can also use FilterGroup to add several filters and effects in one call
![Page 23: 7.imaging on windows phone](https://reader034.fdocuments.in/reader034/viewer/2022042814/554f4039b4c905471e8b4cf4/html5/thumbnails/23.jpg)
Produce final processed image
• You can render the processed image to:
• A XAML Image control:
await session.RenderToImageAsync(FilteredImage);
• A WriteableBitmap :
await session.RenderToWriteableBitmapAsync(FilteredBitmap);
• An IBuffer :
IBuffer jpegOut = await session.RenderToJpegAsync();
11/5/201323
![Page 24: 7.imaging on windows phone](https://reader034.fdocuments.in/reader034/viewer/2022042814/554f4039b4c905471e8b4cf4/html5/thumbnails/24.jpg)
Editing-session code
using Nokia.Graphics.Imaging;
using (EditingSession editsession = new EditingSession(inputBuffer))
{
// First add an antique effect
editsession.AddFilter( FilterFactory.CreateAntiqueFilter());
// Then rotate the image
editsession.AddFilter( FilterFactory.CreateFreeRotationFilter(35.0f, RotationScaleMode.FitInside));
// Add more filters here if you want... // Finally, execute the filtering and render to a bitmap await
editsession.RenderToBitmapAsync(outputBuffer);
}
![Page 25: 7.imaging on windows phone](https://reader034.fdocuments.in/reader034/viewer/2022042814/554f4039b4c905471e8b4cf4/html5/thumbnails/25.jpg)
License
Contains functionality provided by the Nokia Imaging SDK.
Copyright © 2013 Nokia Corporation
All rights reserved.
11/5/201325
![Page 26: 7.imaging on windows phone](https://reader034.fdocuments.in/reader034/viewer/2022042814/554f4039b4c905471e8b4cf4/html5/thumbnails/26.jpg)
11/5/2013Microsoft confidential26
Demo
![Page 27: 7.imaging on windows phone](https://reader034.fdocuments.in/reader034/viewer/2022042814/554f4039b4c905471e8b4cf4/html5/thumbnails/27.jpg)
Nokia Project sample
Filter Effects Real-time Filter Filter Explorer
![Page 28: 7.imaging on windows phone](https://reader034.fdocuments.in/reader034/viewer/2022042814/554f4039b4c905471e8b4cf4/html5/thumbnails/28.jpg)
11/5/2013Microsoft confidential28
Imagine Cam
Imagine Cam
![Page 29: 7.imaging on windows phone](https://reader034.fdocuments.in/reader034/viewer/2022042814/554f4039b4c905471e8b4cf4/html5/thumbnails/29.jpg)
Imagine Cam
11/5/201329
![Page 30: 7.imaging on windows phone](https://reader034.fdocuments.in/reader034/viewer/2022042814/554f4039b4c905471e8b4cf4/html5/thumbnails/30.jpg)
Resource
• You found an error in the SDK, have suggestions, need help?
• Nokia Imaging discussion board: http://nokia.ly/DiBoImg
• You have developped an app with the SDK?
• We’d love to hear about it. Tell us by sending a mail at
• Documentation and code samples
• Imaging in the Lumia Developer’s Library: http://nokia.ly/WP_lib_img
• Nokia Imaging SDK: http://www.developer.nokia.com/imaging
![Page 31: 7.imaging on windows phone](https://reader034.fdocuments.in/reader034/viewer/2022042814/554f4039b4c905471e8b4cf4/html5/thumbnails/31.jpg)
• Windows Phone 7.5 Training Kit : http://www.microsoft.com/en-
us/download/details.aspx?id=28564
• Windows Phone 8 Training kit: http://www.microsoft.com/en-
us/download/details.aspx?id=35777
![Page 32: 7.imaging on windows phone](https://reader034.fdocuments.in/reader034/viewer/2022042814/554f4039b4c905471e8b4cf4/html5/thumbnails/32.jpg)
The information herein is for informational
purposes only an represents the current view of
Microsoft Corporation as of the date of this
presentation. Because Microsoft must respond
to changing market conditions, it should not be
interpreted to be a commitment on the part of
Microsoft, and Microsoft cannot guarantee the
accuracy of any information provided after the
date of this presentation.
© 2012 Microsoft Corporation.
All rights reserved. Microsoft, Windows, Windows Vista and other product names are or may be registered trademarks and/or trademarks in the U.S. and/or other countries.
MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION
IN THIS PRESENTATION.
http://phamnguyen.info