- User Interface Views and Controls
- Device Capabilities
- Summary
Device Capabilities
iOS devices have various capabilities. On the iPhone, for example, you can do everything from taking pictures and video with the camera to sending email and playing music. Much of the system is made available to integrate in your applications through a variety of built-in controllers.
MFMailComposeViewController
iOS includes built-in support for sending email from within your applications using the MFMailComposeViewController, found in the MonoTouch.MessageUI namespace. Simply check if the device is able to send mail using the CanSendMail property, and if it is true, bring up an MFMailComposeViewController. The controller has properties to add attachments (using the AddAttachmentData method), set the message body, send HTML mail, add CC recipients, and so on. After hydrating the MFMailComposeViewController and presenting its view, you can listen for completion results by subscribing to the Finished event or by overriding the Finished virtual function of MFMailComposeViewControllerDelegate. In the callback, you get back a result object, an error object, and the controller itself via the MFComposeResultEventArgs, which you can use to present the completion status and dismiss the controller. Figure 4.16 shows a simple example of sending a string in the email message's body, using the code from Listing 4.5.
Figure 4.16 Sending email with MFMailComposeViewController
Listing 4.5. MFMailComposeViewController Example
MFMailComposeViewController _mail; ... public override void ViewDidLoad () { base.ViewDidLoad (); mailButton.TouchUpInside += (o, e) => { if (MFMailComposeViewController.CanSendMail) { _mail = new MFMailComposeViewController (); _mail.SetToRecipients (new string[] { "person1@foo.com", "person2@foo.com" }); _mail.SetCcRecipients (new string[] { "person3@foo.com" }); _mail.SetBccRecipients (new string[] { "person4@foo.com" }) _mail.SetMessageBody ("body of the email", false); _mail.SetSubject ("test email"); _mail.Finished += HandleMailFinished; this.PresentModalViewController(_mail, true); } else { var alert = new UIAlertView("Mail Alert", "Mail Not Sent", null, "Mail Demo", null); alert.Show(); } }; } void HandleMailFinished (object sender, MFComposeResultEventArgs e) { if (e.Result == MFMailComposeResult.Sent) { var alert = new UIAlertView("Mail Alert", "Mail Sent", null, "Mail Demo", null); alert.Show(); } e.Controller.DismissModalViewControllerAnimated(true); }
MPMediaPickerController and MPMusicPlayerController
To select and play audio from your iPod library, you can use the MPMediaPickerController and MPMusicPlayerController, respectively. The MPMediaPickerController presents a view of your iPod library using a system view like the iPod application, but from within your application. You can use it to query and select items from your collection.
To determine the items that a user selects, you implement the MPMediaPickerControllerDelegate. This delegate's MediaItemsPicked method receives the items the user selects, as an MPMediaItemCollection. An MPMediaItem encapsulates metadata about the media item. For example, it contains artist and title information, among other things. You can use this to display the item's metadata in your app.
To play music, you can use the MPMusicPlayerController. This controller maintains a queue of items to play. Therefore, to play an item with it, you simply add items to the queue and subsequently call the Play method. The MPMusicPlayerController has a SetQueue method that you can use to pass along the MPMediaItemCollection sent to the MPMediaPickerControllerDelegate. There are also methods to control playback by performing actions such as pausing, stopping, and adjusting volume, making it easy to implement audio player functionality from within your applications.
Let's build a simple music player to demonstrate. After creating a new window-based iPhone application, add a view controller with a view named MusicDemoController and wire it up such that the view loads at startup, as usual. For this example, we'll support opening the iPod library for song selection, playback, stopping and pausing, as well as volume control. Also, we'll include labels to display the song's artist and title. Figure 4.17 shows the application's user interface in IB along with the various connections.
Figure 4.17 MusicDemoController view in Interface Builder
We use a slider for the volume control and add the various buttons to a toolbar, which is available via the UIToolbar class. For the bar button items, we get stock icon support by setting the appropriate identifier in the Attribute Inspector. When the user selects the open button, denoted by the Action identifier (the one furthest to the left in Figure 4.17), we open the MPMediaPickerController. After selecting a song, we close the picker and populate the labels with the artist and title metadata.
At this point, we will have queued up the song in the MPMusicPlayerController, so we can play, pause, and stop it, along with change the volume. Listing 4.6 shows the implementation of the MusicDemoController to make all this happen.
Listing 4.6. MusicDemoController Implementation
public partial class MusicDemoController : UIViewController { // Constructors omitted for brevity ... MPMusicPlayerController _musicPlayer; MPMediaPickerController _mediaController; MediaPickerDelegate _mpDelegate; public override void ViewDidLoad () { base.ViewDidLoad (); _musicPlayer = new MPMusicPlayerController (); _musicPlayer.Volume = volumeSlider.Value; _mediaController = new MPMediaPickerController (MPMediaType.MPMediaTypeMusic); _mediaController.AllowsPickingMultipleItems = false; _mpDelegate = new MediaPickerDelegate (this); _mediaController.Delegate = _mpDelegate; volumeSlider.ValueChanged += delegate { _musicPlayer.Volume = volumeSlider.Value; }; open.Clicked += (o, e) => { this.PresentModalViewController(_mediaController, true); }; play.Clicked += (o, e) => { _musicPlayer.Play (); }; pause.Clicked += (o, e) => { _musicPlayer.Pause (); }; stop.Clicked += (o, e) => { _musicPlayer.Stop (); }; } public class MediaPickerDelegate : MPMediaPickerControllerDelegate { MusicDemoController _viewController; public MediaPickerDelegate ( MusicDemoController viewController) : base() { _viewController = viewController; } public override void MediaItemsPicked (MPMediaPickerController sender, MPMediaItemCollection mediaItemCollection) { _viewController._musicPlayer.SetQueue (mediaItemCollection); _viewController.DismissModalViewControllerAnimated (true); MPMediaItem mediaItem = mediaItemCollection.Items[0]; //See MPMediaItem.h for various string property names //(Search for MPMediaItem.h in Mac Spotlight) string artist = mediaItem.ValueForProperty ("artist").ToString (); string title = mediaItem.ValueForProperty ("title").ToString (); _viewController.artistLabel.Text = artist; _viewController.titleLabel.Text = title; } public override void MediaPickerDidCancel (MPMediaPickerController sender) { _viewController.DismissModalViewControllerAnimated (true); } } }
Address Book
iOS also includes support for interacting with the data you store in your system address book. This is the data you commonly access in the Phone, Contacts, and Mail applications. Much like the interaction you are afforded with iPod data, you have similar access to the address book from within your applications.
The address book is modeled in the ABAddressBook class. Using this class, you can enumerate objects that represent the people in your contact list and their associated data, such as phone numbers and email addresses, as shown here:
ABAddressBook ab = new ABAddressBook (); ABPerson[] people = ab.GetPeople (); foreach (ABPerson person in people) { Console.WriteLine("{0} {1}", person.FirstName, person.LastName); var phones = person.GetPhones (); if (phones.Count > 0) { foreach(var phone in phones) Console.WriteLine (" {0}, {1}", phone.Label, phone.Value); } }
In addition to taking the approach of using ABAddressBook directly, you can use the ABPeoplePickerNavigationController to interact with the address book via the stock user interface. You can either use it simply to select a contact from the address book or navigate to contact details. To handle contact selection, you register for the SelectPerson event. From within your event handler, you can choose to allow navigation to contact details by setting the Continue property of the ABPeoplePickerSelectPersonEventArgs argument that is passed to the event handler. Setting Continue to true causes person selection to navigate to the contact details. The default setting is false, which you would use to simply pick the contact and subsequently dismiss the controller. The event argument also has a Person property, which is an ABPerson. Therefore, you can use the Person property to retrieve additional information, such as phones, as we did earlier. Listing 4.7 shows an example of using the ABPeoplePickerNavigationController to select a contact and add some of the person's information to a view, as well as dialing the contact's number.
Listing 4.7. Using ABPeoplePickerNavigationController
... ABPeoplePickerNavigationController _peoplePicker; ABPerson _person; string _phoneNumber; public override void ViewDidLoad () { base.ViewDidLoad (); _peoplePicker = new ABPeoplePickerNavigationController (); showPeoplePicker.TouchUpInside += delegate { this.PresentModalViewController (_peoplePicker, true); }; _peoplePicker.Cancelled += delegate { this.DismissModalViewControllerAnimated (true); }; _peoplePicker.SelectPerson += delegate(object sender, ABPeoplePickerSelectPersonEventArgs e) { // Setting Continue to true would allow navigation to the // contact's details, in which case you wouldn't dismiss the // controller below. // //e.Continue = true; _person = e.Person; nameLabel.Text = String.Format ("{0} {1}", _person.FirstName, _person.LastName); var phones = _person.GetPhones (); if (phones.Count > 0) { //just using the first phone for demo _phoneNumber = phones[0].Value; phoneLabel.Text = _phoneNumber; } else { _phoneNumber = String.Empty; } this.DismissModalViewControllerAnimated (true); }; callPerson.TouchUpInside += delegate { if (!String.IsNullOrEmpty (_phoneNumber)) { NSUrl phoneUrl = new NSUrl (String.Format ("tel:{0}", EscapePhoneNumber (_phoneNumber))); if (UIApplication.SharedApplication.CanOpenUrl (phoneUrl)) UIApplication.SharedApplication.OpenUrl (phoneUrl); } }; } string EscapePhoneNumber (string phoneNum) { return phoneNum.Replace (" ", "-").Replace ("(", "") .Replace (")", ""); }
Here, we create a new ABPeoplePickerNavigation controller and display its view modally in response to the TouchUpInsideEvent of a UIButton named showPeoplePicker. When the user selects a person, we handle the selection in the SelectPerson event handler, populating labels with the person's name and the first phone number from the address book, after which we dismiss the controller. When the user touches another button named callPerson, we create an NSUrl using the system URL scheme for a phone number. Passing an NSUrl with this scheme to the OpenUrl method causes the phone application to launch and dial the number.
UIImagePickerController
The UIImagePickerController supports selecting images and videos from files stored on the device's photo library and albums, as well as capturing images and videos directly from the camera (for devices capable of image or video capture). The controller's view adapts to a stock user interface for library selection or camera interaction based on which scenario you ask for and which media types are available on the device. Subsequent callbacks are sent to the UIImagePickerControllerDelegate, where you can use the image or video in your application.
The process of selecting or capturing images and videos is similar when using the UIImagePickerController. You simply create the controller and set the source and media types. The source type distinguishes between selecting media from the device and capturing it with the camera. The media type determines whether you are selecting or capturing images, video, or both. When you are selecting media from the device photo library, the media types you set will cause the content list to filter images and videos appropriately. Likewise, when you are capturing from the camera, the media types will direct the camera view into video or photo capture mode, or present a toggle button to switch between them if you set both image and video media types.
Let's look at an example. Here we will open an action sheet to allow the user to choose between either selecting media from the library or capturing it with the camera. Upon selection or capture of a photo, we will close the UIImagePickerController and show the resulting image in a UIImageView. For video, we'll display a preview image of the first frame and provide a button to launch video playback using an MPMediaPlayerController. Figure 4.18 shows the setup in IB, with the implementation in Listing 4.8.
Figure 4.18 CameraDemoController in Interface Builder
Listing 4.8. Using a UIImagePickerController for Photos or Video
public partial class CameraDemoController : UIViewController { UIImagePickerController _picker; PickerDelegate _pickerDel; UIActionSheet _actionSheet; MPMoviePlayerController _mp; // constructors ... public override void ViewDidLoad () { base.ViewDidLoad (); _picker = new UIImagePickerController (); _pickerDel = new PickerDelegate (this); _picker.Delegate = _pickerDel; _actionSheet = new UIActionSheet (); _actionSheet.AddButton ("Library"); _actionSheet.AddButton ("Camera"); _actionSheet.AddButton ("Cancel"); _actionSheet.CancelButtonIndex = 2; _actionSheet.Delegate = new ActionSheetDelegate (this); showPicker.TouchUpInside += delegate { _actionSheet.ShowInView (this.View); }; playMovie.Hidden = true; playMovie.TouchUpInside += delegate { if (_mp != null) { View.AddSubview (_mp.View); _mp.SetFullscreen (true, true); _mp.Play (); } }; } class ActionSheetDelegate : UIActionSheetDelegate { CameraDemoController _controller; public ActionSheetDelegate (CameraDemoController controller) { _controller = controller; } void ShowPicker (UIImagePickerControllerSourceType sourceType) { if (!UIImagePickerController .IsSourceTypeAvailable (sourceType)) { var alert = new UIAlertView ("Image Picker", "Source type not available", null, "Close"); alert.Show (); } else { _controller._picker.SourceType = sourceType; string[] availableMediaTypes = UIImagePickerController .AvailableMediaTypes (sourceType); string[] requestedMediaTypes = new string[] { "public.image", "public.movie" }; List<string> mediaTypes = new List<string> (); foreach (string mediaType in requestedMediaTypes) { if (availableMediaTypes.Contains (mediaType)) mediaTypes.Add (mediaType); } _controller._picker.MediaTypes = mediaTypes.ToArray (); _controller.PresentModalViewController (_controller._picker, true); } } public override void Clicked (UIActionSheet actionSheet, int buttonIndex) { switch (buttonIndex) { case 0: ShowPicker (UIImagePickerControllerSourceType .PhotoLibrary); break; case 1: ShowPicker (UIImagePickerControllerSourceType .Camera); break; } actionSheet.DismissWithClickedButtonIndex (buttonIndex, true); } } class PickerDelegate : UIImagePickerControllerDelegate { CameraDemoController _controller; public PickerDelegate (CameraDemoController controller) { _controller = controller; } public override void FinishedPickingMedia (UIImagePickerController picker, NSDictionary info) { picker.DismissModalViewControllerAnimated (true); string mediaType = info[new NSString ("UIImagePickerControllerMediaType")].ToString (); UIImage img = null; if (mediaType == "public.image") { img = (UIImage)info[new NSString ("UIImagePickerControllerOriginalImage")]; _controller.playMovie.Hidden = true; } else if (mediaType == "public.movie") { NSUrl videoUrl = (NSUrl)info[new NSString ("UIImagePickerControllerMediaURL")]; _controller._mp = new MPMoviePlayerController (videoUrl); img = _controller._mp.ThumbnailImageAt (0, MPMovieTimeOption.NearestKeyFrame); _controller.playMovie.Hidden = false; } if (img != null) _controller.imageView.Image = img; } } }
For the action sheet, we add buttons to either choose the library or camera, or to cancel, handling the selection in the action sheet's delegate. Because capabilities vary between devices, you need to check that a particular source type is available using UIImagePickerController's IsSourceTypeAvailable method. Once you know a source type is available, you can pass in available media types by setting them in a string array assigned to the UIImagePickerController's MediaTypes property. Once this is done, with the UIImagePickerController's delegate having been previously assigned, you can present the UIImagePickerController.
The view displayed by the UIImagePickerController varies based on the aforementioned settings. Once you select or capture a video or image, the resulting media can be harvested in the UIImagePickerControllerDelegate's FinishedPickingMedia method. The media type is available in the NSDictionary that is passed into this method via the UIImagePickerControllerMediaType key. You can use this to run the appropriate code for either image or video post-processing.
Here, we simply display an image in an ImageView or, for video, display a preview image. Notice the preview image can be extracted from the video using the ThumbnailImageAt method of an MPMoviePlayerController, which we can also use to play the video after it is selected.