带有 hideUploadButton 的 Microsoft BotFrameWork styleSet
Microsoft BotFrameWork styleSet with hideUploadButton
您好,我是 Microsoft Bot Framework 的新手,请原谅我的问题。
我试图更改聊天机器人的样式,但遇到无法通过 styleSet 禁用我的上传按钮的问题。
const styleOptions = {
hideUploadButton: true,
bubbleBackground: "red",
bubbleBorderStyle: "solid",
bubbleBorderRadius: "10px",
bubbleFromUserBackground: "#5ce9ff",
bubbleFromUserBorderRadius: "10px",
groupTimeStamp: 3000,
emojiSet: true,
timestampFormat: 'relative',
timestampColor: "red",
};
上面的代码工作完全正常,但是当我试图改变聊天机器人的背景图像时,我假设我需要通过 styleSet 传递 styleOptions 并且这是其他一切正常工作的地方而不是上传按钮尽管我把它设置为真。
const styleOptions = {
hideUploadButton: true,
bubbleBackground: "red",
bubbleBorderStyle: "solid",
bubbleBorderRadius: "10px",
bubbleFromUserBackground: "#5ce9ff",
bubbleFromUserBorderRadius: "10px",
groupTimeStamp: 3000,
emojiSet: true,
timestampFormat: 'relative',
timestampColor: "red",
};
const styleSet = createStyleSet({
...styleOptions,
});
styleSet.activities = {
...styleSet.activities,
backgroundImage:
"url('https://i.pinimg.com/originals/79/5c/ab/795cabc4647f73b365e2e6eabd0f34dc.png')",
};
// render webchat
function renderWebChat(token, userId, enableWSS) {
console.log("starting webchat");
window.WebChat.renderWebChat(
{
directLine: window.WebChat.createDirectLine({
token: token,
// domain: '//' + window.location.host,
domain:
"https://bot-web-connector-dot-anna-dev-bot-services.df.r.appspot.com",
webSocket: !!enableWSS,
}),
styleSet,
store: store,
userID: userId,
username: "You",
locale: navigator.language || "en-SG",
},
document.getElementById("webchat")
);
}
我不确定为什么当我以这种方式实现我的代码时它不会成功,谁能告诉我我的错误。
目前 styleOptions
似乎有一个小错误。同时,您可以通过以下操作实现隐藏上传按钮。
styleSet.uploadButton = {
...styleSet.uploadButton,
display:
"none",
};
希望得到帮助!
您好,我是 Microsoft Bot Framework 的新手,请原谅我的问题。
我试图更改聊天机器人的样式,但遇到无法通过 styleSet 禁用我的上传按钮的问题。
const styleOptions = {
hideUploadButton: true,
bubbleBackground: "red",
bubbleBorderStyle: "solid",
bubbleBorderRadius: "10px",
bubbleFromUserBackground: "#5ce9ff",
bubbleFromUserBorderRadius: "10px",
groupTimeStamp: 3000,
emojiSet: true,
timestampFormat: 'relative',
timestampColor: "red",
};
上面的代码工作完全正常,但是当我试图改变聊天机器人的背景图像时,我假设我需要通过 styleSet 传递 styleOptions 并且这是其他一切正常工作的地方而不是上传按钮尽管我把它设置为真。
const styleOptions = {
hideUploadButton: true,
bubbleBackground: "red",
bubbleBorderStyle: "solid",
bubbleBorderRadius: "10px",
bubbleFromUserBackground: "#5ce9ff",
bubbleFromUserBorderRadius: "10px",
groupTimeStamp: 3000,
emojiSet: true,
timestampFormat: 'relative',
timestampColor: "red",
};
const styleSet = createStyleSet({
...styleOptions,
});
styleSet.activities = {
...styleSet.activities,
backgroundImage:
"url('https://i.pinimg.com/originals/79/5c/ab/795cabc4647f73b365e2e6eabd0f34dc.png')",
};
// render webchat
function renderWebChat(token, userId, enableWSS) {
console.log("starting webchat");
window.WebChat.renderWebChat(
{
directLine: window.WebChat.createDirectLine({
token: token,
// domain: '//' + window.location.host,
domain:
"https://bot-web-connector-dot-anna-dev-bot-services.df.r.appspot.com",
webSocket: !!enableWSS,
}),
styleSet,
store: store,
userID: userId,
username: "You",
locale: navigator.language || "en-SG",
},
document.getElementById("webchat")
);
}
我不确定为什么当我以这种方式实现我的代码时它不会成功,谁能告诉我我的错误。
目前 styleOptions
似乎有一个小错误。同时,您可以通过以下操作实现隐藏上传按钮。
styleSet.uploadButton = {
...styleSet.uploadButton,
display:
"none",
};
希望得到帮助!