Personnaliser le chat en bulle

Avec TextChatService, vous pouvez utiliser le chat en bulle pour afficher des bulles de dialogue personnalisables au-dessus des avatars des utilisateurs et des PNJ. Le chat en bulle peut rendre votre jeu plus visuellement immersif et aider les utilisateurs à identifier facilement les messages et leurs émetteurs de manière contextuellement pertinente. Cette fonctionnalité est particulièrement utile pour les jeux où les utilisateurs doivent se concentrer sur le contenu tout en communiquant avec d'autres de manière moins intrusive.

Activer le chat en bulle

Pour activer le chat en bulle dans votre jeu :

1. Dans la fenêtre Explorer, sélectionnez BubbleChatConfiguration sous TextChatService.

   

2. Dans la fenêtre Propriétés, cochez la case BubbleChatConfiguration.Enabled.

   

Personnalisation de la bulle

Après avoir activé le chat en bulle, vous pouvez personnaliser l'apparence et le comportement de vos bulles de chat pour correspondre au thème de votre jeu. Utilisez la fenêtre Propriétés de BubbleChatConfiguration pour des modifications de base comme la couleur du texte et l'espacement, ou mettez en œuvre une personnalisation avancée pour les images de fond des bulles et autres ajustements visuels.

Alternativement, ajoutez un LocalScript dans StarterPlayerScripts avec tous vos paramètres de personnalisation. Cela permet au moteur d'appliquer vos personnalisations pendant l'exécution, en remplaçant les paramètres dans Studio. C'est utile pour ajouter des effets spéciaux aux bulles de chat lorsque les utilisateurs déclenchent certains événements ou conditions.

Personnalisation de base

Le tableau suivant montre les propriétés courantes de personnalisation du chat en bulle. Pour une liste complète des propriétés de personnalisation, voir BubbleChatConfiguration.

Personnalisation avancée

Pour une personnalisation avancée de votre bulle, ajoutez des objets UI représentant certains aspects de l'apparence de la bulle en tant qu'enfants sous BubbleChatConfiguration, y compris :

• ImageLabel pour les paramètres de l'image de fond.
• UIGradient pour les paramètres de dégradé de fond.
• UICorner pour la forme des coins des bulles.
• UIPadding pour l'espace d'amortissement entre le texte et les bords de la bulle, par rapport à la taille normale du parent.

Après avoir ajouté ces objets, vous pouvez modifier les propriétés de ces objets applicables aux bulles de chat pour une personnalisation avancée des bulles. L'exemple suivant LocalScript ajoute une image de fond et des coins aigus aux bulles :

Personnalisation Avancée des Bulles
local TextChatService = game:GetService("TextChatService")

local bubbleChatConfiguration = TextChatService.BubbleChatConfiguration
bubbleChatConfiguration.TailVisible = false
bubbleChatConfiguration.TextColor3 = Color3.fromRGB(220, 50, 50)
bubbleChatConfiguration.FontFace = Font.fromEnum(Enum.Font.LuckiestGuy)

local bubbleUICorner = bubbleChatConfiguration:FindFirstChildOfClass("UICorner")
if not bubbleUICorner then
	bubbleUICorner = Instance.new("UICorner")
	bubbleUICorner.Parent = bubbleChatConfiguration
end
bubbleUICorner.CornerRadius = UDim.new(0, 0)

local bubbleUIPadding = bubbleChatConfiguration:FindFirstChildOfClass("UIPadding")
if not bubbleUIPadding then
	bubbleUIPadding = Instance.new("UIPadding")
	bubbleUIPadding.Parent = bubbleChatConfiguration
end
bubbleUIPadding.PaddingTop = UDim.new(0, 20)
bubbleUIPadding.PaddingRight = UDim.new(0, 10)
bubbleUIPadding.PaddingBottom = UDim.new(0, 15)
bubbleUIPadding.PaddingLeft = UDim.new(0, 10)

local bubbleImageLabel = bubbleChatConfiguration:FindFirstChildOfClass("ImageLabel")
if not bubbleImageLabel then
	bubbleImageLabel = Instance.new("ImageLabel")
	bubbleImageLabel.Parent = bubbleChatConfiguration
end
bubbleImageLabel.Image = "rbxassetid://109157529833093"
bubbleImageLabel.ScaleType = Enum.ScaleType.Slice
bubbleImageLabel.SliceCenter = Rect.new(40, 40, 320, 120)
bubbleImageLabel.SliceScale = 0.5

Les tableaux suivants décrivent les GuiObject disponibles et les enfants modificateurs d'apparence avec leurs propriétés de personnalisation valides :

Personnalisation par bulle

Vous pouvez styliser et modifier individuellement les comportements des bulles de chat en fonction de conditions spécifiques afin de remplacer vos paramètres généraux. Par exemple, vous pouvez utiliser des bulles de chat pour différencier les PNJ et les utilisateurs, mettre en évidence un état de santé critique, et appliquer des effets spéciaux aux messages contenant des mots-clés prédéfinis.

Pour définir une personnalisation par bulle, ajoutez un LocalScript côté client utilisant BubbleChatMessageProperties, qui remplace les propriétés correspondantes de BubbleChatConfiguration, et le rappel TextChatService.OnBubbleAdded pour spécifier comment personnaliser chaque bulle. Le rappel fournit la propriété TextChatMessage ainsi que l'adoré, ce qui vous permet d'appliquer la personnalisation en fonction des attributs associés aux utilisateurs, au contenu du texte de chat, aux propriétés des personnages des utilisateurs, et à toutes les conditions spéciales que vous souhaitez définir.

