There are many components that you can use and integrate into your existing application.
UIKit provides already built UI elements in one page. You can change the appearances, such as colour and typography in the global settings. However, UIKit does not allow you to replace these small components with other views. And you cannot modify the view hierarchy inside the page.
Feature
Description
Recent chat list
User can see a list of the most recent chats
Navigation to Message list
When a user clicks a chat, UIKit opens a chatroom page
Feature | Description |
User avatar | If the user has no avatar, the system will show the default avatar. |
User Display name | If the user has no display name, the display name will be 'anonymous'. |
Back button | Redirect user back to the previous page. |
Feature | Description |
Show list of message | The latest message bubble will be on the bottom of the screen, and the user can scroll up to see all messages. |
Date label | Grouping messages by the sent date. |
Feature | Description |
Read more mode | When the text is more than 13 lines, the system show read more mode. Once it is clicked on the read more button, it expands text to the full size. |
Long press to delete | If the long click event occurs, the system will show the delete option. |
Long press to edit | If the long click event occurs, the system will show the edit option. When click the edit option, the system will redirect the user to the edit message page. |
Error to send message indicator | If the message can not be sent, the system will show the error indicator in front of the message bubble. |
Sent time stamp | Show as time stamp HH:MM |
Edited label | If the message is edited, the edited label will be shown. |
Deleted message | If the message is deleted, the deleted view will be shown. |
Feature | Description |
Image thumbnails | The system shows the image base on the image ratio. Once it is clicked, it will redirect the user to the edit message page. |
Image upload state | The system will show the image uploading indicator while the image is being uploaded. |
Feature | Description |
Pinch zoom gesture | The user can pinch the screen to zoom in or out the image. |
back | Redirect user back to the previous page. |
Feature | Description |
Click to play | If the user clicks on the voice message , the system will play the audio |
Click to stop | If the user clicks on the playing voice message or play another voice message, the system will stop playing the playing audio. |
Feature | Description |
Hold to record | The user can hold to record an audio message for up to 60 seconds. Once the user releases the finger, the system will send the audio message. |
Discard the record | The user can drag the finger to the bin button to discard the current recording session. |
Feature | Description |
Add text | User can update the text from the original input |
Save | User can click save button to save the change he made. |
Discard change | user can click x to discard all change before user click save. |
Parameter | Description |
channelId | Use to query channel info and message list |