Changing a UIButton's image when it's tapped

Question

I have a UIButton that I am programmatically creating and adding to a UITableViewCell.

I have successfully set it up so that if you tap the button and keep holding it down, it will change to the image that I have set for the "highlighted state", but this is not good enough.

When the user taps the button, I need it to completely change to the new image. If the user taps the button again, I want it to change back to the original image.

I want the image to change every time they tap. Right now it changes if they tap and keep holding it down, but it switches back to the original image as soon as they are done holding it down.

Here is the code that I have so far for my buttons:

UIImage *addFriendButtonImage = [UIImage imageNamed:@"SliderThumb-Normal-G"];

UIImage *addFriendButtonImageHighlighted = [UIImage imageNamed:@"SliderThumb-Normal"];

UIButton *addFriendButton = [[UIButton alloc]init];

addFriendButton.frame = CGRectMake(237, -10, 64, 64);

[addFriendButton setImage:addFriendButtonImage forState:UIControlStateNormal];

[addFriendButton setImage:addFriendButtonImageHighlighted forState:UIControlStateHighlighted];

I also tried setting the state for the new image to "UIControlStateSelected" but all that does it make the original image a little darker. It doesn't even change to the new image, and once again it only shows it's effect if you are holding the button down.

Answer 1

Set the image for both the UIControlStateHighlighted and UIControlStateSelected states:

[addFriendButton setImage:addFriendButtonImage forState:UIControlStateNormal];
[addFriendButton setImage:addFriendButtonImageHighlighted forState:UIControlStateHighlighted];
[addFriendButton setImage:addFriendButtonImageHighlighted forState:UIControlStateSelected];

Then listen for UIControlEventTouchUpInside:

[addFriendButton addTarget:self action:@selector(handleTouchUpInside:) forControlEvents:UIControlEventTouchUpInside];

Then update the selected state:

- (void)handleTouchUpInside:(UIButton *)sender {
    sender.selected = !sender.selected;
}

Answer 2

What you want is to set new image with [addFriendButton setImage:someImage forState:UIControlStateNormal]; every time the user taps on addFriendButton (look for event UIControlEventTouchUpInside).

If you want you can still assign appropriate highlight image on [addFriendButton setImage:someImage_highlighted forState:UIControlStateHighlighted];

Answer 3

You need to create an IBAction method for your button. If you are using a storyboard to design your view controllers go to the respective view controller in the assistant editor (tap on the icon in the upper right corner of the Xcode window), CTRL+drag the a line from the button to the .h file of your view controller's class like this:

Select Action and enter a named for the method like touchUpInsideButton.

Repeat the same steps to create a property for your button. (But select Outlet instead of Action and give your button a name like myButton.) Now you should have these two lines in your .h file:

@property (strong, nonatomic) IBOutlet UIButton *myButton;
- (IBAction)touchUpInsideButton:(id)sender;

Now go to the .m file of your view controller. Search for the newly created action method - (IBAction)touchUpInsideButton:(id)sender and enter the following code to change the button's image when the user taps the button:

- (IBAction)touchUpInsideButton:(id)sender {
    UIImage *myImage = [UIImage imageNamed:@"myImageName"];
    [self.myButton setImage:myImage forState:UIControlStateNormal];
}

(You can put any code inside this method that is executed whenever the user taps the button.) I would recommend this method if you are using a storyboard. If not please refer to @Corey's reply.