API
Return to top
ChatBubble
编辑

服务 / ChatBubble

ChatBubble Class
​

聊天头顶气泡

  1. 什么是头顶气泡？

  • 物体或角色头顶上出现的气泡通常称为「对话气泡」或「漫画气泡」。这种视觉效果被用来表示物体或角色正在说话、思考或传达信息。

  • 对话气泡通常包含文字、图标或表情符号，以传达物体或角色的语言、情绪或意图。

  • 它们可以呈现为云状气泡，矩形气泡或其他形状，具体样式根据游戏的艺术风格和设计决策而定。(目前可以修改气泡或文字大小颜色等，暂未支持气泡皮肤样式功能，之后会暴露接口DIY气泡样式)

通过在游戏中使用对话气泡，开发者可以更生动地展示物体或角色之间的交互和对话，更好地理解故事情节、任务提示或角色的个性特点。

Table of contents ​

Accessors
​

bubbleBackgroundColor(): LinearColor
获取气泡背景颜色
bubbleDisplayDistance(): number
获取气泡间隔距离
bubbleDuration(): number
获取气泡持续时长
bubbleEnabled(): boolean
获取是否开启气泡功能的布尔值。
bubblePositionOffset(): Vector
获取气泡位置偏移
bubbleTextColor(): LinearColor
获取气泡文字颜色
bubbleTextFont(): UIFontGlyph
获取气泡文字字体
bubbleTextSize(): number
获取气泡文字大小
maxParallelBubbles(): number
获取说话时头顶气泡共存数量。
onChatBubbleDisplay(): MulticastDelegate<(message: string, parent: GameObject) => void>
当发出某一段文字时触发的委托
onMessageReceive(): MulticastDelegate<(mesage: string) => void>
当收到某一段文字时触发的委托

Methods
​

displayChatBubbble(parent: GameObject, message: string): void
显示气泡

Accessors ​

bubbleBackgroundColor
​

• Static get bubbleBackgroundColor(): LinearColor

• Static set bubbleBackgroundColor(color): void

获取气泡背景颜色

Returns ​

LinearColor

设置气泡背景颜色

Parameters ​

colorLinearColor
使用示例:创建一个名为 NewScript 的脚本，放置在对象栏中，打开脚本，将原本内容修改为如下内容，保存并运行游戏，正方体头顶显示气泡。
ts
@Component
export default class NewScript extends Script {
    protected onStart(): void {
        if(SystemUtil.isClient()){
            UIService.show(newUI);
        }
    }
}

class newUI extends UIScript{
    button:StaleButton;
    protected onStart() {

        this.canUpdate = false;
        this.layer = UILayerScene;

        this.button = StaleButton.newObject(this.rootCanvas);
        this.button.text = "button";
        this.button.visibility = SlateVisibility.Visible;
        this.button.onClicked.add(async ()=>{
            ChatBubble.bubbleBackgroundColor = LinearColor.green;
        });
    }
}
@Component
export default class NewScript extends Script {
    protected onStart(): void {
        if(SystemUtil.isClient()){
            UIService.show(newUI);
        }
    }
}

class newUI extends UIScript{
    button:StaleButton;
    protected onStart() {

        this.canUpdate = false;
        this.layer = UILayerScene;

        this.button = StaleButton.newObject(this.rootCanvas);
        this.button.text = "button";
        this.button.visibility = SlateVisibility.Visible;
        this.button.onClicked.add(async ()=>{
            ChatBubble.bubbleBackgroundColor = LinearColor.green;
        });
    }
}

bubbleDisplayDistance
​

• Static get bubbleDisplayDistance(): number

• Static set bubbleDisplayDistance(num): void

获取气泡间隔距离

Returns ​

number

设置气泡间隔距离

Parameters ​

numnumber
使用示例:创建一个名为 NewScript 的脚本，放置在对象栏中，打开脚本，将原本内容修改为如下内容，保存并运行游戏，正方体头顶显示气泡。
ts
@Component
export default class NewScript extends Script {
    protected onStart(): void {
        if(SystemUtil.isClient()){
            UIService.show(newUI);
        }
    }
}

class newUI extends UIScript{
    button:StaleButton;
    protected onStart() {

        this.canUpdate = false;
        this.layer = UILayerScene;

        this.button = StaleButton.newObject(this.rootCanvas);
        this.button.text = "button";
        this.button.visibility = SlateVisibility.Visible;
        this.button.onClicked.add(async ()=>{
            ChatBubble.bubbleDisplayDistance = 100;
        });
    }
}
@Component
export default class NewScript extends Script {
    protected onStart(): void {
        if(SystemUtil.isClient()){
            UIService.show(newUI);
        }
    }
}

