Chat

What's a video call without being able to send messages to each other too? 100ms supports chat for every video/audio room you create.

Message Types

• Broadcast messages are sent to Everyone in the chat hmsSDK.sendBroadcastMessage.

• Direct messages are sent to a specific person hmsSDK.sendDirectMessage.

• Group messages are sent to everyone with a particular HMSRole. Such as all hosts or all teachers or all students hmsSDK.sendGroupMessage.

  • You can learn more about Templates and Roles here.

Sending Chat Messages

Let's look at a simple implementation for chat methods:

class Meeting implements HMSUpdateListener, HMSActionResultListener{

  ...

  // onMessage is HMSUpdateListener method called when a new message is received
  @override
  void onMessage({required HMSMessage message}) {
    //Here we will receive messages sent by other peers
  }

  void sendBroadcastMessage(String message,String type) {
        ///[message]: Message to be sent
        ///[type]: Message type(More about this at the end)
        ///[hmsActionResultListener]: instance of class implementing HMSActionResultListener
        //Here this is an instance of class that implements HMSActionResultListener, that is, Meeting
        hmsSDK.sendBroadcastMessage(
          message: message,
          type: type,
          hmsActionResultListener: this);
  }

  void sendDirectMessage(String message, HMSPeer peerTo,String type) async {
        ///[message]: Message to be sent
        ///[peerTo]: Peer to whom message needs to be sent
        ///[type]: Message type(More about this at the end)
        ///[hmsActionResultListener]: instance of class implementing HMSActionResultListener
        //Here this is an instance of class that implements HMSActionResultListener, that is, Meeting
        hmsSDK.sendDirectMessage(
          message: message,
          peerTo: peerTo,
          type: type,
          hmsActionResultListener: this);
  }

  void sendGroupMessage(String message, List<HMSRole> rolesToSendMessage,String type) async {

        ///[message]: Message to be sent
        ///[hmsRolesTo]: Roles to which this message needs to be sent
        ///[type]: Message type(More about this at the end)
        ///[hmsActionResultListener]: instance of class implementing HMSActionResultListener
        //Here this is an instance of class that implements HMSActionResultListener, that is, Meeting
        hmsSDK.sendGroupMessage(
            message: message,
            hmsRolesTo: rolesToSendMessage,
            type: type,
            hmsActionResultListener: this);
  }

  @override
  void onSuccess(
    {HMSActionResultListenerMethod methodType =
        HMSActionResultListenerMethod.unknown,
    Map<String, dynamic>? arguments}) {

        switch (methodType) {

          case HMSActionResultListenerMethod.sendBroadcastMessage:
          //Broadcast Message sent successfully
          //Add the message to messages list
          break;

          case HMSActionResultListenerMethod.sendGroupMessage:
          //Group Message sent successfully
          //Add the message to messages list
          break;

          case HMSActionResultListenerMethod.sendDirectMessage:
          //Direct Message sent successfully
          //Add the message to messages list
          break;
          ...
      }
    }

  @override
  void onException(
      {HMSActionResultListenerMethod methodType =
          HMSActionResultListenerMethod.unknown,
      Map<String, dynamic>? arguments,
      required HMSException hmsException}) {

        switch (methodType) {

            case HMSActionResultListenerMethod.sendBroadcastMessage:
            // Check the HMSException object for details about the error
            break;

            case HMSActionResultListenerMethod.sendGroupMessage:
            // Check the HMSException object for details about the error
            break;

            case HMSActionResultListenerMethod.sendDirectMessage:
            // Check the HMSException object for details about the error
            break;
            ...
        }

    }

  ...
}

Now lets at each method one by one :

Sending Broadcast Messages

Want to let everyone in the chat know something? Call sendBroadcastMessage on the instance of HMSSDK to send a broadcast.

The parameters are:

1. message: The text of the message.
2. type[optional]: The type of the message, default is chat.
3. hmsActionResultListener: An instance of HMSActionResultListener.

hmsSDK.sendBroadcastMessage(message: "Hi", hmsActionResultListener: hmsActionResultListener);

