In the last episode of the WP7 Minute on The Sociable Geek we showed you how an application can be integrated into the Pictures Hub or the camera using the ‘extras’ menu. If you want to see the video, then you can check it out on TheSociableGeek.com here.
In this post we are going to show you the code that allows you to do this.
Since “WHAT” you do with the picture in your application is up to you (i.e.. enhance color, cropping a photo, turning Black and white), we are going to focus on the integration to the ‘extras’ menu only.
The first thing you need to do is add an XML file to your project. Right click on your project and select Add> New Item.
Select XML File from the menu and name it Extras.xml
Add the following XML to Extras.xml file and save it. Make sure you spell it correctly.
When WP7 Detects this XML file in you project, it will add your application to the ‘extras’ menu.
This is where it gets specific to your application. In this sample, we are just showing you how to retrieve the picture that was passed (either from the camera or the pictures hub), and consume it so you can make your changes to it.
On the first page that opens in your application (usually MainPage.xaml.cs) the following using statements to the top of the page.
NOTE: You will have to add a reference to Microsoft.XNA to your project if you do not already have one.
Next, add an OnNavigated override method to your page right below the constructor (this will run BEFORE your constructor)
protected override void OnNavigatedTo(NavigationEventArgs e)
//Get a dictionary of query string keys and values
IDictionary<string, string> queryStrings = this.NavigationContext.QueryString;
//Ensure at least one querysting
MediaLibrary library = new MediaLibrary();
Picture picture = library.GetPictureFromToken(queryStrings["token"]);
BitmapImage bitmap = new BitmapImage();
WriteableBitmap picLibaryImage = new WriteableBitmap(bitmap);
retrievePic.Source = picLibaryImage;
This section allows you to grab the image that comes in once the use selects your application on the image menu. The retrievePic variable references an image control that is placed on this page in XAML.
<Image HorizontalAlignment="Left" Margin="6,18,0,0" Name="retrievePic" Stretch="Uniform" VerticalAlignment="Top" Width="480"/>
What you do with the picture from here is up to you. Color it, Crop it, turn it black and white… whatever you want.
In the next post, we will show you how to save something to the image library from your application.
Happy Coding – Daniel Egan - DotNetDoc