×
Namespaces

Variants
Actions
Revision as of 04:06, 19 November 2013 by hamishwillee (Talk | contribs)

(diff) ← Older revision | Latest revision (diff) | Newer revision → (diff)

Como usar Cimbalino Windows Phone Toolkit Camera - CameraCaptureService

From Nokia Developer Wiki
Jump to: navigation, search

Este artigo tem como objetivo mostrar como usar Cimbalino Windows Phone Toolkit Camera – CameraCaptureService.

WP Metro Icon Multimedia.png
SignpostIcon XAML 40.png
WP Metro Icon WP8.png
SignpostIcon WP7 70px.png
Article Metadata

Exemplo de código
Código fonte: Exemplo CameraCaptureService(github)

Testado com
SDK: Windows Phone 8.0 SDK, Windows Phone 7.1.1 SDK
Aparelho(s): Nokia Lumia 800, Nokia Lumia 920

Compatibilidade
Platform Security
Capabilities: ID_CAP_ISV_CAMERA

Artigo
Tradução:
Última alteração feita por hamishwillee em 19 Nov 2013


Contents

Introdução

Cimbalino Windows Phone Toolkit é um conjunto de itens uteis e poderosos para ajudar na implementação de aplicações Windows Phone. Projeto base do toolkit contendo serviços para implementação do padrão de MVVM, conversores, classes auxiliares, métodos de extensões;

Cimbalino.Phone.Toolkit.Camera - Projeto do toolkit contendo serviços para implementação do padrão de MVVM que faz uso da câmera.

Note.pngNote: é preciso definir a capacidade ID_CAP_ISV_CAMERA no ficheiro manifest.

Contruindo o exemplo

O código fonte pode ser obtido em Exemplo CameraCaptureService(github).

Os pacotes estão disponíveis em Nuget Package Manager (para ambos os "targets") e podem ser instalados, para mais detalhes consultar: Como instalar os pacotes Cimbalino Windows Phone Toolkit. O exemplo deste artigo usa MVVM Light para ajudar na implementação do padrão MVVM, para mais detalhes consultar:

Registando os serviços

Devemos começar por registar cada serviço no ViewModelLocator, como podemos ver de seguida:

  1.     /// This class contains static references to all the view models in the
  2.     /// application and provides an entry point for the bindings.
  3.     public class ViewModelLocator
  4.     {
  5.         /// Initializes a new instance of the ViewModelLocator class.
  6.         public ViewModelLocator()
  7.         {
  8.             ServiceLocator.SetLocatorProvider(() => SimpleIoc.Default);
  9.  
  10.             if (!SimpleIoc.Default.IsRegistered<ICameraCaptureService>())
  11.             {
  12.                 SimpleIoc.Default.Register<ICameraCaptureService, CameraCaptureService>();
  13.             }
  14.  
  15.             SimpleIoc.Default.Register<MainViewModel>();
  16.         }
  17.  
  18.         public MainViewModel MainViewModel
  19.         {
  20.             get
  21.             {
  22.                 return ServiceLocator.Current.GetInstance<MainViewModel>();
  23.             }
  24.         }
  25.  
  26.         public static void Cleanup()
  27.         {
  28.             // TODO Clear the ViewModels
  29.         }
  30.     }


Implementando a ViewModel

Em seguinda devemos implementar o MainViewModel, como podemos ver de seguida:


  1.     /// This class contains properties that the main View can data bind to.
  2.     public class MainViewModel : ViewModelBase
  3.     {
  4.         /// The camera capture service
  5.         private readonly ICameraCaptureService _cameraCaptureService;
  6.  
  7.         /// The image
  8.         private ImageSource _image;
  9.  
  10.         /// Initializes a new instance of the MainViewModel class.
  11.         public MainViewModel(ICameraCaptureService cameraCaptureService)
  12.         {
  13.             _cameraCaptureService = cameraCaptureService;
  14.             CameraCaptureCommand = new RelayCommand(CameraCapture);
  15.         }
  16.  
  17.         /// Gets the camera capture command.
  18.         public ICommand CameraCaptureCommand { get; private set; }
  19.  
  20.         /// Gets or sets the image.
  21.         public ImageSource Image
  22.         {
  23.             get
  24.             {
  25.                 return _image;
  26.             }
  27.             set
  28.             {
  29.                 Set("Image", ref _image, value);
  30.             }
  31.         }
  32.  
  33.         /// Cameras the capture.
  34.         private void CameraCapture()
  35.         {
  36.             Image = null;
  37.             _cameraCaptureService.Show(CameraCapetureResult);
  38.         }
  39.  
  40.         /// Cameras the capture result.
  41.         private async void CameraCapetureResult(Microsoft.Phone.Tasks.PhotoResult photoResult)
  42.         {
  43.             if(photoResult.ChosenPhoto!=null)
  44.             {
  45.                 var bitmapImage = new BitmapImage();
  46.                 bitmapImage.SetSource(photoResult.ChosenPhoto);
  47.                 Image = bitmapImage;
  48.             }
  49.         }
  50.     }


Implementando a View

A MainPage.xaml será algo do género:

  1. <phone:PhoneApplicationPage
  2.     x:Class="CimbalinoSample.MainPage"
  3.     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  4.     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
  5.     xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
  6.     xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
  7.     xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
  8.     xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
  9.     mc:Ignorable="d"
  10.     FontFamily="{StaticResource PhoneFontFamilyNormal}"
  11.     FontSize="{StaticResource PhoneFontSizeNormal}"
  12.     Foreground="{StaticResource PhoneForegroundBrush}"
  13.     DataContext="{Binding MainViewModel, Source={StaticResource Locator}}"
  14.     SupportedOrientations="Portrait" Orientation="Portrait"
  15.     shell:SystemTray.IsVisible="True">
  16.  
  17.     <!--LayoutRoot is the root grid where all page content is placed-->
  18.     <Grid x:Name="LayoutRoot" Background="Transparent">
  19.         <Grid.RowDefinitions>
  20.             <RowDefinition Height="Auto"/>
  21.             <RowDefinition Height="*"/>
  22.         </Grid.RowDefinitions>
  23.  
  24.         <!--TitlePanel contains the name of the application and page title-->
  25.         <StackPanel x:Name="TitlePanel" Grid.Row="0" Margin="12,17,0,28">
  26.             <TextBlock Text="Cimbalino Sample" Style="{StaticResource PhoneTextTitle2Style}" Margin="12,0"/>
  27.             <TextBlock Text="CameraCaptureService and PhotoCameraService" 
  28.                        TextWrapping="Wrap"
  29.                        Margin="9,-7,0,0" Style="{StaticResource PhoneTextTitle2Style}"/>
  30.         </StackPanel>
  31.  
  32.         <!--ContentPanel - place additional content here-->
  33.         <Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
  34.             <Image Source="{Binding Image}" Stretch="Uniform" Margin="0,242,0,0" />
  35.             <Button Content="Camera Capture" Command="{Binding CameraCaptureCommand}" Height="237" VerticalAlignment="Top"/>
  36.  
  37.         </Grid>
  38.     </Grid>
  39. </phone:PhoneApplicationPage>
This page was last modified on 19 November 2013, at 04:06.
141 page views in the last 30 days.