views:

103

answers:

1

I have a custom UIButton in my viewcontroller that should have either the image of either a red or blue heart depending on the value of a variable when the viewcontroller is loaded. If the user clicks on the button, it changes the Red/Blue value in the domain model and should also toggle the button image. The button color will load correctly if I call the following code in ViewWillAppear:

if ([self.color isBlue])
     self.colorButton.imageview.image = [UIImage imageNamed:@"blueHeart.png"];
else
     self.colorButton.imageview.image = [UIImage imageNamed:@"redHeart.png"];

But I can't get it to change color when I press the button. When the button is pressed, my toggleColor: action method is called:

- (IBAction)toggleColor:(id)sender
{
    if ([self.color isBlue])
    {
        [self.color makeRed];
        self.colorButton.imageView.image = [UIImage imageNamed:@"redHeart.png"];
    }       

    else 
    {
        [self.color makeBlue];
        self.colorButton.imageView.image = [UIImage imageNamed:@"blueHeart.png"];
    }
}

The values are updated in the color variable as they should be, but the color of the button does not change. (I've verified in the debugger that all the lines of code are executed as they should be.) I've tried using the [button setImage: forState:] and [button setBackgroundImage: forState:] but they do not behave as expected. Could someone please just walk me through the steps for both the ViewWillAppear: (or ViewDidLoad:) method and my toggleColor: method? I'm missing something here.

A: 

This worked for me:

- (void) viewDidLoad {     
    UIButton *button = [UIButton buttonWithType:UIButtonTypeCustom];
    button.frame = CGRectMake(50, 40, 30, 30);
    [button setImage:[UIImage imageNamed:@"red.png"] forState:UIControlStateNormal];
    [button setImage:[UIImage imageNamed:@"blue.png"] forState:UIControlStateSelected];
    [button addTarget:self action:@selector(toggleButtonImages:) forControlEvents:UIControlEventTouchUpInside];     
    [self.view addSubview:button];
}

-(void) toggleButtonImages:(UIButton *)button {
    UIImage *temp = [button imageForState:UIControlStateNormal];
    [button setImage:[button imageForState:UIControlStateSelected] forState:UIControlStateNormal];
    [button setImage:temp forState:UIControlStateSelected];
}
Brad Smith
Thanks Brad, I think that's got it--almost. One slight weirdness remains: when I click on the button and it toggles, for some reason it creates an outline around the image. For instance, when the button is red and I click on it, it changes to blue but leaves a red outline around the edge. It appears that the red image (which is the same size as the blue one) has been slightly enlarged and placed in the background behind the blue one. If I close the view and reopen, it looks fine. Weird. I will play with this, but feel free to share ideas.
Aeonaut
4 things I would check:#1 Make sure the button is type Custom and not RoundedRect.#2 Make sure your PNGs really are the same size and that no scaling is happening. (The pixel size of the images should be equal (or exactly double for iPhone4) to the frame of the button.)#3 You can temporarily set a background-color on the button (button.backgroundColor = [UIColor purpleColor]) to make sure your images are really going edge-to-edge and the box you are seeing is really from one of the image files and not from something else in your view hierarchy.
Brad Smith