Xcode set button image from camera

Question

I have 2 questions relating to button images:

1. Setting a button image

2. Changing an image to a circular image

I have an iPhone application that has a UIButton created in Storyboard. Using the Attributes Inspector, I have set the buttons image to be an image that I created and added to the project.

The button will allow users to add a profile picture.

When I click the button, I ask the user to either use the phones camera to take an image or to select an image from camera roll.

This all works and I can access the camera to take a picture as well as camera roll image gallery to select an image.

My question is: 1. How do I set the button image to the user-selected image? In my didFinishPickingMediaWithInfo method I have:

UIImage *image = [info objectForKey:UIImagePickerControllerOriginalImage];

// Set the image of the Button to the selected image
[sender setImage:image forState:UIControlStateNormal];

But I get error "Use of undeclared identifier" - because my button isn't the sender.

How do I set my button image as the image from the camera or camera roll image? If I create the button programatically I can set the image but it seems like a lot of unnecessary work to do if the button is created in Storyboard already? Or do I need to create the button programatically to do this?

2. I try to mask the image to have a rounded appearance in my didFinishPickingMediaWithInfo but I am unable to do so. How do I do this? I can make the image rounded by pacing the code below in my viewDidLoad but it does not work in my didFinishPickingMediaWithInfo

self.image.layer.cornerRadius = self.profileImageView.frame.size.width / 2;
self.image.clipsToBounds = YES;

Answer 1

Here is an example:

#import "MyViewController.h"
#import <QuartzCore/QuartzCore.h>

@interface MyViewController () <UIImagePickerControllerDelegate, UINavigationControllerDelegate>


@property (weak, nonatomic) IBOutlet UIButton *profilePictureButton;

@end

@implementation MyViewController

- (void)viewDidLoad
{
    [super viewDidLoad];
    // Do any additional setup after loading the view.
    // make the button a circle.
    _profilePictureButton.imageView.contentMode = UIViewContentModeScaleAspectFill;
    _profilePictureButton.imageView.layer.cornerRadius = _profilePictureButton.frame.size.width / 2.f;
}

- (IBAction)takePicture:(id)sender
{
    UIImagePickerController *imagePickerController = [UIImagePickerController new];
    imagePickerController.sourceType = UIImagePickerControllerSourceTypePhotoLibrary;
    imagePickerController.delegate = self;
    [self presentViewController:imagePickerController
                       animated:YES
                     completion:nil];
}

#pragma mark - UIImagePickerControllerDelegate

- (void)imagePickerController:(UIImagePickerController *)picker didFinishPickingMediaWithInfo:(NSDictionary *)info
{
    UIImage *image = [info objectForKey:UIImagePickerControllerOriginalImage];

    [_profilePictureButton setImage:image forState:UIControlStateNormal];
    [picker dismissViewControllerAnimated:YES
                               completion:nil];
}

@end

You have to make sure that the button's type is UIButtonTypeCustom or this won't work at all.

Answer 2

Make sure you have an IBOutlet set up for the UIButton as cameraButton, and make sure your UIButton is set to a "Custom" type.

Make your view controller conform to the

@interface ViewController : UIViewController <UIImagePickerControllerDelegate, UINavigationControllerDelegate>

Tie your UIButton's TouchUpInside event to the following IBAction:

-(IBAction)showCameraAction:(id)sender
{
    UIImagePickerController *picker = [[UIImagePickerController alloc] init];
    picker.delegate = self;
    picker.allowsEditing = YES;
    picker.sourceType = UIImagePickerControllerSourceTypeCamera;

    [self presentViewController:picker animated:YES completion:NULL];
}

In your view controller, put the following delegate implementation methods.

- (void)imagePickerController:(UIImagePickerController *)picker didFinishPickingMediaWithInfo:(NSDictionary *)info {

    UIImage *chosenImage = info[UIImagePickerControllerEditedImage];
    [self.cameraButton setImage:chosenImage forState:UIControlStateNormal];

    self.cameraButton.clipsToBounds = YES;
    self.cameraButton.layer.cornerRadius = (self.cameraButton.frame.size.width / 2);//half of the width
    self.cameraButton.layer.borderColor=[UIColor blackColor].CGColor;
    self.cameraButton.layer.borderWidth=1.0f;

    [picker dismissViewControllerAnimated:YES completion:NULL];

}

- (void)imagePickerControllerDidCancel:(UIImagePickerController *)picker {

    [picker dismissViewControllerAnimated:YES completion:NULL];

}

I did all this, and ended up with a button I could tap that would bring up the camera, and after taking a picture, would display a circular mask of the image with a black border around it. Feel free to remove the border by setting borderWidth to 0.