Creating Message-like UI on iPhone (without sending SMS / email)

Question

I am developing a chat application that sends emssages via push notifications and p2p connections ( not via SMS or email).

I would like to create a view controller that has some custom views at the top, and then a message flow under it. Messages should be presented similarly to Messages iPhone.

Is it possible to reuse Apple code (is there a ViewController / View that I can use? Can I somehow use the MFMessageComposeViewController ?), Or should I reinvent the wheel and make my own implementation?

Answer 1

There are several open source solutions that very accurately recreate the message interface:

• SSMessagesViewController by Sam Soffes
• MessagesTableViewController from jessesquires

Of course, you can also create an interface yourself, using a UITableView to place custom cells that will draw speech bubbles and text inside them.

Answer 2

UICollectionViewController can be used to create messages such as the user interface.

Answer 3

I recently published an open source project that solves this problem. The Chat SDK is available under the MIT license on Github. The library has the following functions that may be useful:

BChatViewController.m

Speech message view with bubbles, similar to the Messages application. Here you can also see examples of how to handle keyboard shows and hide events to add an input text field on top of the keyboard.

BMessageCell.m

This is the main class of message bubbles. There are functions for dynamically flowering message bubbles ( +(UIImage *) bubbleWithImage: withColor: and adding the tail of a speech bubble.

BMessageLayout.m

Useful utility functions for determining the height for a text area.

BTextInputView.m

This is a variable sized text input field that floats above the keyboard.

The user interface is very modular, which means you can easily add it to your application.

This library also supports Firebase , which means you won’t need to create your own system to send messages using push notifications.