自定义文档容器界面

协作中台 SDK 支持自定义文档详情页，具体包括以下类型选项：

自定义标题栏
自定义底部菜单栏

你可以通过以下两种方式集成文档的原生化版本列表页面，并在点击文档后进入文档详情页面查看配置效果

KIMDocumentHomeActivity，直接包含了 KIMDocumentHomeFragment 的 Activity 界面，可以通过 KIM.getService().goPage(KIMDocumentHomeFragment::class.java.getPageName(), this, Bundle())启动
KIMDocumentHomeFragment，接入方可以将该 Fragment 嵌入自己的 Activity，直接创建 KIMDocumentHomeFragment, 并通过 fragmentManager 添加到自定义的 Activity 中

接口定义

Kotlin

KIM.getService().goPage(pageName: String, context: Context?, args: Bundle)

参数说明

参数	类型	说明
pageName	string	这里固定值： `KIMDocumentHomeFragment::class.java.getPageName()`
context	Context
args	Bundle

代码示例

示例一

直接使用KIMDocumentHomeActivity

Kotlin

KIM.getService().goPage(KIMDocumentHomeFragment::class.java.getPageName(), this, Bundle())

示例二

使用KIMDocumentHomeFragment，接入方可以将该 Fragment 嵌入自己的 Activity，直接创建 KIMDocumentHomeFragment, 并通过 fragmentManager 添加到自定义的 Activity 中。

自定义 Activity 并将 Fragment 加入到 Activity 中。

Kotlin

import android.os.Bundle
import androidx.fragment.app.FragmentActivity
import com.kingsoft.kim.expand.databinding.KimUiCommonFragmentContainerBinding
import com.kingsoft.kim.kit.sample.R
import com.kingsoft.kim.sdk.docs.kit.open.KIMDocumentHomeFragment

class CustomDocumentActivity : FragmentActivity() {
    private lateinit var binding: KimUiCommonFragmentContainerBinding

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        binding = KimUiCommonFragmentContainerBinding.inflate(layoutInflater)
        setContentView(binding.root)
        if (savedInstanceState == null) {
            val fragment = KIMDocumentHomeFragment()
            supportFragmentManager.beginTransaction()
                .add(R.id.container, fragment, KIMDocumentHomeFragment::class.java.name)
                .commitAllowingStateLoss()
        } else {
            val fragment = supportFragmentManager.findFragmentByTag(KIMDocumentHomeFragment::class.java.name)
            if (fragment == null) {
                finish()
                return
            }
            supportFragmentManager.beginTransaction()
                .attach(fragment)
                .commitAllowingStateLoss()
        }
    }
}

请注意在 Manifest 完成注册及主题设置。

打开Activity页面

Kotlin

startActivity(Intent(this, CustomDocumentActivity::class.java))

自定义示例

自定义标题栏

协作中台 SDK 支持文档详情页界面的自定义，可通过 KIMExpDocumentHomeWebView 提供的扩展接口，实现如下标题栏的自定义设置：

自定义标题内容及设置标题颜色。
隐藏/展示标题栏返回按钮，且可设置返回按钮点击事件。

效果展示

默认	自定义

代码示例

继承KIMExpDocumentHomeWebView()协议接口, 自定义标题栏

Kotlin

class CustomDocumentDetailWebView : KIMExpDocumentDetailWebView() {    
    override fun configureTitleBar(titleBar: ViewGroup) {
        if (getCustomDocumentDetailTitleBar()) {
            super.configureTitleBar(titleBar)
            val titleBackIcon = titleBar.findViewById<View>(R.id.iv_back)
            titleBackIcon.visibility = View.VISIBLE
            titleBackIcon.setOnClickListener {
                WToastUtil.show("返回")
            }
            titleBar.findViewById<TextView>(R.id.tv_title).text = WAppRuntime.getApplication().getString(R.string.custom_docs_title)
            titleBar.findViewById<TextView>(R.id.tv_title).setTextColor(Color.BLUE)
        } else
            super.configureTitleBar(titleBar)
    }
}

继承 KIMSdkApplication, 并注册自定义页面配置

Kotlin

class AppCustomizeApplication : KIMSdkApplication() {
    override fun init(application: Application) {
        super.init(application)
    }

    override fun confMeatsOnBone(): KConf<Meat> {
        return kConfOf(
           KIMExpDocumentDetailWebView::class.java confTo CustomDocumentDetailWebView::class.java)
    }
}

清单文件注册 AppCustomizeApplication

Xml

<application>
  ...
  <meta-data
        android:name="{your-package-name}.AppCustomizeApplication"
        android:value="com.kingsoft.kim.KIMSdkApplication" />
</application>

自定义底部菜单

协作中台 SDK 支持文档详情页界面的自定义，可通过 KIMExpDocumentHomeWebView 提供的扩展接口，实现如下底部菜单栏的自定义设置：

自定义底部菜单的数量、图标、名称、点击事件。
对底部菜单顺序进行排列。

效果展示

默认	自定义

接口定义

配置底部弹起菜单数据源

Kotlin

fun updateDocumentPopupMenus(
        fragment: Fragment,
        menus: MutableList<KIMWebDocumentMenuItem>
    ): MutableList<KIMWebDocumentMenuItem> = menus

功能：用于动态配置底部弹起菜单的选项列表。
返回值：返回经过自定义处理的菜单选项列表，用于更新页面的底部菜单。