Sending Direct Messages

Got secrets to share? Send a message directly to a single person with a direct message. Call sendDirectMessage on an instance of HMSSDK.

The parameters are:

1. message: The text of the message.
2. peerTo: The HMSPeer instance that should receive the message.
3. type[optional]: The type of the message, default is chat.
4. hmsActionResultListener: An instance of HMSActionResultListener.

hmsSDK.sendDirectMessage(
        message: "Hi",
        peerTo: peerTo,
        hmsActionResultListener: hmsActionResultListener);

Sending Group Messages

Need to call attention to all the hosts? All the teachers? All the developers? Call sendGroupMessage on an instance of HMSSDK.

The parameters are:

1. message: The text of the message.
2. hmsRolesTo: The list of HMSRole, that is,the roles to whom the message needs to be sent.
3. type[optional]: The type of the message, default is chat.
4. hmsActionResultListener: An instance of HMSActionResultListener.

hmsSDK.sendGroupMessage(message: "Hi",
        hmsRolesTo: hmsRolesTo,
        hmsActionResultListener: hmsActionResultListener);

Receiving Chat Messages

When you called hmsSDK.join(config) to join a room, the HMSUpdateListener implementation that was passed in had the callback void onMessage({required HMSMessage message});.

This is where you'll receive new messages as HMSMessage during the call.

Let's look at what the HMSMessage class looks like:

class HMSMessage(

  final String messageId;
  final HMSPeer? sender;
  final String message;
  final String type;
  final DateTime time;
  HMSMessageRecipient? hmsMessageRecipient;

  HMSMessage({
    required this.messageId,
    required this.sender,
    required this.message,
    required this.type,
    required this.time,
    this.hmsMessageRecipient
  });
)

• messageId: Id to uniquely identify the message
• message: Content of the text message or the text description of the raw message.
• type: Type of message sent. The default value is chat.
• hmsMessageRecipient: The intended recipient(s) of this message as a HMSMessageRecipient.
• time: DateTime of when the messaging server receives this message. This can be used for accurate ordering of your messages.
• sender: The HMSPeer who is sending this message.

Let's break down each parameter a bit more in detail :

class HMSMessageRecipient{
    HMSPeer? recipientPeer;
    List<HMSRole>? recipientRoles;
    HMSMessageRecipientType hmsMessageRecipientType;
}

List<HMSMessage> messages = [];

@override
void onMessage({required HMSMessage message}) {
  messages.add(message);
}

List<HMSMessage> broadcastList = [];
List<HMSMessage> rolesList = [];
List<HMSMessage> peerList = [];

List<HMSMessage> messageFilter(List<HMSMessage> messages, HMSMessageRecipientType type) {
  filterList = [];
  for(HMSMessage message in messages) {

    // Filter list based on Broadcast chat.
    if(message.hmsMessageRecipient.hmsMessageRecipientType == HMSMessageRecipientType.BROADCAST) {
      broadcastList.add(message);
    }

    // Filter list based on Roles chat(group messages).
    if(message.hmsMessageRecipient.hmsMessageRecipientType == HMSMessageRecipientType.ROLES) {
      rolesList.add(message);
    }

    // Filter list based on Peer chat(direct messages).
    if(message.hmsMessageRecipient.hmsMessageRecipientType == HMSMessageRecipientType.PEER) {
      peerList.add(message);
    }
  }
}

Advanced Use-Cases

Sometimes the app requires to show messages in different styles. Something similar to this:

HMSSDK provides the type parameter of the HMSMessage object to take care of such use cases.

You can send messages as:

hmsSDK.sendBroadcastMessage(message: "😁", type: "emoji", hmsActionResultListener: hmsActionResultListener);

Filter out the messages based on the type parameter and handle the UI accordingly.

//Example to show emoticons when the message type is set to `emoji`
@override
void onMessage({required HMSMessage message}) {
  if(message.type=="emoji"){
      //Show as emoticons on UI
  }
  else{
    //Handle other cases
  }
}