Tutorial :Hide/Show iPhone Camera Iris/Shutter animation



Question:

I am not able to Hide the iphone Camera shutter opening animation for my app. I am using UIImagePickerController to access iphone camera and using my own overlay controllers. Is there a way to remove the initial shutter(also known as Iris) animation as the camera starts. Thank You

[EDIT]

For those who wants to know the way to change the camera iris animation.

The below function is called before the camera iris animation starts.

- (void)navigationController:(UINavigationController *)navigationController willShowViewController:(UIViewController *)viewController animated:(BOOL)animated  {      // Here is were I make the camera preview fit the entire screen.       // This might violate the "don't change the view hierarchy"-rule.       // So I am not sure if it is valid for App Store commitment.      // However, the NSLogs are used to      // figure out which subview is the actual Camera Preview which turns out       // to be the PLPreviewView. (uncomment to se the printouts).      // Change it's size to fit the entire screen (and scale it accordingly      // to avoid distorted image        NSLog(@"WillShowViewController called...");        NSLog(@"VC:view:subviews\n %@\n\n", [[viewController view] subviews]);        NSLog(@"VC:view:PLCameraView:subviews\n %@\n\n", [[[[viewController view] subviews] objectAtIndex: 0] subviews]);        NSLog(@"VC:view:PLCameraView:PLPreviewView:subviews\n %@\n\n", [[[[[[viewController view] subviews] objectAtIndex: 0] subviews] objectAtIndex: 0] subviews]);      NSLog(@"VC:view:PLCameraView:PLCropOverLay:subviews\n %@\n\n", [[[[[[viewController view] subviews] objectAtIndex: 0] subviews] objectAtIndex: 1] subviews]);      NSLog(@"VC:view:PLCameraView:UIImageView:subviews\n %@\n\n", [[[[[[viewController view] subviews] objectAtIndex: 0] subviews] objectAtIndex: 2] subviews]);    }  

In the above function you can go through each layer by using the normal NSMuatableArray syntax like objectAtIndex

hope this might help you.

Regards,

Ankur


Solution:1

Using this answer as a starting point, I've finally solved this problem:

NOTE: This is obviously not 3.3.1-compliant.

  1. Listen for the UINavigationControllerDidShowViewControllerNotification on your UIImagePickerController, and the PLCameraViewIrisAnimationDidEndNotification globally.

  2. Traverse the view hierarchy (starting at the main UIWindow) looking for the PLCameraView. Save the index of the view against the main UIWindow, as you'll need it later.

  3. Remove the PLCameraView from its superView. If desired, insert your own view at global index 0.

  4. When the iris animation is finished, remove your view and re-add the PLCameraView at its original index.


Solution:2

Came across a similar: I wanted to have the shutter appear when I take the picture triggered by a button in a self.cameraOverlayView of a UIImagePickerController. Arrived to this page, did some extra research and came to this solution.

Synopsis:

@interface MyController : UIImagePickerController  ...      - (id) init {  ...      self.cameraOverlayView = _my_overlay_;      self.showsCameraControls = NO;  ...  }  ...   - (void) onMyShutterButton {      [self takePicture];           // You want the shutter animation to happen now.          // .. but it does not.  }  

Solution:

// Some constants for the iris view and selector  NSString* kIrisViewClassName = @"PLCameraIrisAnimationView";  SEL kIrisSelector = NSSelectorFromString(@"animateIrisOpen");    @implementation MyController {  ...      UIView* iris_;  }  - (void) viewDidAppear:(BOOL)animated {      [super viewDidAppear:animated];      // Find the iris view in the siblings of your overlay view      for (UIView* view in self.cameraOverlayView.superview.subviews) {          if ([kIrisViewClassName isEqualToString:[[view class] description]]) {              // It will be hidden by 'self.showsCameraControls = NO'.              view.hidden = false;                 // Extra precautions - as this is undocumented.                if ([view respondsToSelector:kIrisSelector]) {                  iris_ = view;              }              break;          }      }  }  - (void) animateIrisOpen {      if (iris_) {          [iris_ performSelector:kIrisSelector];      }  }  ...  - (void) onMyShutterButton {      [self takePicture];       [self animateIrisOpen];   // Voila - the shutter happens  }  


Solution:3

I've messed around with this a bit, but sending various combinations of the view lifecycle methods to the image picker. (viewWillAppear, viewDidAppear, etc.) But I don't remember which ones ended up working.


Solution:4

Sorry for replying getting back so late. I found out the solution for that well I played around with the view hierarchy of the cameraView and added my own layer at the top of everything. The animation took place there and once the shutter was open the top most layer was removed. If someone need any further help with the code please let me know, I will provide with the exact steps and syntax.

-Ankur


Solution:5

joshwa's answer completely hides the entire camera view for the duration of the iris animation. For my purposes, I needed the camera view visible, just without the iris animation. I was able to accomplish this with a little tweaking of his method. As others have noted, this may or may not be allowed on the app store since we're messing with the view hierarchy as well as listening for undocumented notifications.

3 ivars are needed:

UIImagePickerController *imagePickerController;  UIView *plCameraIrisAnimationView;  // view that animates the opening/closing of the iris  UIImageView *cameraIrisImageView;  // static image of the closed iris  

Hide the closed iris image and remove the animation view. I tried simply hiding the animation view as well, but the animation was still visible:

- (void)receivedNavigationControllerDidShowViewControllerNotification:(NSNotification *)notification {      UIView *view = imagePickerController.view;      [plCameraIrisAnimationView release];      plCameraIrisAnimationView = nil;      cameraIrisImageView = nil;      while (view.subviews.count && (view = [view.subviews objectAtIndex:0])) {          if ([[[view class] description] isEqualToString:@"PLCameraView"]) {              for (UIView *subview in view.subviews) {                  if ([subview isKindOfClass:[UIImageView class]]) {                      cameraIrisImageView = (UIImageView *)subview;                  }                  else if ([[[subview class] description] isEqualToString:@"PLCropOverlay"]) {                      for (UIView *subsubview in subview.subviews) {                          if ([[[subsubview class] description] isEqualToString:@"PLCameraIrisAnimationView"]) {                              plCameraIrisAnimationView = [subsubview retain];                          }                      }                  }              }          }      }      cameraIrisImageView.hidden = YES;      [plCameraIrisAnimationView removeFromSuperview];      [[NSNotificationCenter defaultCenter] removeObserver:self name:@"UINavigationControllerDidShowViewControllerNotification" object:nil];      [[NSNotificationCenter defaultCenter] addObserver:self selector:@selector(receivedPLCameraViewIrisAnimationDidEndNotification:) name:@"PLCameraViewIrisAnimationDidEndNotification" object:nil];  }  

When the animation is over, unhide the iris image and re-add the animation view:

- (void)receivedPLCameraViewIrisAnimationDidEndNotification:(NSNotification *)notification {      cameraIrisImageView.hidden = NO;        UIView *view = imagePickerController.view;      while (view.subviews.count && (view = [view.subviews objectAtIndex:0])) {          if ([[[view class] description] isEqualToString:@"PLCameraView"]) {              for (UIView *subview in view.subviews) {                  if ([[[subview class] description] isEqualToString:@"PLCropOverlay"]) {                      [subview insertSubview:plCameraIrisAnimationView atIndex:1];                      [plCameraIrisAnimationView release];                      plCameraIrisAnimationView = nil;                      break;                  }              }          }      }        [[NSNotificationCenter defaultCenter] removeObserver:self name:@"PLCameraViewIrisAnimationDidEndNotification" object:nil];  }  


Solution:6

The below function is called before the camera iris animation starts.

- (void)navigationController:(UINavigationController *)navigationController willShowViewController:(UIViewController *)viewController animated:(BOOL)animated  {      // Here is were I make the camera preview fit the entire screen.       // This might violate the "don't change the view hierarchy"-rule.       // So I am not sure if it is valid for App Store commitment.      // However, the NSLogs are used to      // figure out which subview is the actual Camera Preview which turns out       // to be the PLPreviewView. (uncomment to se the printouts).      // Change it's size to fit the entire screen (and scale it accordingly      // to avoid distorted image        NSLog(@"WillShowViewController called...");        NSLog(@"VC:view:subviews\n %@\n\n", [[viewController view] subviews]);        NSLog(@"VC:view:PLCameraView:subviews\n %@\n\n", [[[[viewController view] subviews] objectAtIndex: 0] subviews]);        NSLog(@"VC:view:PLCameraView:PLPreviewView:subviews\n %@\n\n", [[[[[[viewController view] subviews] objectAtIndex: 0] subviews] objectAtIndex: 0] subviews]);      NSLog(@"VC:view:PLCameraView:PLCropOverLay:subviews\n %@\n\n", [[[[[[viewController view] subviews] objectAtIndex: 0] subviews] objectAtIndex: 1] subviews]);      NSLog(@"VC:view:PLCameraView:UIImageView:subviews\n %@\n\n", [[[[[[viewController view] subviews] objectAtIndex: 0] subviews] objectAtIndex: 2] subviews]);    }  

In the above function you can go through each layer by using the normal NSMuatableArray syntax like objectAtIndex

hope this might help you.

Regards,

Ankur


Solution:7

To expound on Catalin's answer, (which was great btw), I found if you change the method "animateIrisOpen" slightly, the presentation is a fraction better... but noticeable.

- (void) animateIrisOpen {      if (iris_) {          iris_.hidden = NO;          [iris_ performSelector:kIrisSelector];      }  }  

Note:If u also have question or solution just comment us below or mail us on toontricks1994@gmail.com
Previous
Next Post »