• 發行項

本文章是由機器翻譯。

Windows Phone

在 Windows Phone 8 中程式設計 Nokia 的素描效果

Srikar Doddi

下载代码示例

諾基亞最近發佈了諾基亞成像 SDK Beta 版中，讓 Windows Phone 8 開發人員能夠創建先進成像經驗為諾基亞 Lumia 智慧手機。

諾基亞成像 SDK 包括用於操作圖像捕獲和存儲由 Windows Phone 設備庫。其功能包括解碼和編碼的 JPEG 圖像、 應用濾鏡和效果、 裁剪、 旋轉和調整大小。諾基亞成像 SDK 提供超過 50 預製的濾鏡和效果。你可以不只應用效果如棕褐色、 卡通、 素描，等等，但也適用自動增強、 亮度控制、 色相、 飽和度和更多。SDK 已專門為移動影像技術，以作為關鍵驅動程式的速度和記憶體性能。

在本文中，我將演示素描效果通過稱為紙質照片的應用程式範例的使用。素描效果應用於即時取景器流，並且提供使用者捕獲圖像，並將它們保存到手機的相機膠捲的能力。我開發這個應用程式，使用Visual Studio2012年、 諾基亞成像 SDK 和 Windows Phone 8 SDK。我用諾基亞 Lumia 920 智慧手機來對它進行測試。

諾基亞成像 SDK 基礎知識

諾基亞成像 SDK 創建由諾基亞給你一個強大的影像處理庫的完全存取權限的工具，説明您偉大的成像應用程式快速輕鬆地創建。如所述，此 SDK 旨在提供高性能和低記憶體使用銘記，這是重要的因為微軟和諾基亞正在努力創建下一代設備如諾基亞 Lumia 1020。在諾基亞的成像應用程式中，創意工作室已使用 SDK。SDK 和圖書館備有免費的 (請參閱授權合約在 bit.ly/130tVHJ)，和 SDK 目前支援僅 Windows Phone 8 應用程式。

諾基亞成像 SDK 提供了以下功能：

  • 使用簡單的 API，可用兩個從託管的代碼，以及本機代碼。這意味著作為 Windows Phone 運行時庫提供了 SDK，你可以從 C#、Visual Basic或 c + + 調用庫的方法。API 來與一系列的類和各種成像任務的方法。
  • RAJPEG 技術訪問圖像資料不首先，解碼整個的 JPEG 圖像的情況下，允許速度很快預覽，效果、 裁剪和旋轉的高解析度圖像的應用程式。
  • 50 多個篩選器、 效果和增強功能。一些這些增強功能允許您以程式設計方式調整 RGB 級別、 色相、 飽和度和亮度。您還可以創建自訂效果和濾鏡如果需要。除了這些濾鏡和效果，SDK 還允許為裁剪、 旋轉和調整大小與無限的撤銷功能。
  • 幾個全功能的應用程式範例允許您流覽原始程式碼和發現的 sdk 功能。例子包括一系列的篩選器屬性的即時處理和在照片中的幾個篩選器圖層應用等功能。
  • 快速啟動指南、 示例專案、 API 參考指南與提供的一些創建影像處理應用程式所需的核心概念概述的幾個文檔的豐富文獻。

快速入門

在高級別上，我為以下從諾基亞成像 SDK Api 用於我的應用程式範例：

  • Nokia.Graphics
  • Nokia.Graphics.Imaging
  • Nokia.InteropServices.WindowsRuntime

Nokia.Graphics.Imaging API 包含諾基亞成像 SDK，其中包括所有的圖像篩選器、 圖像效果、 JPEG 編碼器和解碼器的核心功能。Nokia.InteropServices.WindowsRuntime 庫內部使用，所需的庫，需要在您的專案中引用。它包含一個名為 BufferFactory，用於創建實例的 IBuffer 類。可以使用Visual Studio中的 NuGet 包管理器安裝此 SDK。您可以通過搜索 NokiaImagingSDK 找到包。