底部弹起菜单item点击拦截

Plaintext

fun onClickedDocumentMenuItem(
        fragment: Fragment,
        item: KIMWebDocumentMenuItem,
        defaultHandler: () -> Unit
    ) {
        defaultHandler.invoke()
    }

功能：用于拦截底部弹起菜单的点击事件，可在点击菜单项时实现自定义操作。
默认行为：调用 defaultHandler.invoke() 执行默认点击逻辑。

参数说明

配置底部弹起菜单数据源

参数	类型	说明
fragment	Fragment	当前页面的 `Fragment` 对象，用于菜单配置的上下文环境。
menus	MutableList	底部菜单选项的列表，包含所有需要显示的菜单项信息。

底部弹起菜单item点击拦截

参数	类型	说明
fragment	Fragment	当前页面的 `Fragment` 对象，用于菜单配置的上下文环境。
item	KIMWebDocumentMenuItem	被点击的菜单项对象，包含菜单项的所有属性信息。
defaultHandler	() -> Unit	默认点击处理逻辑，通过 `defaultHandler.invoke()` 调用默认行为。

菜单项数据结构

KIMWebDocumentMenuItem底部菜单项的数据结构定义如下：

Plaintext

class KIMWebDocumentMenuItem(
/**
     * 菜单选项ID，注意不能重复
     */
    var id: String,
/**
     * 选项的图标资源id
     */
    @DrawableRes
    var iconResId: Int,
/**
     * 选中状态的图标资源id
     */
    @DrawableRes
    var iconSelected: Int,
/**
     * 菜单名称
     */
    var name: String,
/**
     * 选中状态
     */
    var isSelected: Boolean,
/**
     * 是否可见
     */
    var canVisible: Boolean = true
)

代码示例

继承KIMExpDocumentHomeWebView()协议接口, 自定义底部菜单栏

Kotlin

class CustomDocumentDetailWebView : KIMExpDocumentDetailWebView() {

    override fun onClickedDocumentMenuItem(
        fragment: Fragment,
        item: KIMWebDocumentMenuItem,
        defaultHandler: () -> Unit
    ) {
        if (getCustomDocumentDetailMore()) {
            WToastUtil.show("${item.name}被点击")
        }else {
            defaultHandler.invoke()
        }
    }

    override fun updateDocumentPopupMenus(
        fragment: Fragment,
        menus: MutableList<KIMWebDocumentMenuItem>
    ): MutableList<KIMWebDocumentMenuItem> {
        if (getCustomDocumentDetailMore()) {
            //修改图标，名称
            menus.forEach {
                when (it.id) {
                    "doc_browser" -> {
                        it.iconResId = com.kingsoft.kim.sdk.docs.R.drawable.docs_ic_search_search
                        it.name = "自定义2"
                    }
                }
            }
            //减少菜单
            menus.removeAt(1)
            //增加菜单
            menus.add(
                1, KIMWebDocumentMenuItem(
                    DOC_MENU_SHARE,
                    com.kingsoft.kim.sdk.docs.R.drawable.docs_ic_search_search,
                    com.kingsoft.kim.sdk.docs.R.drawable.docs_ic_search_search,
                    "自定义1",
                    false,
                    true
                )
            )

            // 移动图标位置
            val itemToMove = menus[4]
            menus.removeAt(4)
            menus.add(2, itemToMove)

            //排序
//        val sortedMenus = menus.sortedBy { it.name }
//        return sortedMenus.toMutableList()
            return menus
        }
        // 如果条件不成立，返回原始菜单
        else{
            super.updateDocumentPopupMenus(fragment, menus)
            return menus
        }
    }
}

继承 KIMSdkApplication, 并注册自定义页面配置

Kotlin

class AppCustomizeApplication : KIMSdkApplication() {
    override fun init(application: Application) {
        super.init(application)
    }

    override fun confMeatsOnBone(): KConf<Meat> {
        return kConfOf(
           KIMExpDocumentDetailWebView::class.java confTo CustomDocumentDetailWebView::class.java)
    }
}

清单文件注册 AppCustomizeApplication

Xml

<application>
  ...
  <meta-data
        android:name="{your-package-name}.AppCustomizeApplication"
        android:value="com.kingsoft.kim.KIMSdkApplication" />
</application>

会话列表界面

消息列表界面

会话数据接口

消息数据接口

会话列表界面

消息列表界面

会话数据接口

消息数据接口

自定义文档容器界面 ​

接口定义 ​

参数说明 ​

代码示例 ​

示例一 ​

示例二 ​

自定义示例 ​

自定义标题栏 ​

效果展示 ​

代码示例 ​

自定义底部菜单 ​

效果展示 ​

接口定义 ​

配置底部弹起菜单数据源 ​

底部弹起菜单item点击拦截 ​

参数说明 ​

配置底部弹起菜单数据源 ​

底部弹起菜单item点击拦截 ​

菜单项数据结构 ​

代码示例 ​

自定义文档容器界面

接口定义

参数说明

代码示例

示例一

示例二

自定义示例

自定义标题栏

效果展示

代码示例

自定义底部菜单

效果展示

接口定义

配置底部弹起菜单数据源

底部弹起菜单item点击拦截

参数说明

配置底部弹起菜单数据源

底部弹起菜单item点击拦截

菜单项数据结构

代码示例