iPhone: How to Display Underlined Text in a Button?

Question

I want to display the mail ID in my view such that clicking the mail ID should open the mail composer view.

I want to display the button text as underlined to show it is a hyperlink and for the button click event to call the mail composer view. At present, I am not able to show the button text underlined.

I thought of placing a label above the button and adjusting the label property to get the underlined text but that did not work.

Is there a different way to get the appearance and behavior I want?

Answer 1

To do what you want, you would need to use CGContextStrokePath() to draw the underline on the UILabel's CGLayer.

That being said, I would challenge you to reconsider your design choice. Making the button text appear to be a hyperlink would make sense a Windows desktop application (e.g. using a LinkLabel). However, the iPhone OS has a different set of user interface conventions owing to its smaller screen and the need for larger targets to accommodate touch input.

The "Cocoa Touch" approach to this problem would be to display a list of mail id's using a UITableView. Provide each row with an appropriate accessory button. For example, you could use either a UITableViewCellAccessoryDetailDisclosureButton, or an UIButton with buttonType of UIButtonTypeContactAdd). The accessory button event handler would then bring up the mail composer.

Good luck, and happy coding!

Answer 2

Another alternative is to set an image for the button. Create an image that displays the appropriate text and the button will display that instead of text.

I agree with Zack that underlining text is redundant and violates the interface grammar. You underline text for links in the first place to indicate that they have behavior like buttons. If the text is already in a button, there is no need to underline it to indicate it behaves like a button because the user already expects an action in response to clicking it.

Answer 3

So what if you want to provide a link to a website within a block of text? The user would need some visual indication the text is a link and will take them somewhere.

The blue underlined hyperlinked look is the expected norm but understand this is the PC way. So what is the iPhone way?

I have in the past used a custom button with no background etc and blue text, although not underlined it does allow tappable text.

Would be interested to know what others do....