這個應用程式的物件圖基本上包括三個關鍵類，所示的圖 1。首頁是典型的手機 app 頁面的 XAML 檔和一個 C# 對應的執行的。此主頁類實現應用程式使用者介面，其中包括 MediaElement 顯示相機的取景器與素描效果。首頁類還擁有其他關鍵的兩個類的實例：CameraStreamSource 和 NokiaSketchEffect。CameraStreamSource，源自 MediaStreamSource，提供相機資料，和 NokiaSketchEffect 實現素描效果。CameraStreamSource 是由諾基亞實現的類並提供給開發人員通過該公司的 app 樣品在諾基亞成像 SDK。


圖 1 紙照片專案的類別圖表

物件圖中所示的代碼組織到轉換為圖 2。


圖 2Visual Studio解決方案結構

定義您的使用者介面

此應用程式的使用者介面非常簡單，如中所示圖 3。主頁面顯示的圖像從取景器和帶有應用程式欄中有一個按鈕來捕獲與草繪模式效果的照片。


圖 3 紙質照片 UI

圖 4 演示使用網格元素定義用於顯示取景器與應用的素描效果的容器的主頁面的 XAML 標記。

圖 4 為主營的 XAML 標記頁

<Grid x:Name="LayoutRoot" Background="Transparent">
  <Grid.RowDefinitions>
    <RowDefinition Height="Auto"/>
    <RowDefinition Height="*"/>
  </Grid.RowDefinitions>
  <Grid Grid.Row="1" Margin="8">
    <Grid x:Name="MediaElementContainer" Margin="0"></Grid>
      <StackPanel
        x:Name="TitlePanel"
        Grid.Row="0"
        Margin="12,17,0,28">
        <TextBlock
          Text="{Binding Path=LocalizedResources.ApplicationTitle,
          Source={StaticResource LocalizedStrings}}"
          Style="{StaticResource PhoneTextNormalStyle}"
          Margin="12,0"/>
      </StackPanel>           
    </Grid>
  </Grid>

使用中所示的標記生成的應用程式欄圖 5。 正如您所看到的它定義了一個捕獲按鈕和關於功能表項目。 捕獲按鈕是與處理 click 事件的事件處理常式相關聯。

圖 5 應用程式欄標記

<phone:PhoneApplicationPage.ApplicationBar>
  <shell:ApplicationBar Opacity="0.4">
    <shell:ApplicationBarIconButton x:Name="CaptureButton"
      Text="Capture" IconUri="Assets/capture-button-icon.png"
      Click="CaptureButton_Click" IsEnabled="True" />
    <shell:ApplicationBar.MenuItems>
      <shell:ApplicationBarMenuItem
        Click="OnAboutPageButtonClicked" Text="about" />
    </shell:ApplicationBar.MenuItems>
  </shell:ApplicationBar>
</phone:PhoneApplicationPage.ApplicationBar>

Windows Phone 使用功能驅動的安全模型。 此模型允許使用者選擇在允許某些功能被啟動。 在我的演示應用程式，下面的功能需要為使用者啟用：

  • ID_CAP_ISV_CAMERA：這提供了訪問 （主） 後, 置攝像頭或前置攝像頭。
  • ID_CAP_MEDIALIB_PHOTO：這提供了唯讀訪問到媒體庫中的照片。 它還使應用程式能夠將照片保存在相機膠捲中。 我將演示這種能力在本文稍後將應用素描效果後保存到相機膠捲的一張照片。

硬體要求，在 app 要求後方攝像頭能正常運作。 選擇 ID_REQ_REARCAMERA 選項以防止應用程式在無後置攝像頭的手機上安裝。

將即時素描效果應用到相機的取景器

NokiaSketchEffect 類負責將即時素描效果應用到相機的取景器。 請注意，使用 SketchMode.Gray，在我的應用程式中獲取所需的效果。 Get­CameraStreamSource 類中的 SampleAsync 函數是負責處理攝像機緩衝區使用素描效果，和它提供的媒體元件與緩衝區。 GetSampleAsync 方法使用諾基亞­SketchEffect.GetNewFrameAndApplyEffect 方法來獲取修改的相機緩衝區。 中的代碼圖 6 顯示它如何執行。

圖 6 獲取修改的相機緩衝區

