New Bubble Chat and TextChatService Customization APIs

[Husslematic (Matic)]

Please include “VerticalStudsOffset” to the BubbleChatMessageProperties instance. I created a overhead gui that enables icons over the name tag but ends up covering the chat bubble. I am aware of BubbleChatConfiguration but it applies to all chat bubbles and makes the bubble spacing seem too far if the overhead icon isn’t visible. Adding this property will help adjust the offset of an individual bubble.

[Azutreo (Azu)]

I am still having issues when trying to set message colors for ONLY in the chat box, not chat bubbles.

For example, I want to make my message color in the chat box gold but keep it normal in the chat bubble. However, it does not work. This is the relevant portion of my code:

function ChatController:KnitStart()
	TextChatService.OnBubbleAdded = function(...)
		return self:OnBubbleAdded(...)
	end

	TextChatService.OnIncomingMessage = function(...)
		return self:OnIncomingMessage(...)
	end
end

function ChatController:OnIncomingMessage(message: TextChatMessage): TextChatMessageProperties?
	local textChannel = message.TextChannel
	if not textChannel or textChannel.Name == "RBXSystem" or not message.TextSource then
		return nil
	end

	...

	local chatColor: string? = player:GetAttribute(ATTRIBUTE_MESSAGE_COLOR)

	local properties = Instance.new("TextChatMessageProperties")

	if typeof(chatColor) == "string" then
		properties.Text = `<font color="#{chatColor}">{message.Text}</font>`
	end

	return properties
end

function ChatController:OnBubbleAdded(message: TextChatMessage, adornee: Instance): BubbleChatMessageProperties?
	local textChannel = message.TextChannel
	if not textChannel or textChannel.Name == "RBXSystem" or not message.TextSource or not message.Text then
		return nil
	end

	local properties = Instance.new("BubbleChatMessageProperties")
	properties.TextColor3 = Color3.new(0, 0, 0) -- properties.TextColor3

	return properties
end

Expected behavior would be that the text color in my chat bubble is pure black. However, since I’m setting the Text to RawText, it doesn’t matter WHAT I set the chat color for the chat bubble to because the RichText will just override it. Ad unfortunately, there is no way to set BubbleChatMessageProperties.Text to override that. So I’m optionless, at the moment.

[Azutreo (Azu)]

@be_nj pinging you for visibility since I know you were a source of contact in the past.

[Beartikal]

This. We need this. I want this. My game, Conveyor Sushi Restaurant, is very social. If Roblox supports this built-in, out-of-the-box, to allow for any image ID to be shown as a sticker, it would greatly improve the social aspect of my game.

TextChatService now Supports Autocomplete for Emojis and Commands!

Hi Developers, We are happy to announce that TextChatService now supports Emoji and Command Autocomplete on Desktop! How to Use You can trigger emoji autocomplete by typing : followed by non-space characters You can trigger command autocomplete by typing / Upon being triggered, the autocomplete window will show with matching suggestions. To select an emoji or command, you can click on it or scroll and hit enter. Additionally, you can also insert emojis by typing out the full al…

Typing something like :meme: for example would swap in an image into the chat and display above the users head, very akin to the Emoji rollout, would be GREAT!!
Please let us know if you can add this or a way we can achieve this.
@daweezy99

[hodog_noketchup]

it’s been a while, is there any info on fixing text bubble’s tail?
TailVisible property does nothing right now.

[WillyDev_Developer (willy)]

Can you change the premium image to a image to your liking? Like, a popular youtuber chats (that isnt verified on roblox, but is verified in my game) will get an verified icon, is that possible?

[700000002 (Tenny)]

Thank you Roblox Team for your hard work! These features have been very useful for developers including myself.

Looking forward to further expansion of the current properties in the future—including perhaps the CornerRadius and Padding options present in the old Chat Service?

[Saezi]

the commitment to streamlining customization is cool and all, but the service is still in dire need of advanced ways to modify aspects of the chat that don’t fall under the umbrella of “things roblox staff has thought about”
my current project has a fork of the legacy chat with a custom system to directly insert images as chat tags, and unless someone added in-line images to rich text formatting while i wasn’t looking, this is something that doesn’t seem to be possible in the new system without plugin-level code permissions

please allow for more advanced direct gui modifications and additions to chat messages and everything else in the system
or just let us modify coregui in a localscript i’ll take that too though that’s probably for security reasons isn’t it

[teamkrash]

