Ready to implement a chat application using Twilio Programmable Chat Client? Here is how it works at a high level:
- Twilio Programmable Chat is the core product we'll be using to handle all the chat functionality
- We use a server side app to generate a user access token which contains all your Twilio account information. The Programmable chat Client uses this token to connect with the API
For your convenience, we consolidated the source code for this tutorial in a single GitHub repository. Feel free to clone it and tweak as required.
The first thing you need to create a client is an access token. This token holds information about your Twilio account and Programmable Chat API keys. We have created a web version of Twilio chat in different languages. You can use any of these to generate the token:
We use Volley to make a request to our server and get the access token.
Now it's time to use that token to initialize your Twilio Client.
We can then pass this information along with the access token generated in the previous step and wait for the client to be ready.
The next step will be getting a channel list.
ChannelManager class takes care of everything related to channels. The first thing we need to do when the class is initialized, is to store a list of channels of type
Channel. To do this we call the method
getChannels from the Programmable Chat Client and extract a
Channel object from each
Let's see how we can listen to events from the chat client so we can update our app's state.
The Programmable Chat Client will trigger events such as
onChannelDeleted on our application. Given the creation or deletion of a channel, we'll reload the channel list in the sliding panel. If a channel is deleted, but we were currently on that same channel, the application will automatically join the general channel.
You must set your
ChatClient to listen to events using a ChatClientListener. In this particular case,
MainChatActivity implements ChatClientListener, but it's methods are called from the
ChannelManager class that also implements ChatClientListener (who is the client's listener).
ChannelManager is used as an event handler proxy. Twilio chat sets the listener when loading the channels.
Next, we need a default channel.
This application will try to join a channel called "General Channel" when it starts. If the channel doesn't exist, it'll create one with that name. The scope of this example application will show you how to work only with public channels, but the Programmable Chat Client allows you to create private channels and handle invitations.
Notice we set a unique name for the general channel as we don't want to create a new general channel every time we start the application.
Now let's listen for some channel events.
We set a channel's listener to
MainChatFragment that implements
ChannelListener, and here we implemented the following methods that listen to channel events:
onMessageAdded: When someone sends a message to the channel you are connected to.
onMemberAdded: When someone joins the channel.
onMemberDeleted: When someone leaves the channel.
As you may have noticed, each one of these methods include useful objects as parameters. One example is the actual message that was added to the channel.
We've actually got a real chat app going here, but let's make it more interesting with multiple channels.
The application uses a Drawer Layout to show a list of the channels created for that Twilio account.
When you tap on the name of a channel, from the sidebar, that channel is set on the
setCurrentChannel method takes care of joining to the selected channel and loading the messages.
If we can join other channels, we'll need some way for a super user to create new channels (and delete old ones).
We use an input dialog so the user can type the name of the new channel. The only restriction here is that the user can't create a channel called "General Channel". Other than that, creating a channel is as simple as using the
channelBuilder as shown and providing at the very least a channel type.
You can provide additional parameters to the builder as we did with general channel to set a unique name. There's a list of methods you can use in the client library API docs.
Cool, we now know how to create a channel, let's say that we created a lot of channels by mistake. In that case, it would be useful to be able to delete those unnecessary channels. That's our next step!
Deleting a channel is easier than creating one. The application lets the user delete the channel they are currently joined to through a menu option. In order to delete the channel from Twilio you have to call the
destroy method on the channel you are trying to delete. But you still need to provide a
StatusListener to handle the success or failure of the operation.
That's it! We've built an Android application with the Twilio Chat SDK. Now you are more than prepared to set up your own chat application.
If you're a Java developer working with Twilio, you might want to check out these other tutorials:
Learn to implement two-factor authentication (2FA) in your web app with Twilio-powered Authy. 2FA helps further secure your users' data by validating more than just a password.
Learn how to build a server notification system that will alert all administrators via SMS when a server outage occurs.
Thanks for checking out this tutorial! If you have any feedback to share with us, we'd love to hear it. Tweet @twilio to let us know what you think.