public async Task GetNewFrameAndApplyEffect(IBuffer processedBuffer)
{
  if (captureDevice == null)
  {
    return;
  }
  captureDevice.GetPreviewBufferArgb(cameraBitmap.Pixels);
  Bitmap outputBtm = new Bitmap(
    outputBufferSize,
    ColorMode.Bgra8888,
    (uint)outputBufferSize.Width * 4,
    processedBuffer);
  EditingSession session = 
    new EditingSession(cameraBitmap.AsBitmap());
  session.AddFilter(FilterFactory.CreateSketchFilter(SketchMode.Gray));
  await session.RenderToBitmapAsync(outputBtm);
}

在函數中的 captureDevice 是一個私人的照片變數­CaptureDevice 類在 Windows.Phone.Media.Capture 中找到。 RenderToBitmapAsync 函數提供由諾基亞成像 SDK 支援 EditingSession 的非同步呈現為點陣圖。 EditingSession 是一個重要的類提供的諾基亞成像 SDK 來表示影像處理編輯會話。 EditingSession 物件是此 SDK 的核心。 在典型的工作流程，EditingSession 從圖像創建、 濾鏡或效果添加到此屆會議上，EditingSession 然後呈現為點陣圖或到記憶體緩衝區中，和最後關閉 EditingSession。 中的代碼圖 6 顯示了如何創建一個新的點陣圖與 processedBuffer 參數關聯、 素描效果應用於它和它然後呈現到新的緩衝區。 最後，CreateSketchFilter 方法可生成草繪圖像的外觀。 此函數採用 SketchMode — — 一個枚舉，— — 作為參數傳遞的素描篩選器模式。 可用的兩個模式是灰色用於在灰度素描和草繪中的顏色的顏色。 正如您所看到的我以前在 SketchMode.Gray 圖 6 的代碼。 這使紙質照片應用程式來生成圖像的灰度。

捕獲並將圖片保存為 JPEG 圖像到相機膠捲

到目前為止我展示如何將即時素描效果應用到取景器。 現在我來看看捕獲來自取景器的圖片，然後在設備上保存到相機膠捲。 捕捉功能第一次啟動自動對焦，然後捕獲一張照片。 除了處理從應用程式欄的捕獲功能，您還可以處理由硬體設備觸發器啟動捕獲。

在所示的代碼圖 7 允許捕獲通過觀景窗按鈕。 更具體地說，該函數啟用或禁用硬體快門釋放功能。 CameraButtons 類提供由設備快門按鈕觸發的事件。 這樣一個事件是 ShutterKeyHalfPressed 事件，當硬體快門按鈕是按下並保持大約 800 毫秒時觸發。 另一個事件是 ShutterKeyPressed 事件。 當硬體快門按鈕接收一個完整的新聞時，將發生此事件。 SetCameraButtonsEnabled 函數還處理這些事件處理常式，以説明釋放的記憶體，與相關的相機的去除。

圖 7 啟用捕獲通過觀景窗按鈕

private void SetCameraButtonsEnabled(bool enabled)
{
  if (enabled)
  {
    Microsoft.Devices.CameraButtons.ShutterKeyHalfPressed
      += ShutterKeyHalfPressed;
    Microsoft.Devices.CameraButtons.ShutterKeyPressed
      += ShutterKeyPressed;
  }
  else
  {
    Microsoft.Devices.CameraButtons.ShutterKeyHalfPressed
      -= ShutterKeyHalfPressed;
    Microsoft.Devices.CameraButtons.ShutterKeyPressed
      -= ShutterKeyPressed;
  }
}

現在我來解釋捕獲進程的詳細資訊。 在代碼中所示圖 8，相機物件表示的照片擷取裝置，等待相機。FocusAsync 函數啟動自動對焦和 StartCaptureAsync 方法捕獲的幀。 但是，您可以捕獲幀之前，你需要準備捕獲序列。 調用 PrepareCaptureSequenceAsync 可做到這一點。 此外創建捕獲序列物件用一個框架，您可以看到從觀景窗。CreateCaptureSequence(1)。 值 1 指示您啟動捕獲後，立即將捕獲的幀數。 最後，您還指定相機屬性和照片設置使用 KnownCameraPhotoProperties 方法。 LockedAutoFocusParameters 設置為 None，表明這一重點，曝光和白平衡設置將自動調整之前捕獲。

圖 8 捕獲過程