This would be perfect if I could customise the animation parameters of the chat bubbles like I could with the legacy system, and if I were able to set the tail to an image, and if the chat window could have more customisation options (including stroke, corner radius, padding, precise position, etc)

There’s also a bug here, with the tail no longer being visible for some reason, even on places without spatial voice and microphone.

[AgronXystaron (Agro)]

Do you know if there is any estimated release date for the text channel update for TextChatService?

[BandaidKidd (Kingzz)]

Nope. I’m surprised they haven’t added it yet.

[Blackcurrrantt]

Will we ever be getting options to edit text stroke colour and text stroke transparency for bubble chat? If not, does anyone know a method to add it through custom scripts?

[700000002 (Tenny)]

Thank you very much for the recent update. We finally have many of the features we’ve been asking for.

@Clasifex

We now support custom corners, gradients, and images for Bubble Chat! You can parent UICorner, ImageLabel, or UIGradient instances under BubbleChatConfiguration to have them applied to all bubbles, or under BubbleChatMessageProperties to have them applied on a per-bubble basis.

I tried out the UICorner, and set it to 0,0 but there was still a round corner. Is this a temporary bug or is this the intended behavior? Also UIPadding isn’t rolled out for the bubble chat yet so I’m wondering if that’s in the works?

[LadyAka (Aka_Saikagemoto)]

Feature request:

As a Roblox developer, it is currently too hard to customize individual BubbleChat visibility based on distance, environment context and focus.

The .OnBubbleAdded BubbleChatConfiguration feature of TextChatService does not support adjusting the .AlwaysOnTop property of BillBoardGui.

If this issue is addressed, it would improve development and reduce reliance on Legacy Chat service.
Use cases:

• Make a specific player’s chat take priority over other nearby players.
• Make a specific player’s chat bubble visible throughout the map/environment.
• Focus on a specific player or NPC’s chat among a clutter of chat bubbles being displayed by other nearby players.

[EmesOfficial (Emes)]

I would like to have the ability to adjust the MinimizeDistance and MaxDistance properties of a bubble per-user basis. My specific use case is a megaphone that enhances the distance of bubbles when the device is held. In my opinion, it would be common sense to support all properties from BubbleChatConfiguration for individual bubbles

[kni0002]

Recently converted my game over to the new chat system. It would be nice if we can edit specific Ui elements with code or give a template for a custom chat system. But other then that the backend and front end with some edits looks a lot nicer now.

Tried to make it look similar to the old chat system, but sadly cant make it 1:1.

[700000002 (Tenny)]

Okay so UICorner and UIPadding have both been out and functioning for a while, however there is a bug that has been stopping them from working which I only just now discovered. This is why I was questioning whether they were fully released. To replicate the bug following these steps:

In Studio, add UICorner and UIPadding objects into the BubbleChatConfiguration.

Edit the scaling properties.

Play the game in Studio. You’ll notice the bubble chat appearance are unchanged by our UI objects.

While playtesting, go to BubbleChatConfiguration, move the UICorner and Padding somewhere else, then reparent it into BubbleChatConfiguration. It will now apply the effects that it should’ve originally displayed.

Not sure if this is happening to others as well, so if anyone could try reproducing this it would be appreciated.

[700000002 (Tenny)]

The temporary solution I’ve employed is, of course, just parenting the objects to the BubbleChatCofig through a server script. I would, however, like to report another issue, which I’ve been unable to find a workaround for.

When setting the chat bubble background to white(255 thrice), the bubble yields a light gray…This means, I suppose, that the chat bubbles are somehow darker than the should be. There’s no Brightness or LightInfluence property(which we would like to have for chat bubbles funnily enough), so we don’t have any settable properties that could cause this problem.

In this photo the chat bubble’s BackGround Transparency is set to 0, thus revealing it’s true color. Once again I am unsure if this is experienced by many others.

[NOOBTRON7777]

I’m replying to this since it was not addressed anywhere else. Is there a chance we could see the return of SizeAnimation and TransparencyAnimation? It seems that they were quietly removed - for what reason?

[BlarBlix (BarBlix)]

I probably would love to see the ability to get the currently inputted text in the chat bar along with the existing isFocused so that I could keep my old style typing counter that lets others know how many characters you’ve been typing/deleting.

Making your own TextBox assigned to ChatInputBarConfiguration would be a nasty hack to try to make it look and function as the native TextChatService text box.

Probably just like IsFocused, have another property for TextBoxText?