class newUI extends UIScript{
    button:StaleButton;
    protected onStart() {

        this.canUpdate = false;
        this.layer = UILayerScene;

        this.button = StaleButton.newObject(this.rootCanvas);
        this.button.text = "button";
        this.button.visibility = SlateVisibility.Visible;
        this.button.onClicked.add(async ()=>{
            ChatBubble.bubbleDisplayDistance = 100;
        });
    }
}

bubbleDuration
​

• Static get bubbleDuration(): number

• Static set bubbleDuration(time): void

获取气泡持续时长

Returns ​

number

设置气泡持续时长

Parameters ​

timenumber
使用示例:创建一个名为 NewScript 的脚本，放置在对象栏中，打开脚本，将原本内容修改为如下内容，保存并运行游戏，正方体头顶显示气泡。
ts
@Component
export default class NewScript extends Script {
    protected onStart(): void {
        if(SystemUtil.isClient()){
            UIService.show(newUI);
        }
    }
}

class newUI extends UIScript{
    button:StaleButton;
    protected onStart() {

        this.canUpdate = false;
        this.layer = UILayerScene;

        this.button = StaleButton.newObject(this.rootCanvas);
        this.button.text = "button";
        this.button.visibility = SlateVisibility.Visible;
        this.button.onClicked.add(async ()=>{
            ChatBubble.bubbleDuration = 1;
        });
    }
}
@Component
export default class NewScript extends Script {
    protected onStart(): void {
        if(SystemUtil.isClient()){
            UIService.show(newUI);
        }
    }
}

class newUI extends UIScript{
    button:StaleButton;
    protected onStart() {

        this.canUpdate = false;
        this.layer = UILayerScene;

        this.button = StaleButton.newObject(this.rootCanvas);
        this.button.text = "button";
        this.button.visibility = SlateVisibility.Visible;
        this.button.onClicked.add(async ()=>{
            ChatBubble.bubbleDuration = 1;
        });
    }
}

bubbleEnabled
​

• Static get bubbleEnabled(): boolean

• Static set bubbleEnabled(enable): void

获取是否开启气泡功能的布尔值。

Returns ​

boolean

设置是否开启气泡功能。

这是一个总开关，当开启时，物体或者角色说话时才会有气泡效果。

Parameters ​

enable boolean是否开启气泡功能。
默认为 false 关闭的状态。是使用角色聊天气泡功能，需要设置为 true 。
使用示例:创建一个名为 NewScript 的脚本，放置在对象栏中，打开脚本，将原本内容修改为如下内容，保存并运行游戏，正方体头顶显示气泡。
ts
@Component
export default class NewScript extends Script {
    protected onStart(): void {
        if(SystemUtil.isClient()){
            UIService.show(newUI);
        }
    }
}

class newUI extends UIScript{
    button:StaleButton;
    protected onStart() {

        this.canUpdate = false;
        this.layer = UILayerScene;

        this.button = StaleButton.newObject(this.rootCanvas);
        this.button.text = "button";
        this.button.visibility = SlateVisibility.Visible;
        this.button.onClicked.add(async ()=>{
            ChatBubble.bubbleEnabled = true;
        });
    }
}
@Component
export default class NewScript extends Script {
    protected onStart(): void {
        if(SystemUtil.isClient()){
            UIService.show(newUI);
        }
    }
}

class newUI extends UIScript{
    button:StaleButton;
    protected onStart() {

        this.canUpdate = false;
        this.layer = UILayerScene;

        this.button = StaleButton.newObject(this.rootCanvas);
        this.button.text = "button";
        this.button.visibility = SlateVisibility.Visible;
        this.button.onClicked.add(async ()=>{
            ChatBubble.bubbleEnabled = true;
        });
    }
}

bubblePositionOffset
​

• Static get bubblePositionOffset(): Vector

• Static set bubblePositionOffset(num): void

获取气泡位置偏移

Returns ​

Vector

设置气泡位置偏移

Parameters ​

numVector
使用示例:创建一个名为 NewScript 的脚本，放置在对象栏中，打开脚本，将原本内容修改为如下内容，保存并运行游戏，正方体头顶显示气泡。
ts
@Component
export default class NewScript extends Script {
    protected onStart(): void {
        if(SystemUtil.isClient()){
            UIService.show(newUI);
        }
    }
}

class newUI extends UIScript{
    button:StaleButton;
    protected onStart() {

        this.canUpdate = false;
        this.layer = UILayerScene;

        this.button = StaleButton.newObject(this.rootCanvas);
        this.button.text = "button";
        this.button.visibility = SlateVisibility.Visible;
        this.button.onClicked.add(async ()=>{
            ChatBubble.bubblePositionOffset = new Vector(0,0,50);
        });
    }
}
@Component
export default class NewScript extends Script {
    protected onStart(): void {
        if(SystemUtil.isClient()){
            UIService.show(newUI);
        }
    }
}

