iOS Apps: Buttons with Irregular Shapes

During the development of our iPad application, we faced a problem with irregularly shaped buttons. If you are familiar with UIButton then you probably know that UIButton allows you to set button image with arbitrary non-rectangular shape (having transparent background within the rectangular bounds). The problem is that UIButton does not respect transparency when it comes to touches. UIButton will respond to any touches within the rectangular bounds of the button regardless of the button image’s transparent background. This problem is further aggravated if your application interface contains many irregularly shaped buttons that are placed near each other in such a way that their rectangular bounds overlap.

We found a solution for this on CodeProject.com that completely solves the above issue. The solution was written by Ohmu based on the original solution by Jeff LaMarche (see link below). Using the solution is quite simple:

  • Download the code from (http://www.codeproject.com/KB/iPhone/IrregularlyShapedButtons.aspx)
  • Extract the downloaded code files in your project
  • Create a UIButton in the XCode Interface Builder as usual. Set the button type to custom and specify the button image.
  • Replace the class of the button from UIButton to ClickThruButton in the Identity Inspector.

And that’s about it! You can now build and run your application to check the solution.

Links:

http://www.codeproject.com/KB/iPhone/IrregularlyShapedButtons.aspx (Improved version created by Ohmu)

http://iphonedevelopment.blogspot.com/2010/03/irregularly-shaped-uibuttons.html (Original solution created by Jeff LaMarche)

  1. No comments yet.

Leave a reply

 
 
 


− 4 = three