What's the best UI Controls to use for a ChatRoom application?

Question

Hi,

I would like to create a simple chat room like GUI interface that will create an entry for each line spoken in the following format:

Person1: Hello world!
Person2: Hello there.
Person3: What's up?
Person1: not much

Where Person 2&3 will be a blue color. Person1 will be a read color.

If the user wanted, they can click on Person2 or person2's text line and will bring up their profile.

They should also be able to scroll up and down the chat room's history.

Here's my questions:

1.) What's the best UI controls to allow me to do this? 2.) Are there source code examples anywhere?

Thanks in advance.

Answer 1

The way I have done it in the past is a uibutton as a subview of uiscrollview. UIButton allows you to stretch an image across it similar to that of the SMS app, then you can also respond to the user selecting the text.

To make the button appear like a balloon like the SMS app:

[button setBackgroundImage:[[UIImage imageNamed:@"balloon_blue.png"] stretchableImageWithLeftCapWidth:9 topCapHeight:13] forState:UIControlStateNormal];

You could also use UIViews but you get a lot of nice things with UIButton like adding text with alignment, easy callbacks when pressed and different control states when selected with access to the text inside them. This can be handy when implementing copy and paste.

You will have to calculate how long your text will be to determine the size of your button unfortunately but there should be examples on the net for that.