Les propriétés de personnalisation de base suivantes sont disponibles pour la personnalisation par bulle :

L'exemple suivant ajoute une apparence spéciale aux bulles de chat des utilisateurs VIP en vérifiant si l'expéditeur d'un message de chat possède l'attribut IsVIP :

Bulles VIP
local TextChatService = game:GetService("TextChatService")
local Players = game:GetService("Players")

-- Gestionnaire d'événements pour lorsqu'une nouvelle bulle de chat est ajoutée au jeu
TextChatService.OnBubbleAdded = function(message: TextChatMessage, adornee: Instance)
	-- Vérifiez si le message de chat a une TextSource (expéditeur) associée
	if message.TextSource then
		-- Créez une nouvelle instance de BubbleChatMessageProperties pour personnaliser la bulle de chat
		local bubbleProperties = Instance.new("BubbleChatMessageProperties")

		-- Obtenez l'utilisateur qui a envoyé le message de chat en fonction de son UserId
		local player = Players:GetPlayerByUserId(message.TextSource.UserId)

		if player:GetAttribute("IsVIP") then
			-- Si le joueur est un VIP, personnalisez les propriétés de la bulle de chat
			bubbleProperties.TextColor3 = Color3.fromHex("#F5CD30")
			bubbleProperties.BackgroundColor3 = Color3.fromRGB(25, 27, 29)
			bubbleProperties.FontFace = Font.fromEnum(Enum.Font.PermanentMarker)
		end
		return bubbleProperties
	end
end

Toutes les options de personnalisation avancées sont disponibles pour la personnalisation par bulle. Tout comme pour la personnalisation avancée des bulles générales, ajoutez les instances que vous souhaitez personnaliser en tant qu'enfants de BubbleChatMessageProperties. L'exemple suivant ajoute un effet de dégradé spécial avec d'autres propriétés aux bulles de chat des utilisateurs ayant un faible état de santé en vérifiant la propriété Humanoid.Health des personnages des expéditeurs des messages de chat :

Bulles de Faible Santé
local TextChatService = game:GetService("TextChatService")
local Players = game:GetService("Players")

-- Gestionnaire d'événements pour lorsqu'une nouvelle bulle de chat est ajoutée au jeu
TextChatService.OnBubbleAdded = function(message: TextChatMessage, adornee: Instance)
	-- Vérifiez si le message de chat a une TextSource (expéditeur) associée
	if message.TextSource then
		-- Obtenez l'utilisateur qui a envoyé le message de chat en utilisant son UserId
		local player = Players:GetPlayerByUserId(message.TextSource.UserId)

		-- Trouvez le humanoïde dans le personnage de l'utilisateur
		local humanoid = player.Character:FindFirstChildWhichIsA("Humanoid")

		if humanoid and humanoid.Health < 25 then
			-- Créez une nouvelle instance de BubbleChatMessageProperties pour personnaliser la bulle de chat
			local bubbleProperties :BubbleChatMessageProperties = Instance.new("BubbleChatMessageProperties")

			-- Personnalisez les propriétés de la bulle de chat pour la condition de faible santé
			bubbleProperties.BackgroundColor3 = Color3.fromRGB(245, 245, 245)
			bubbleProperties.TextColor3 = Color3.fromRGB(234, 51, 96)
			bubbleProperties.TextSize = 20
			bubbleProperties.FontFace = Font.fromEnum(Enum.Font.DenkOne)

			-- Ajoutez un UIGradient en tant qu'enfant pour personnaliser le dégradé
			local uiGradient : UIGradient = Instance.new("UIGradient")
			uiGradient.Color = ColorSequence.new(Color3.fromRGB(110, 4, 0), Color3.fromRGB(0, 0, 0))
			uiGradient.Rotation = 90
			uiGradient.Parent = bubbleProperties

			return bubbleProperties
		end
	end
end

Afficher manuellement des bulles

Vous pourriez vouloir afficher une bulle de chat lorsque les joueurs n'ont pas envoyé de message, comme avec des PNJ. Utilisez la méthode TextChatService:DisplayBubble() pour afficher manuellement une bulle de chat.

La personnalisation de ces bulles est la même que celle des bulles qui sont affichées automatiquement lorsque les joueurs envoient des messages via TextChannels en utilisant le rappel TextChatService.OnBubbleAdded.

Bulles des PNJ

Affichez des bulles de chat pour les personnages non-joueurs (PNJ) en appelant TextChatService:DisplayBubble(character, message), en utilisant le personnage PNJ et le message comme paramètres. Ces bulles sont personnalisables en utilisant le rappel TextChatService.OnBubbleAdded comme n'importe quelle autre bulle de chat.

TextChatService:DisplayBubble() ne fonctionne que sur des scripts côté client, donc assurez-vous d'utiliser un Script avec RunContext réglé sur Enum.RunContext.Client, ou un LocalScript dans un conteneur approprié, tel que StarterPlayerScripts. Si vous attachez un ProximityPrompt à un PNJ, un script pour afficher une bulle de chat pourrait ressembler à ceci :

local TextChatService = game:GetService("TextChatService")
local Workspace = game:GetService("Workspace")

local prompt = Workspace.SomeNPC.ProximityPrompt
local head = prompt.Parent:WaitForChild("Head")

prompt.Triggered:Connect(function()
	TextChatService:DisplayBubble(head, "Bonjour le monde !")
end)