class newUI extends UIScript{
    button:StaleButton;
    protected onStart() {

        this.canUpdate = false;
        this.layer = UILayerScene;

        this.button = StaleButton.newObject(this.rootCanvas);
        this.button.text = "button";
        this.button.visibility = SlateVisibility.Visible;
        this.button.onClicked.add(async ()=>{
            ChatBubble.bubblePositionOffset = new Vector(0,0,50);
        });
    }
}

bubbleTextColor
​

• Static get bubbleTextColor(): LinearColor

• Static set bubbleTextColor(color): void

获取气泡文字颜色

Returns ​

LinearColor

设置气泡文字颜色

Parameters ​

colorLinearColor
使用示例:创建一个名为 NewScript 的脚本，放置在对象栏中，打开脚本，将原本内容修改为如下内容，保存并运行游戏，正方体头顶显示气泡。
ts
@Component
export default class NewScript extends Script {
    protected onStart(): void {
        if(SystemUtil.isClient()){
            UIService.show(newUI);
        }
    }
}

class newUI extends UIScript{
    button:StaleButton;
    protected onStart() {

        this.canUpdate = false;
        this.layer = UILayerScene;

        this.button = StaleButton.newObject(this.rootCanvas);
        this.button.text = "button";
        this.button.visibility = SlateVisibility.Visible;
        this.button.onClicked.add(async ()=>{
            ChatBubble.bubbleTextColor = LinearColor.red;
        });
    }
}
@Component
export default class NewScript extends Script {
    protected onStart(): void {
        if(SystemUtil.isClient()){
            UIService.show(newUI);
        }
    }
}

class newUI extends UIScript{
    button:StaleButton;
    protected onStart() {

        this.canUpdate = false;
        this.layer = UILayerScene;

        this.button = StaleButton.newObject(this.rootCanvas);
        this.button.text = "button";
        this.button.visibility = SlateVisibility.Visible;
        this.button.onClicked.add(async ()=>{
            ChatBubble.bubbleTextColor = LinearColor.red;
        });
    }
}

bubbleTextFont
​

• Static get bubbleTextFont(): UIFontGlyph

• Static set bubbleTextFont(textFont): void

获取气泡文字字体

Returns ​

UIFontGlyph

设置气泡文字字体

Parameters ​

textFontUIFontGlyph
使用示例:创建一个名为 NewScript 的脚本，放置在对象栏中，打开脚本，将原本内容修改为如下内容，保存并运行游戏，正方体头顶显示气泡。
ts
@Component
export default class NewScript extends Script {
    protected onStart(): void {
        if(SystemUtil.isClient()){
            UIService.show(newUI);
        }
    }
}

class newUI extends UIScript{
    button:StaleButton;
    protected onStart() {

        this.canUpdate = false;
        this.layer = UILayerScene;

        this.button = StaleButton.newObject(this.rootCanvas);
        this.button.text = "button";
        this.button.visibility = SlateVisibility.Visible;
        this.button.onClicked.add(async ()=>{
            ChatBubble.bubbleTextFont = UIFontGlyph.BoldItalics;
        });
    }
}
@Component
export default class NewScript extends Script {
    protected onStart(): void {
        if(SystemUtil.isClient()){
            UIService.show(newUI);
        }
    }
}

class newUI extends UIScript{
    button:StaleButton;
    protected onStart() {

        this.canUpdate = false;
        this.layer = UILayerScene;

        this.button = StaleButton.newObject(this.rootCanvas);
        this.button.text = "button";
        this.button.visibility = SlateVisibility.Visible;
        this.button.onClicked.add(async ()=>{
            ChatBubble.bubbleTextFont = UIFontGlyph.BoldItalics;
        });
    }
}

bubbleTextSize
​

• Static get bubbleTextSize(): number

• Static set bubbleTextSize(size): void

获取气泡文字大小

Returns ​

number

设置气泡文字大小

Parameters ​

sizenumber
使用示例:创建一个名为 NewScript 的脚本，放置在对象栏中，打开脚本，将原本内容修改为如下内容，保存并运行游戏，正方体头顶显示气泡。
ts
@Component
export default class NewScript extends Script {
    protected onStart(): void {
        if(SystemUtil.isClient()){
            UIService.show(newUI);
        }
    }
}

