Change a button's background image programmatically in cocoa

Question

All of the topics that I have searched are outdated or not complete in Obj-c.

I need to learn how to change a button's background image programmatically, when having the actual button in the InterfaceBuilder. (This sounds odd, but I need it for NSCollectionView as I have many similar button with different background images).

In the interface builder I drag a button onto my view window, what should I do after?

I understand that:

I need to create a NSButton Class
Connect the button from the interface builder to the code
Set the image

I have been struggling with this.

This tutorial is for the Cocoa Touch and it does not explain the connecting of the button, but rather creating the button from scratch programatically. — ShaunArchibald

Luke Luke · Accepted Answer · 2015-05-20T13:51:39

So did you connect the button to an IBOutlet property? If so then all you need to do is use [button setImage:]

If you haven't already done so, make sure the object instance that you want to change the image from is in interface builder, I.e has been dropped in as one of those blue boxes. Then if you set the object's class and have an IBOutlet property in the header file you can just drag the button outlet in the outlets tab (looks like an arrow) to the actual button itself to link the two

Edit: So it appears you're having trouble with the actual connecting part of the button? Chances are your IB file looks a bit like this:

enter image description here

Look for the objects section in the left hand list. These are the actual objects in your code that you can connect your button to. You might see an app delegate object there, which is included in the default IB file generated when you first create a project. If you want to handle the image changing in your app delegate, then simply add this property to your AppDelegate.h file to create an outlet:

@property IBOutlet NSButton *button;

If you go back to interface builder and select the app delegate object, you can see the outlet that you just created under the outlet tab:

enter image description here

Drag the little circle thing to the button to connect it, that should be the easiest bit.

But I'm going to just presume that you want to call it from somewhere else other than your app delegate, and for that we'll need to do some more explaining. If the class you want to call it from is a subclass of NSView and is already in your interface builder, you can just add that line to your view's header file and it will appear under the view's outlet tab.

If you want to call this from another object that isn't a view or such, you'll need to do either two options:

Create the object instance in interface builder. This means that instead of creating in normally with alloc] init]; etc. you'll have to actually drag in an object into interface builder. This can change the structure of your object quite a bit as you'll no longer be able to create it at will, since it will automatically be instantiated whenever you load your .nib file. Also important to note is that your init function will not be called anymore and you'll need to use awakeFromNib instead. If you do choose to go down this route, just drag over an object:

enter image description here

Add your outlet property to the header file:

enter image description here

Set the object's class:

enter image description here

And connect the outlet:

enter image description here

If making objects XIB loaded just isn't your thing, you can always just connect the property outlet to your app delegate/view controller and access it from that instead. Hopefully this clears things up, if this was the problem you were having.

Change a button's background image programmatically in cocoa

3 Answers