Feedback

Android(Compose)

组件概述

Search 是搜索组件,为用户提供搜索框、搜索结果展示、界面跳转等功能的完整组件集合。该组件支持好友搜索、群组搜索、消息搜索等功能,并提供了丰富的交互回调接口。
说明:
搜索为专业版或企业版功能,购买专业版或企业版套餐包后可使用,详情请参见 价格说明。
搜索入口
搜索结果



组件集成

Search 组件属于 TUIKit Compose 的一部分,集成 TUIKit Compose 即可获取并使用 Search 组件。集成方法请参考文档 TUIKit Compose 里的集成步骤,完成登录操作。

组件构成

SearchScreen(位于 io.trtc.tuikit.chat.uikit.components.search.ui 包中)是 Search 组件的入口组件,对外仅暴露了搜索组件的初始化方法,其他逻辑均封装在 SearchScreen 中。
方法名
参数
描述
SearchScreen
modifier: Modifier
Jetpack Compose 中用来设置组件的样式、布局、行为和外观。
onBack: () -> Unit
点击搜索框右侧“取消”按钮的回调,通常在这里关闭搜索页面。可选参数。
onContactSelect: (FriendSearchInfo) -> Unit
点击搜索到的好友时的回调,FriendSearchInfo 的 userID 为好友的用户 ID。可选参数。
onGroupSelect: (GroupSearchInfo) -> Unit
点击搜索到的群组时的回调,GroupSearchInfo 的 groupID 为群 ID。可选参数。
onConversationSelect: (MessageSearchResultItem) -> Unit
在某个会话的聊天记录结果页中,点击顶部的会话信息时的回调,MessageSearchResultItem 的 conversationID 为该会话的会话 ID。可选参数。
onMessageSelect: (MessageInfo) -> Unit
在某个会话的聊天记录结果页中,点击某条消息时的回调。可选参数。

基础用法

SearchScreen 的搜索结果路由跳转如下:
自动路由:在搜索结果界面中,点击更多(More)按钮,或者点击某个会话的聊天记录条目时,组件内部会自动完成页面跳转,分别进入该分类的完整结果页和该会话的聊天记录结果页。
自定义路由:当用户点击具体的好友、群组,或者在会话的聊天记录结果页中点击顶部的会话信息、某条消息时,组件会触发相应的回调 onContactSelect / onGroupSelect / onConversationSelect / onMessageSelect,需在回调中实现自定义跳转(例如跳转到您的自定义聊天界面)。
SearchScreen 组件可直接初始化使用,所有回调参数都有默认值,可以只实现需要的回调。示例代码如下:
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.systemBarsPadding
import androidx.compose.runtime.Composable
import androidx.compose.ui.Modifier
import io.trtc.tuikit.atomicxcore.api.conversation.ConversationType
import io.trtc.tuikit.atomicxcore.api.message.MessageInfo
import io.trtc.tuikit.chat.uikit.components.search.ui.SearchScreen

@Composable
fun SearchPage(
onBack: () -> Unit,
onOpenChat: (conversationID: String, locateMessage: MessageInfo?) -> Unit
) {
SearchScreen(
modifier = Modifier
.fillMaxSize()
.systemBarsPadding(),
onBack = onBack,
onContactSelect = { friend ->
// 点击联系人结果,打开与该好友的单聊
onOpenChat("c2c_${friend.userID}", null)
},
onGroupSelect = { group ->
// 点击群组结果,打开群聊
onOpenChat("group_${group.groupID}", null)
},
onConversationSelect = { conversation ->
// 点击会话内消息结果页顶部的会话信息,打开该会话
onOpenChat(conversation.conversationID, null)
},
onMessageSelect = { message ->
// 点击某条消息,打开所在会话并定位到该消息
onOpenChat(message.conversationID, message)
}
)
}

// 根据消息计算其所在会话的 conversationID
val MessageInfo.conversationID: String
get() = when {
conversationType == ConversationType.GROUP -> "group_$to"
isSentBySelf -> "c2c_$to"
else -> "c2c_${from.userID}"
}

定位到搜索到的消息

onMessageSelect 回调中的 MessageInfo 不直接提供会话 ID,可以参考上面示例中的 conversationID 扩展属性计算:群聊消息为 group_ 加上 to;单聊消息中,自己发送的消息为 c2c_ 加上 to,收到的消息为 c2c_ 加上发送者的 userID。打开聊天页面后,将这条消息传给 MessageList 的 locateMessage 参数,消息列表会滚动到该消息并高亮显示:
import io.trtc.tuikit.chat.uikit.components.messagelist.ui.MessageList

// 传入 locateMessage 后,消息列表会滚动到该消息并高亮
MessageList(
conversationID = conversationID,
locateMessage = locateMessage
)