UIButton border and background image

Question

What I Want: A border indicating if a UIButton is selected or not.

Background: I've got some UIButtons using transparent images, not text. These are toggle buttons (i.e. can be on or off).

Problem: The UIButton class gives users no indication of whether a button is selected or not unless you change something else about the button. Since the image doesn't change with the state, I'd need two of every image, one normal, one selected and set one for each state of the button. This is annoying. I thought instead I'd change the background image, but this removes the pretty border on the button, I just get a rectangle of my background image, yuck.

Possible solutions I don't like:

1) Create a background that matches the UIButton border and use that for selected. I don't like this because they wont match perfectly and I'm picky.

2) Create two images for each button, essentially identical but with a different background. This seems like unnecessary work, and since this problem is coming up repeatedly, I want a solution for the future as well.

I hope somebody's figured out a decent solution to this by now. Thanks in advance.

Answer 1

Since UIButton has two image layers, an image and a background image, I think you could accomplish what you want by using just two background images for all your buttons. One image shows a border and the other does not. Swap the backgrounds out when the control state changed.

Answer 2

If you want the the borders only, then you have only one choice of using two images for the two states otherwise if your purpose is to differentiate between two states then you can do it by changing alpha a little bit of the selected button this will give the effect like toggle buttons, you can also disable the selected button and enable it again when the other button is pressed.

Hope this will give you a fair idea.