Camera Overlay Image

Question

change 3

Good news and bad news. The good news is that in the Connection Inspector, by disabling the UIToolbar overlay and connecting the UIImageview, I see theKing , but then - bad news - I do not see the UIToolbar, which I also need. So now the question is, how can the user return to the calling VC when he / she finishes here? How can both the toolbars and the image be part of the overlay, or will the “go back” toolbar be displayed in a non-overlay view or something else? Or how can I make both a toolbar and an image on an OverlayViewController?

change 3

change 2

setupImagePicker in OverlayViewController.m .

 - (void)setupImagePicker:(UIImagePickerControllerSourceType)sourceType { self.imagePickerController.sourceType = sourceType; if (sourceType == UIImagePickerControllerSourceTypeCamera) { // user wants to use the camera interface // self.imagePickerController.showsCameraControls = NO; if ([[self.imagePickerController.cameraOverlayView subviews] count] == 0) { // setup our custom overlay view for the camera // // ensure that our custom view frame fits within the parent frame CGRect overlayViewFrame = self.imagePickerController.cameraOverlayView.frame; CGRect newFrame = CGRectMake(0.0, CGRectGetHeight(overlayViewFrame) - self.view.frame.size.height - 10.0, CGRectGetWidth(overlayViewFrame), self.view.frame.size.height + 10.0); self.view.frame = newFrame; [self.imagePickerController.cameraOverlayView addSubview:self.view]; } } } 

change 2

change 1

This is a link to sample PhotoPicker code .

change 1

change 0

Has anyone tried this on an iPhone instead of an iPad? I don’t have an iPhone, but today I read a book by Matt Neuburg where he says that UIImagePicker works differently on two devices.

change 0

I do not see the image I'm trying to overlay on the camera image in UIImagePicker. No matter how I add the IBOutlet, as a property or not, the image does not appear, but the overlaid toolbar looks great. Why?

OverlayViewController.h with theKing IBOutlet added to Apple code example and then commented out.

 #import <UIKit/UIKit.h> #import <AudioToolbox/AudioServices.h> @protocol OverlayViewControllerDelegate; @interface OverlayViewController : UIViewController <UINavigationControllerDelegate, UIImagePickerControllerDelegate> { // IBOutlet UIImageView* theKing; ******** temporarily commented out id <OverlayViewControllerDelegate> delegate; } @property (nonatomic, assign) id <OverlayViewControllerDelegate> delegate; @property (nonatomic, retain) UIImagePickerController *imagePickerController; - (void)setupImagePicker:(UIImagePickerControllerSourceType)sourceType; @end @protocol OverlayViewControllerDelegate - (void)didTakePicture:(UIImage *)picture; - (void)didFinishWithCamera; @end 

OverlayViewController.m with property for theKing IBOutlet added to Apple sample code.

 #import "OverlayViewController.h" enum { kOneShot, // user wants to take a delayed single shot kRepeatingShot // user wants to take repeating shots }; @interface OverlayViewController ( ) @property (assign) SystemSoundID tickSound; @property (nonatomic, retain) IBOutlet UIImageView* theKing; // added ********* @property (nonatomic, retain) IBOutlet UIBarButtonItem *takePictureButton; @property (nonatomic, retain) IBOutlet UIBarButtonItem *startStopButton; @property (nonatomic, retain) IBOutlet UIBarButtonItem *timedButton; @property (nonatomic, retain) IBOutlet UIBarButtonItem *cancelButton; @property (nonatomic, retain) NSTimer *tickTimer; @property (nonatomic, retain) NSTimer *cameraTimer; 

I do not see theKing image when executing code on iPhone. Below is a view of the element that I added, showing some of the connections made. No errors occur, but I do not see the image, only UIToolbar is added.

Answer 1

Update

I updated it now and tried to reproduce what you did in your question. I have included the full source .h / .m and [e-mail] . Create a new project and paste the source into the files and add [e-mail] . Everything is done programmatically - you do not need to configure anything in the interface builder, except that you embed your view in the navigation controller.

Here is [e-mail] - http://i.imgur.com/0DrM7si.png

ViewController.h

 #import <UIKit/UIKit.h> @interface ViewController : UIViewController <UIImagePickerControllerDelegate, UINavigationControllerDelegate> @end 

ViewController.m

 #import "ViewController.h" @interface ViewController () @end @implementation ViewController - (void)viewDidLoad { [super viewDidLoad]; // assign action to button UIButton *myButton = [UIButton buttonWithType:UIButtonTypeRoundedRect]; myButton.frame = CGRectMake(0, 0, 200, 60); myButton.center = self.view.center; [myButton addTarget:self action:@selector(buttonPress:) forControlEvents:UIControlEventTouchUpInside]; [myButton setTitle:@"Image Picker" forState:UIControlStateNormal]; [self.view addSubview:myButton]; } - (void)buttonPress:(id)sender { if (![UIImagePickerController isSourceTypeAvailable:UIImagePickerControllerSourceTypeCamera]) { // alert the user that the camera can't be accessed UIAlertView *noCameraAlert = [[UIAlertView alloc] initWithTitle:@"No Camera" message:@"Unable to access the camera!" delegate:nil cancelButtonTitle:@"Dismiss" otherButtonTitles:nil, nil]; [noCameraAlert show]; } else { // prepare imagePicker view UIImagePickerController *imagePicker = [[UIImagePickerController alloc] init]; imagePicker.sourceType = UIImagePickerControllerSourceTypeCamera; imagePicker.delegate = self; imagePicker.allowsEditing = NO; imagePicker.showsCameraControls = NO; // create view for overlay CGRect overlayRect = CGRectMake(0, 0, imagePicker.view.frame.size.width, imagePicker.view.frame.size.height); UIView *overlayView = [[UIView alloc] initWithFrame:overlayRect]; // prepare the image to overlay UIImageView *overlayImage = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"theKing"]]; overlayImage.center = overlayView.center; overlayImage.alpha = 0.5; // prepare toolbar for overlay UIToolbar *overlayToolbar = [[UIToolbar alloc] initWithFrame:CGRectMake(0, 600, overlayView.frame.size.width, 40)]; overlayToolbar.center = CGPointMake(overlayView.center.x, overlayView.frame.size.height - 20); overlayToolbar.barStyle = UIBarStyleBlack; UIBarButtonItem *takePictureButton = [[UIBarButtonItem alloc] initWithBarButtonSystemItem:UIBarButtonSystemItemCamera target:self action:@selector(takePictureButtonPressed:)]; UIBarButtonItem *flexibleBarSpace = [[UIBarButtonItem alloc] initWithBarButtonSystemItem:UIBarButtonSystemItemFlexibleSpace target:nil action:nil]; flexibleBarSpace.width = 1000; UIBarButtonItem *startStopButton = [[UIBarButtonItem alloc] initWithTitle:@"Snap" style:UIBarButtonItemStyleBordered target:self action:@selector(startStopButtonPressed:)]; UIBarButtonItem *timedButton = [[UIBarButtonItem alloc]initWithTitle:@"Timed" style:UIBarButtonItemStyleBordered target:self action: @selector(timedButtonPressed:)]; UIBarButtonItem *cancelButton = [[UIBarButtonItem alloc]initWithTitle:@"Cancel" style:UIBarButtonItemStyleBordered target:self action: @selector(cancelButtonPressed:)]; overlayToolbar.items = [NSArray arrayWithObjects:takePictureButton, flexibleBarSpace, startStopButton, timedButton, cancelButton, nil]; [overlayView addSubview:overlayImage]; [overlayView addSubview:overlayToolbar]; // add the image as the overlay [imagePicker setCameraOverlayView:overlayView]; // display imagePicker [self.navigationController presentViewController:imagePicker animated:YES completion:nil]; } } #pragma mark - UIBarButton Selectors - (void)takePictureButtonPressed:(id)sender { NSLog(@"takePictureButtonPressed..."); // TODO: take picture! } - (void)startStopButtonPressed:(id)sender { NSLog(@"startStopButtonPressed..."); // TODO: make this do something } - (void)timedButtonPressed:(id)sender { NSLog(@"timedButtonPressed..."); // TODO: implement timer before calling takePictureButtonPressed } - (void)cancelButtonPressed:(id)sender { NSLog(@"cancelButtonPressed"); [self.navigationController dismissViewControllerAnimated:YES completion:nil]; } #pragma mark - UIImagePickerController Delegate Methods - (void)imagePickerController:(UIImagePickerController *)picker didFinishPickingMediaWithInfo:(NSDictionary *)editingInfo { // determine if the user selected or took a new photo UIImage *selectedImage; if ([editingInfo objectForKey:UIImagePickerControllerOriginalImage]) selectedImage = (UIImage *)[editingInfo objectForKey:UIImagePickerControllerOriginalImage]; else if ([editingInfo objectForKey:UIImagePickerControllerEditedImage]) selectedImage = (UIImage *)[editingInfo objectForKey:UIImagePickerControllerEditedImage]; // TODO: Do something with selectedImage (put it in a UIImageView // dismiss the imagePicker [picker.presentingViewController dismissViewControllerAnimated:YES completion:nil]; } - (void)didReceiveMemoryWarning { [super didReceiveMemoryWarning]; // Dispose of any resources that can be recreated. } @end 

Screenshot

This is what it looks like when I run it.

Does this meet the requirements of your application?

Answer 2

One answer I found is to put an image on a huge button that has a Done: action Done: I need to figure out a way to tell my user to do this, but at least that will reject the image view and end my setup mode. I would really like a cleaner alternative, so please add answers if you have any. Thanks to everyone who considered my question.