private async System.Threading.Tasks.Task Capture()
{
  try
  {
    await camera.FocusAsync();
    MemoryStream imageStream = new MemoryStream();
    imageStream.Seek(0, SeekOrigin.Begin);
    CameraCaptureSequence sequence = camera.CreateCaptureSequence(1);
    sequence.Frames[0].CaptureStream = imageStream.AsOutputStream();
    await camera.PrepareCaptureSequenceAsync(sequence);
    await sequence.StartCaptureAsync();
    camera.SetProperty(
      KnownCameraPhotoProperties.LockedAutoFocusParameters,
      AutoFocusParameters.None);
    ...
}

最後，下面的代碼演示如何將捕獲的圖片保存到相機膠捲：

MediaLibrary library = new MediaLibrary();
EditingSession session =
  new EditingSession(imageStream.GetWindowsRuntimeBuffer());
using (session)
{
  session.AddFilter(FilterFactory.CreateSketchFilter(SketchMode.Gray));
  IBuffer data = await session.RenderToJpegAsync();
  library.SavePictureToCameraRoll(FileNamePrefix
    + DateTime.Now.ToString() + ".jpg",
    data.AsStream());
}

MediaLibrary 類提供的 Microsoft.XNA.Framework.Media API，並用於將照片保存到手機的媒體庫。Microsoft.XNA.Framework.Media 命名空間包含類，以枚舉、 播放和查看歌曲、 專輯、 播放清單和圖片。你然後使用諾基亞成像 SDK 中的 EditingSession 類從壓縮的圖像緩衝區創建一個會話，然後在將圖片保存到相機膠捲使用 SavePictureToCameraRoll 函數之前應用的素描效果篩選器。

鏡頭選取器集成

在 Windows Phone 8，您可以創建一個富媒體鏡頭，從內置攝像頭應用程式打開和取景器的經驗引入啟動您的應用程式的權利。為了使鏡頭的經驗，這款應用程式需要註冊 Camera_Capture_App 副檔名。此擴展聲明到 OS 的紙質照片應用程式可以顯示取景器，當它從鏡頭選取器啟動。在 WMAppManifest.xml 檔中指定的副檔名。您需要使用文字編輯器打開此檔：右擊該檔，然後選擇"打開與...|文字編輯器"。在標記元素，裡面的擴展元素之後只是, 鏡頭擴展是用下面的擴展元素指定的：

<Extension ExtensionName="Camera_Capture_App"
  ConsumerID="{5B04B775-356B-4AA0-AAF8-6491FFEA5631}"
  TaskID="_default" />

現在您的應用程式已完成與鏡頭集成，可以將圖片的權利在設備上保存到相機膠捲。中的圖像圖 9 內置攝像頭應用程式和中的圖像採取圖 10 採取紙質照片 app 使用素描效果。


圖 9 定期圖像採取與內置攝像頭應用程式


圖 10 圖像採取使用紙照片應用程式使用素描效果

添加您自己的功能

在本文中，我從微軟和全新諾基亞成像 SDK 來創建豐富的影像經驗探討照片捕獲的 Api。然後我素描效果應用於即時取景器捕獲照片和保存在設備相機膠捲上。正如您所看到的有的功能，您現在可以使用諾基亞成像 SDK，這使它容易地構建應用程式這種由於噸。幾個次要的細節被省去了為簡潔起見，但你可以參考代碼下載 (github.com/Srikar-Doddi/PaperPhoto) 為一個完整的理解。這只是一個例子使用諾基亞成像 SDK 的但有很多的其他功能，您可以添加和的可能性是無限。我希望你作為起始點使用此代碼，將更多的功能添加到此應用程式。

Srikar Doddi 是在卡普蘭測試籌備工程的執行董事您可以在介質上找到他的文字 medium.com/@SrikarDoddi。他也是為 Windows Phone 8 Simplist、 DateTileScheduler 和紙質照片的應用程式和 Windows 8 的代言人和 Dabble 應用程式的建立者。 您可以通過電子郵件在到達 Doddi srikar.doddi@gmail.com。

衷心感谢以下技术专家对本文的审阅：Lance麥卡錫 (諾基亞)
Lance麥卡錫是諾基亞大使和 Telerik XAML 支援專家 (ext-lance.mccarthy@nokia.com)