Skip to main content

Image and GIF Messages

Users can send image messages and GIF messages through the built-in image plugin in IMKit. These messages will appear in the message list component of the chat UI. By default, the SDK sends messages containing the following message content objects:

  • Image message content class: ImageMessage (type identifier: RC:ImgMsg)
  • GIF message content class: GIFMessage (type identifier: RC:GIFMsg)
tip

In the example images, the image messages have square corners. Currently, the SDK renders image messages with rounded corners. If you need square-cornered image messages, implement a custom UI.

Unread Image Message

(width=220)

Read Image Message

(width=220)

Failed Image Message

(width=220)

Limitations​

  • Only supports sending local images and GIFs.
  • Maximum GIF file size: 2 MB.
  • By default, files in image and GIF messages are uploaded to RC servers. To upload to your own server, intercept the message and handle the upload yourself. See Message Interception.

Usage​

The extension panel includes a built-in option to send image messages, implemented by IMKit's ImagePlugin. Users can tap the + button next to the input field to expand the extension panel, then select the image icon to open the local gallery and choose an image or GIF file to send. Refer to ImagePlugin.java in the IMKit source code.

extension(width=250)

Customization​

Change Default File Save Location​

When users long-press to save received image or GIF messages in the chat UI, the SDK saves them to /RongCloud/Image/ by default. To modify this globally, create an rc_config file in your app's res/values directory:

<string name="rc_image_default_saved_path">/RongCloud/Image/</string>

Adjust Image Compression Quality​

Before sending, images are compressed and thumbnails are generated for display in the chat UI. GIFs are not compressed and do not generate thumbnails.

  • Thumbnails for image messages: The SDK generates a large image at 30% of the original quality, with the longest side not exceeding 240 px. The thumbnail is used for display in the chat UI.
  • Images: If "Send Original" is not selected, the SDK generates a large image at 85% of the original quality, with the longest side not exceeding 1080 px, before uploading and sending.

We recommend keeping the default compression settings. To adjust them, refer to How to Modify SDK Default Image and Video Compression Settings.

Customize Image and GIF Message UI​

Image and GIF messages are displayed in the message list using these default templates:

  • ImageMessageItemProvider
  • GIFMessageItemProvider

To modify the built-in message styles, implement your own message template class and provide it to the SDK. All message templates inherit from BaseMessageItemProvider<CustomMessage>, so your custom template should too. See Customize Message Display.

You can also directly replace the style resources, string resources, or icon resources referenced in the message templates. Refer to ImageMessageItemProvider.java and GIFMessageItemProvider.java in the IMKit source code.

Hide the Image Option in the Extension Panel​

IMKit enables the image option in the extension panel by default. To dynamically modify this, create a custom extension configuration class MyExtensionConfig that extends DefaultExtensionConfig and override the getPluginModules() method. See Input Area.

Last updated on