04、Quick Start for Windows

创建一个新工程

1、在 VS 上，选择 File > New > Project..

2、在新工程窗口，选择 Visual C# > Windows Store > Blank App(XAML)

3、点击 OK.

向工程中添加类库

在使用 Nokia Imaging SDK 类库中的功能时，首先需要添加相应类库，请参考

Adding libraries to the project.

移除 Any CPU platform 选项

Nokia Imaging SDK 支持 ARM 和 X86 平台，不支持 Any CPU 。在编译引用了 Nokia Imaging SDK

的工程前，你必须移除 Any CPU 选项。

1、在 VS 工具栏，选择 Solution Configuration

2、选择 Configuration Manager...

3、从 Platform 中选择 <Edit...> 然后点击 Any CPU

4、点击 Remove

定义你的 XAML UI

这里定义的 UI 很简单，只有两个 XAML image 控件和两个 按钮。一个 Image 控件显示

原图，另一个显示经过滤镜处理的 Image。另外，一个按钮用来选择图片，另一个保存图片。



实现步骤

用下面的 XAML 替换 MainPage.xaml 中的 Grid：

<Grid Background="Transparent">
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="*"/>
<RowDefinition Height="Auto"/>
</Grid.RowDefinitions>

<Image x:Name="CartoonImage" Stretch="UniformToFill" Grid.RowSpan="3" />
<Image x:Name="OriginalImage" Width="334" Height="200" Stretch="UniformToFill"
Grid.Row="1" HorizontalAlignment="Left" VerticalAlignment="Top" Margin="12,12,0,0" />

<TextBlock Text="Nokia Imaging SDK" Grid.Row="0" Style="{StaticResource TitleTextBlockStyle}" />

<Button Content="Pick an image" Click="PickImage_Click" HorizontalAlignment="Left" Grid.Row="2" />
<Button Content="Save the image" Click="SaveImage_Click" x:Name="SaveButton" HorizontalAlignment="Right"
Grid.Row="2" IsEnabled="False" />

</Grid>

从 Camera Roll 中选择图片



接下来在 MainPage.xaml.cs 中使用 Win RT 库中提供的 FileOpenPicker 选择图片：

private async void PickImage_Click(object sender, RoutedEventArgs e)
{
SaveButton.IsEnabled = false;

var openPicker = new FileOpenPicker
{
SuggestedStartLocation = PickerLocationId.PicturesLibrary,
ViewMode = PickerViewMode.Thumbnail
};

// Filter to include a sample subset of file types.
openPicker.FileTypeFilter.Clear();
openPicker.FileTypeFilter.Add(".bmp");
openPicker.FileTypeFilter.Add(".png");
openPicker.FileTypeFilter.Add(".jpeg");
openPicker.FileTypeFilter.Add(".jpg");

// Open the file picker.
StorageFile file = await openPicker.PickSingleFileAsync();

// file is null if user cancels the file picker.
if (file != null)
{
if (await ApplyFilter(file)) return;

SaveButton.IsEnabled = true;
}
}

private async Task<bool> ApplyFilter(StorageFile file)
{
IRandomAccessStream fileStream = await file.OpenAsync(FileAccessMode.Read);

return false;
}

当用户选择了图片，我们通过 IRandomAccessStream 来打开文件。

使用 FilterEffect 来为图片添加一个 effect

1、添加下面的命名空间，来自 SDK

using Nokia.Graphics.Imaging;
using Windows.UI.Xaml.Media.Imaging;

2、下面的命名空间用来 “选择” 和 “保存” 图片

using Windows.Storage.Streams;
using Windows.Storage.Pickers;
using Windows.Storage;

3、在 MainPage.xaml.cs 中，定义以下成员变量：

public sealed partial class MainPage : Page
{
// FilterEffect instance is used to apply different
// filters to an image.
// Here we will apply Cartoon filter to an image.
private FilterEffect _cartoonEffect;

// The following  WriteableBitmap contains
// The filtered and thumbnail image.
private WriteableBitmap _cartoonImageBitmap;
private WriteableBitmap _thumbnailImageBitmap;

4、然后在构造函数中，初始化这些变量：

public MainPage()
{
InitializeComponent();

Rect bounds = Window.Current.Bounds;

_cartoonImageBitmap = new WriteableBitmap((int)bounds.Width, (int)bounds.Height);
_thumbnailImageBitmap = new WriteableBitmap((int)OriginalImage.Width, (int)OriginalImage.Height);
}

5、当用户选择完图片，我们就为图片添加滤镜。在这里我们添加 Cartoon 滤镜，然后把结果显示到 XAML

上的 Image 控件（CartoonImage）：

private async Task<bool> ApplyFilter(StorageFile file)
{
// Open a stream for the selected file.
IRandomAccessStream fileStream = await file.OpenAsync(FileAccessMode.Read);

try
{
// Show thumbnail of original image.
_thumbnailImageBitmap.SetSource(fileStream);
OriginalImage.Source = _thumbnailImageBitmap;

// Rewind stream to start.
fileStream.Seek(0);

// A cartoon effect is initialized with selected image stream as source.
var imageStream = new RandomAccessStreamImageSource(fileStream);
_cartoonEffect = new FilterEffect(imageStream);

// Add the cartoon filter as the only filter for the effect.
var cartoonFilter = new CartoonFilter();
_cartoonEffect.Filters = new[] {cartoonFilter};

// Render the image to a WriteableBitmap.
var renderer = new WriteableBitmapRenderer(_cartoonEffect, _cartoonImageBitmap);
_cartoonImageBitmap = await renderer.RenderAsync();

// Set the rendered image as source for the cartoon image control.
CartoonImage.Source = _cartoonImageBitmap;
}
catch (Exception exception)
{
var dia = new MessageDialog(exception.Message);
dia.ShowAsync();
return true;
}
return false;
}

添加相应的权限

因为应用程序需要从 Pictures 文件夹读取数据，所以需要添加相应的权限：

1、在 VS 解决方案中，打开package.appxmanifest

2、选择 Capabilities 选项卡，然后选择Pictures Library，如下图：



生成和编码全尺寸 JPEG 图片

使用 FilterEffect 类的对象来输出全尺寸 JPEG 图片是很简单的。原图的每一个像素都会被

处理并且输出 JPEG 格式。

下面的示例演示如何把滤镜处理后的全尺寸图片保存到文件：

private async void SaveImage_Click(object sender, RoutedEventArgs e)
{
SaveButton.IsEnabled = false;

if (_cartoonEffect == null)
{
return;
}

var jpegRenderer = new JpegRenderer(_cartoonEffect);

// Jpeg renderer gives the raw buffer for the filtered image.
IBuffer jpegOutput = await jpegRenderer.RenderAsync();

var picker = new FileSavePicker();
picker.FileTypeChoices.Add("JPG File", new List<string>   { ".jpg" });
picker.SuggestedFileName = string.Format("CartoonImage_{0:G}", DateTime.Now);
StorageFile file = await picker.PickSaveFileAsync();

if (file != null)
{
using (IRandomAccessStream stream = await file.OpenAsync(FileAccessMode.ReadWrite))
{
await stream.WriteAsync(jpegOutput);
await stream.FlushAsync();
}
}

SaveButton.IsEnabled = true;
}

获取完整源码：点击获取

原文链接