class newUI extends UIScript{
    button:StaleButton;
    protected onStart() {

        this.canUpdate = false;
        this.layer = UILayerScene;

        this.button = StaleButton.newObject(this.rootCanvas);
        this.button.text = "button";
        this.button.visibility = SlateVisibility.Visible;
        this.button.onClicked.add(async ()=>{
            ChatBubble.bubbleTextSize = 30;
        });
    }
}
@Component
export default class NewScript extends Script {
    protected onStart(): void {
        if(SystemUtil.isClient()){
            UIService.show(newUI);
        }
    }
}

class newUI extends UIScript{
    button:StaleButton;
    protected onStart() {

        this.canUpdate = false;
        this.layer = UILayerScene;

        this.button = StaleButton.newObject(this.rootCanvas);
        this.button.text = "button";
        this.button.visibility = SlateVisibility.Visible;
        this.button.onClicked.add(async ()=>{
            ChatBubble.bubbleTextSize = 30;
        });
    }
}

maxParallelBubbles
​

• Static get maxParallelBubbles(): number

• Static set maxParallelBubbles(num): void

获取说话时头顶气泡共存数量。

如果number=5，意味着可以同时存在五个气泡。

默认是三个气泡共存。

Returns ​

number

设置说话时头顶气泡共存数量。

可以根据自己的喜好设置气泡共存数量。

Parameters ​

numnumber
使用示例:创建一个名为 NewScript 的脚本，放置在对象栏中，打开脚本，将原本内容修改为如下内容，保存并运行游戏，正方体头顶显示气泡。
ts
@Component
export default class NewScript extends Script {
    protected onStart(): void {
        if(SystemUtil.isClient()){
            UIService.show(newUI);
        }
    }
}

class newUI extends UIScript{
    button:StaleButton;
    protected onStart() {

        this.canUpdate = false;
        this.layer = UILayerScene;

        this.button = StaleButton.newObject(this.rootCanvas);
        this.button.text = "button";
        this.button.visibility = SlateVisibility.Visible;
        this.button.onClicked.add(async ()=>{
            ChatBubble.maxParallelBubbles = 1;
        });
    }
}
@Component
export default class NewScript extends Script {
    protected onStart(): void {
        if(SystemUtil.isClient()){
            UIService.show(newUI);
        }
    }
}

class newUI extends UIScript{
    button:StaleButton;
    protected onStart() {

        this.canUpdate = false;
        this.layer = UILayerScene;

        this.button = StaleButton.newObject(this.rootCanvas);
        this.button.text = "button";
        this.button.visibility = SlateVisibility.Visible;
        this.button.onClicked.add(async ()=>{
            ChatBubble.maxParallelBubbles = 1;
        });
    }
}

onChatBubbleDisplay
​

• Static get onChatBubbleDisplay(): MulticastDelegate<(message: string, parent: GameObject) => void>

当发出某一段文字时触发的委托

Returns ​

MulticastDelegate<(message: string, parent: GameObject) => void>

onMessageReceive
​

• Static get onMessageReceive(): MulticastDelegate<(mesage: string) => void>

当收到某一段文字时触发的委托

Returns ​

MulticastDelegate<(mesage: string) => void>

Methods ​

displayChatBubbble
​

• Static displayChatBubbble(parent, message): void

显示气泡

Parameters ​

parent GameObject气泡挂载的 gameobject 物体
message string气泡显示的文字
range: 不限制
使用示例:创建一个名为 NewScript 的脚本，放置在对象栏中，打开脚本，将原本内容修改为如下内容，保存并运行游戏，正方体头顶显示气泡。
ts
@Component
export default class NewScript extends Script {
    protected onStart(): void {
        if(SystemUtil.isClient()){
            UIService.show(newUI);
        }
    }
}

class newUI extends UIScript{
    button:StaleButton;
    protected onStart() {

        this.canUpdate = false;
        this.layer = UILayerScene;

        this.button = StaleButton.newObject(this.rootCanvas);
        this.button.text = "button";
        this.button.visibility = SlateVisibility.Visible;
        this.button.onClicked.add(async ()=>{
            let cube = GameObject.asyncFindGameObjectById("0AB6A7D9");
            ChatBubble.displayChatBubbble(await cube, "hello");
        });
    }
}
@Component
export default class NewScript extends Script {
    protected onStart(): void {
        if(SystemUtil.isClient()){
            UIService.show(newUI);
        }
    }
}

class newUI extends UIScript{
    button:StaleButton;
    protected onStart() {

        this.canUpdate = false;
        this.layer = UILayerScene;

        this.button = StaleButton.newObject(this.rootCanvas);
        this.button.text = "button";
        this.button.visibility = SlateVisibility.Visible;
        this.button.onClicked.add(async ()=>{
            let cube = GameObject.asyncFindGameObjectById("0AB6A7D9");
            ChatBubble.displayChatBubbble(await cube, "hello");
        });
    }
}