tencent cloud

即时通信 IM

Android(Compose)

下载
聚焦模式
字号
最后更新时间: 2026-06-03 14:21:54
本文会引导您集成 TUIKit Compose 成功发送第一条消息。

开发环境要求

Android Studio Ladybug | 2024.2.1 及以上版本
Android 5.0 及以上系统版本
Gradle 8.9 及以上版本
JDK 17 及以上版本

前提条件

开通服务

1. 登录 控制台。如果您已有应用,请记录其 SDKAppIDSDKSecretKey 并直接跳转到下一节。
2. 在概览面板单击创建,开始创建新应用。

3. 在创建应用弹框中填入应用名称,选择产品为 Chat

4. 选择完产品后,会显示出部署区域,请按需选择。

5. 创建完成后,可在控制台概览面板查看新建应用的 SDKAppIDSDKSecretKey,后续运行 Demo 时需要用到这两个信息。

禁止:
请妥善保管 SDKSecretKey,谨防泄露!

创建账号

创建账号的方式主要有 2 种,你可以选择下列任意一种合适的方式。
客户端注册
控制台注册
在下文 登录 TUIKit 中传入一个全新的 UserID 即可,此时 TUIKit 会自动为您注册该 UserID。
步骤如下:
1. 进入 Chat > 账号管理 页面。
2. 点击新建账号,弹出创建账号信息填写框。

3. 如果只是普通成员,选择普通账号即可。我们建议设置昵称。界面上可以通过昵称展示不同用户。

注意:
发消息至少是两个用户之间进行,因此您在此环节至少要创建 2 个账号。请记录下这 2 个账号的 userID,后续步骤会使用到。

生成 UserSig

2. 在签名(UserSig)生成工具区域,选择应用,输入 UserID。单击"生成"即可生成签名,签名有效期默认为180天。单击"复制"即可粘贴保存签名。

说明:
更多 UserSig 相关操作,请参见 UserSig 生成&校验

集成 TUIKit

集成步骤请参考 全功能接入
注意:
1. 如果你新建了一个空 Android 项目集成 TUIKit Compose,可逐步参考以下步骤实现发送第一条消息。
2. 如果你在已有项目里集成 TUIKit Compose,请保持你的 UI 原代码不变,仅参考下文的登录及消息界面的组装逻辑。

登录 TUIKit

使用 TUIKit Compose 组件里的功能需要调用 LoginStorelogin API 登录用户账号,分两种情况:
如果你没有事先在控制台创建用户账号,请分别先后调 LoginStore 登录账号 user1 和 user2。最后确保 user1 在线。
如果你事先在控制台创建了 user1 和 user2,仅登录 user1。
说明:
1. 登录 user1 后给 user2 发消息,user2 可以不登录,Chat 默认允许用户和好友、陌生人之间发送单聊消息。
2. 如果你希望 user1 和 user2 能聊天互动,需要用另外一台设备登录 user2 并进入与 user1 的聊天界面。
login 接口调用示例如下:
// API location: io.trtc.tuikit.atomicxcore.api.login.LoginStore
LoginStore.shared.login(
activity, // Activity context
sdkAppID, // Int, SDK application ID
userID, // String, User ID
userSig, // String, User signature
object : CompletionHandler {
override fun onSuccess() {
// Login success
}
override fun onFailure(code: Int, desc: String) {
// Login failed
}
}
)

加载聊天界面

以一个包含完整登录流程和聊天界面的 Activity 为例,App 启动时加载该 Activity。
注意,如果你直接使用我们的示例代码,需要预填充这几个参数:
sdkAppID,上文获取的 sdkAppID。
senderUserID,发送消息者的 userID(也就是上文的 user1)。
senderUserSig,上文获取到的,发送消息者的 userSig。
receiverUserID,接受消息者的 userID。
示例代码如下:
// ChatDemoActivity.kt
import android.os.Bundle
import androidx.activity.compose.setContent
import androidx.appcompat.app.AppCompatActivity
import androidx.compose.foundation.background
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.navigationBarsPadding
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.statusBarsPadding
import androidx.compose.material3.CircularProgressIndicator
import androidx.compose.material3.Text
import androidx.compose.runtime.getValue
import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.remember
import androidx.compose.runtime.setValue
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import io.trtc.tuikit.atomicx.basecomponent.theme.LocalTheme
import io.trtc.tuikit.atomicx.messageinput.ui.MessageInput
import io.trtc.tuikit.atomicx.messagelist.ui.MessageList
import io.trtc.tuikit.atomicxcore.api.CompletionHandler
import io.trtc.tuikit.atomicxcore.api.login.LoginStore

class ChatDemoActivity : AppCompatActivity() {

private val sdkAppID: Int = 1234567890 // TODO: Fill in the sdkAppID here.
private val senderUserID = "" // TODO: Fill in your userID here, you are the sender.
private val senderUserSig = "" // TODO: Fill in your generated userSig here.
private val receiverUserID = "" // TODO: Fill in the receiver's userID here.

// C2C conversationID: "c2c_${userID}", Group conversationID: "group_${groupID}"
private val conversationID: String get() = "c2c_${receiverUserID}"

override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
login()
}

private fun login() {
LoginStore.shared.login(this, sdkAppID, senderUserID, senderUserSig, object : CompletionHandler {
override fun onSuccess() {
showChatPage()
}
override fun onFailure(code: Int, desc: String) {
// Handle login failure
}
})
}

private fun showChatPage() {
setContent {
val colors = LocalTheme.current.colors
Column(
modifier = Modifier
.fillMaxSize()
.background(color = colors.bgColorOperate)
.statusBarsPadding()
) {
// MessageList
Box(modifier = Modifier.weight(1f)) {
MessageList(
conversationID = conversationID,
onUserClick = { userID ->
// Handle user avatar click
}
)
}
// MessageInput
MessageInput(
conversationID = conversationID,
modifier = Modifier.navigationBarsPadding()
)
}
}
}
}

发送第一条消息

操作完上述步骤,启动 App 后会自动登录并加载聊天界面。手动单击输入框,发送您的第一条消息:


联系我们

如果您在接入或使用过程有任何疑问或者建议,欢迎 联系我们 提交反馈。

帮助和支持

本页内容是否解决了您的问题?

填写满意度调查问卷,共创更好文档体验。

文档反馈