定制Toast
更新时间: 2024/07/24 13:59:48
自定义Toast
云信白板内置了丰富的Toast提示。云信内置的Toast提示主要涵盖连接,同步提示、各类错误提示、视角提示等。开发者可以根据自身的业务场景,使用白板提供的showToast
和hideToast
自定义Toast提示。还可以使用interceptShowToast
函数拦截内置的Toast。拦截后,开发者可以修改Toast
类型,时间,文案,以及是否显示等。
showToast
showToast
可以使用云信白板提供的Toast
系统展示提示。它的具体使用方式为:
jsimport WhiteBoardSDK from 'WhiteBoardSDK'
WhiteBoardSDK.showToast({
msg: '教师开始上课',
time: 3,
type: 'info',
top: 30,
msgType: 'TEACHER_START_TEACHING'
})
hideToast
调用hideToast
后,能关闭当前在界面上显示的Toast
。它的调用方式为:
jsimport WhiteBoardSDK from 'WhiteBoardSDK'
WhiteBoardSDK.hideToast()
interceptShowToast
interceptShowToast
能够拦截所有的showToast
请求,并改变其行为。
interceptShowToast
可以返回一个IShowToastOption
类型。在返回对象中,开发者可以改变Toast
的文案,位置,时间,以及类型。如果返回boolean
类型且值为false
,则不会显示该Toast
。若值为true
,则按照原方式显示该Toast
若多次调用interceptShowToast
,会使用最后一次interceptShowToast
返回的结果。
jsimport WhiteBoardSDK from 'WhiteBoardSDK'
/**
* 不显示同步数据的Toast
*/
WhiteBoardSDK.interceptShowToast((param: IShowToastOption) => {
if (param.msgType === 'SYNCHRONIZING') {
return false
} else {
return true
}
})
/**
* 修改禁止抢占主播视角的文案
*/
WhiteBoardSDK.interceptShowToast((param: IShowToastOption) => {
if (param.msgType === 'NOT_ALLOWED_REPLACE_ACTIVE_BROADCASTER') {
return {
...param,
msg: `${param.args.broadcasterName}正在直播`
}
} else {
return true
}
})
removeToastIntercept
移除之前设置的拦截请求。
jsimport WhiteBoardSDK from 'WhiteBoardSDK'
WhiteBoardSDK.removeToastIntercept()
MsgType
每个内置的Toast
都有一个MsgType
。详细的类型可以查看文档。
目前视角类的Toast
还带有args
参数。开发者可以结合args
来设置文案。
样式
目前Toast
不支持通过接口配置样式。开发者可以考虑使用css
来调整Toast
的样式。
客户端设置
客户端上可以使用jsDirectCall
调用上面的方法。注意使用jsDirectCall
调用interceptShowToast
时,需要先将参数中的函数,转化为string
类型。
jsconst interceptFnStr = ((option) => {
option.time = option.time + 3
return option
}).toString()
{
action: 'jsDirectCall',
param: {
target: 'WhiteBoardSDKClass',
funcName: 'interceptShowToast',
arg1: interceptFnStr
}
}
此文档是否对你有帮助?