This code example shows how to launch the phone application to make a call from your app using PhoneCallService from the Cimbalino Windows Phone Toolkit.

Introduction

The Cimbalino Windows Phone Toolkit delivers a set of useful and powerful MVVM-compatible tools and services to help developers build Silverlight applications for Windows Phone. The Toolkit is divided into projects that deliver various features, ranging from base MVVM services and helpers, through to code for background agents and for accessing the media library, location services and so on. Cimbalino.Phone.Toolkit.PhoneDialer contains MVVM compatible services for phone dialler access.

The Cimbalino Toolkit's "Phone Call" service is an MVVM compatible wrapper around the systemPhoneCallTask, that can be used to start the "Phone app". The kit provides both the IPhoneCallService interface and its implementation PhoneCallService is required to register the service in MVVM Light (note that MVVM and the MVVM Light Toolkit are not "preconditions" to use this service).

Building the example code

The source code for the code example is available here: PhoneCallService Sample (Github).

To build the source code you will also need the MVVM Light Toolkit and the Cimbalino Windows Phone Toolkit. Their packages are available in the Nuget Package Manager.

Note: you must specify the following capabilities in the app manifest: ID_CAP_PHONEDIALER.

Registering the service

Register the service in the ViewModelLocator constructor as shown below:

  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. if (!SimpleIoc.Default.IsRegistered<IPhoneCallService>())
  10. {
  11. SimpleIoc.Default.Register<IPhoneCallService, PhoneCallService>();
  12. }
  13. SimpleIoc.Default.Register<MainViewModel>();
  14. }
  16. /// Gets the main view model.
  17. public MainViewModel MainViewModel
  18. {
  19. get
  20. {
  21. return ServiceLocator.Current.GetInstance<MainViewModel>();
  22. }
  23. }
  25. public static void Cleanup()
  26. {
  27. // TODO Clear the ViewModels
  28. var viewModelLocator = (ViewModelLocator)App.Current.Resources["Locator"];
  29. viewModelLocator.MainViewModel.Cleanup();
  30. }
  31. }
Implementing the ViewModel

Implement the MainViewModel (MainViewModel.cs) as shown below. The highlighted sections show the MainViewModel constructor taking the IPhoneCallService parameter and assign it to a private member. Later on the member is used to call Show() to launch thePhone app.
  1. using System.Windows;
  2. using System.Windows.Input;
  3. using System.Windows.Threading;
  5. using Cimbalino.Phone.Toolkit.Services;
  7. using GalaSoft.MvvmLight.Command;
  8. using GalaSoft.MvvmLight;
  10. /// This class contains properties that the main View can data bind to.
  11. public class MainViewModel : ViewModelBase
  12. {
  13. /// The phone call service
  14. private readonly IPhoneCallService _phoneCallService;
  16. /// The number
  17. private string _number;
  19. /// The name
  20. private string _name;
  22. /// Initializes a new instance of the MainViewModel class.
  23. public MainViewModel(IPhoneCallService phoneCallService)
  24. {
  25. _phoneCallService = phoneCallService;
  26. CallCommand =new RelayCommand(CallTo);
  27. }
  29. /// Gets or sets the number.
  30. public string Number
  31. {
  32. get
  33. {
  34. return _number;
  35. }
  36. set
  37. {
  38. Set("Number", ref _number, value);
  39. }
  40. }
  42. /// Gets or sets the name.
  43. public string Name
  44. {
  45. get
  46. {
  47. return _name;
  48. }
  49. set
  50. {
  51. Set("Name", ref _name, value);
  52. }
  53. }
  55. /// Gets the call command.
  56. public ICommand CallCommand { get; private set; }
  58. /// Calls to.
  59. private void CallTo()
  60. {
  61. _phoneCallService.Show(Number, Name);
  62. }
  63. }
Implementing the View

The rest of the app is "plumbing" to hook up the ViewModels to the View and to send commands from the UI to the invoke the service.

The MainPage.xaml is as shown below.
  1. <phone:PhoneApplicationPage x:Class="CimbalinoSample.MainPage"
  2. xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  3. xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
  4. xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
  5. xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
  6. xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
  7. xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
  8. DataContext="{Binding MainViewModel,
  9. Source={StaticResource Locator}}"
  10. FontFamily="{StaticResource PhoneFontFamilyNormal}"
  11. FontSize="{StaticResource PhoneFontSizeNormal}"
  12. Foreground="{StaticResource PhoneForegroundBrush}"
  13. Orientation="Portrait"
  14. SupportedOrientations="Portrait"
  15. shell:SystemTray.IsVisible="True"
  16. mc:Ignorable="d">
  18. <!-- LayoutRoot is the root grid where all page content is placed -->
  19. <Grid x:Name="LayoutRoot" Background="Transparent">
  20. <Grid.RowDefinitions>
  21. <RowDefinition Height="Auto" />
  22. <RowDefinition Height="*" />
  23. </Grid.RowDefinitions>
  25. <!-- TitlePanel contains the name of the application and page title -->
  26. <StackPanel x:Name="TitlePanel"
  27. Grid.Row="0"
  28. Margin="12,17,0,28">
  29. <TextBlock Margin="12,0"
  30. Style="{StaticResource PhoneTextTitle2Style}"
  31. Text="Cimbalino Sample" />
  32. <TextBlock Margin="9,-7,0,0"
  33. Style="{StaticResource PhoneTextTitle1Style}"
  34. Text="PhoneDailer" />
  35. </StackPanel>
  37. <!-- ContentPanel - place additional content here -->
  38. <Grid x:Name="ContentPanel"
  39. Grid.Row="1"
  40. Margin="12,0,12,0">
  41. <TextBlock TextWrapping="Wrap">
  42. Name:
  43. </TextBlock>
  44. <TextBlock Margin="0,100,0,-100" TextWrapping="Wrap">
  45. Number:
  46. </TextBlock>
  47. <TextBox Text="{Binding Name,Mode=TwoWay}" Margin="-10,20,10,496"/>
  48. <TextBox Text="{Binding Number,Mode=TwoWay}" Margin="-10,122,10,399"/>
  49. <Button Margin="0,219,0,293"
  50. Command="{Binding CallCommand}"
  51. Content="Call" />
  52. </Grid>
  53. </Grid>
  54. </phone:PhoneApplicationPage>