object005

Vertically expanding buttons

Sunday,February 13,2011

I recently encountered a problem where I needed to programmatically change the iPhone’s button control to fit some long text.  It needed to stretch vertically, not horizontally.  Apparently, re-sizing wider to accommodate text is the default instead of higher.

 

This can normally be set in Interface Builder, but it’s not so easy to do dynamically.

 

After trying various Interface Builder settings in XCode, I realized I needed something more creative.  Using the UIKit Additions to NSString I was able to construct a category of the UIButton class that expands depending on the amount of text entered.

 

This category will auto-size the button to fit text assigned to it and maintain the width of the button.  It will only stretch vertically.  It will also shrink back down if the text becomes shorter.

 

If you use this in your code, you will need to set the line break mode either in Interface Builder or programmatically.  Whenever you set the title label of the button, you also need to call the sizeToFit method.

 

Finally, be aware that if you modify your buttons titleEdgeInsets property, the category may need to be modified to accommodate the changes.

 

You can see the code here:

code sample 1
code sample 2

 

code sample 3
code sample 4

If you have any bug reports of suggestions, hit me up with an email via my support page.