Personnaliser la fenêtre de chat

*Ce contenu est traduit en utilisant l'IA (Beta) et peut contenir des erreurs. Pour consulter cette page en anglais, clique ici.

Le chat textuel en jeu est un système, propulsé par TextChatService, qui permet aux joueurs de communiquer et de socialiser facilement entre eux dans des jeux en direct. En plus de prendre en charge le chat textuel par défaut, vous pouvez personnaliser l'interface utilisateur frontale.

Configuration de la fenêtre de chat

La fenêtre de chat globale se compose de :

  • Fenêtre de chat
  • Barre de saisie
  • Onglets de canal (optionnels)
Composants principaux de la fenêtre de chat textuel.

Les onglets de canal sont désactivés par défaut et chaque composant peut être activé ou désactivé dans Studio ou via un script :

Dans la fenêtre Explorer, développez la branche TextChatService et sélectionnez ChatWindowConfiguration, ChatInputBarConfiguration ou ChannelTabsConfiguration. Ensuite, activez ou désactivez le composant dans la fenêtre Propriétés.

Lorsque ChannelTabsConfiguration est activé, chaque TextChannel par défaut apparaît dans un onglet comme décrit dans le tableau suivant. De plus, chaque TextChannel personnalisé crée un onglet correspondant à la propriété Name du canal.

Canal par défautNom de l'onglet
RBXGeneralGénéral
RBXSystemGénéral (combiné en un seul onglet avec RBXGeneral)
RBXTeamÉquipe
RBXWhisperNom d'utilisateur de l'autre joueur

Apparence de la fenêtre

L'apparence de la fenêtre de chat globale est personnalisable via ChatWindowConfiguration.

Instance ChatWindowConfiguration dans la hiérarchie de l'Explorateur.
PropriétéDescriptionPar défaut
BackgroundColor3Color3 couleur de fond de la fenêtre de chat.[25, 27, 29]
BackgroundTransparencyTransparence de l'arrière-plan de la fenêtre de chat.0.3
EnabledPermet de montrer la fenêtre de chat par défaut. Réglez sur false pour cacher.true
FontFaceFont du texte de la fenêtre de chat.BuilderSansMedium
TextColor3Color3 du texte de la fenêtre de chat.[255, 255, 255]
TextSizeTaille du texte de la fenêtre de chat.14
TextStrokeColor3Color3 du contour du texte de la fenêtre de chat.[0, 0, 0]
TextStrokeTransparencyTransparence du contour du texte de la fenêtre de chat.0.5
HorizontalAlignmentAlignement horizontal de la fenêtre de chat.Left
VerticalAlignmentAlignement vertical de la fenêtre de chat.Top
HeightScaleÉchelle de hauteur de la fenêtre de chat par rapport à la taille de l'écran.1
WidthScaleÉchelle de largeur de la fenêtre de chat par rapport à la taille de l'écran.1

Apparence de la barre de saisie

L'apparence de la barre de saisie du chat est personnalisable via ChatInputBarConfiguration.

Instance ChatInputBarConfiguration dans la hiérarchie de l'Explorateur.
PropriétéDescriptionPar défaut
BackgroundColor3Color3 couleur de fond de la barre de saisie de chat.[25, 27, 29]
BackgroundTransparencyTransparence de l'arrière-plan de la barre de saisie de chat.0.2
FontFaceFont du texte de saisie de chat.BuilderSansMedium
PlaceholderColor3Color3 du texte de saisie de chat en tant que texte de remplacement.[178, 178, 178]
TextColor3Color3 du texte de saisie de chat entré par le joueur.[255, 255, 255]
TextSizeTaille du texte de saisie de chat.14
TextStrokeColor3Color3 couleur du contour du texte de saisie de chat.[0, 0, 0]
TextStrokeTransparencyTransparence du contour du texte de saisie de chat.0.5
AutocompleteEnabledIndique si le système de chat textuel montre des options d'autocomplétion pour les emojis et les commandes. Les emojis sont autocomplétés en tapant : suivi de caractères non blancs, tandis que les commandes sont autocomplétées en tapant /.true
KeyboardKeyCodeTouches supplémentaires que les joueurs peuvent appuyer pour déclencher le focus sur la barre de saisie de chat par défaut.Slash

Apparence des onglets de canal

L'apparence des onglets de canal est personnalisable via ChannelTabsConfiguration.

Instance ChannelTabsConfiguration dans la hiérarchie de l'Explorateur.
PropriétéDescriptionPar défaut
BackgroundColor3Color3 couleur de fond des onglets de canal.[25, 27, 29]
BackgroundTransparencyTransparence de l'arrière-plan des onglets de canal.0
HoverBackgroundColor3Color3 couleur de fond des onglets lorsqu'on passe la souris dessus.[125, 125, 125]
FontFaceFont pour le texte dans les onglets de canal.BuilderSansBold
TextColor3Color3 du texte dans un onglet non sélectionné.[175, 175, 175]
SelectedTabTextColor3Color3 du texte dans un onglet sélectionné.[255, 255, 255]
TextSizeTaille du texte dans les onglets de canal.18
TextStrokeColor3Color3 couleur du contour du texte dans les onglets de canal.[0, 0, 0]
TextStrokeTransparencyTransparence du contour du texte dans les onglets de canal.1

Personnaliser les messages

Vous pouvez personnaliser l'apparence des corps de messages de chat et des préfixes à l'aide de ChatWindowMessageProperties et de TextChatService.OnChatWindowAdded sans remplacer l'interface utilisateur existante. Les options de personnalisation vous permettent de modifier l'apparence des messages de chat pour s'accorder au thème de votre jeu, et vous pouvez également trier ou surligner les messages de différents groupes d'utilisateurs en colorant les préfixes ou en ajoutant des tags de chat.

Colorer les noms d'utilisateur

Lorsque qu'un utilisateur envoie un message de chat, son DisplayName est affiché en tant que préfixe du message. Par défaut, le nom de chaque utilisateur est coloré selon leur Player.TeamColor, mais vous pouvez changer les couleurs des noms de chat à l'aide de ChatWindowMessageProperties et OnChatWindowAdded. Le LocalScript suivant dans StarterPlayerScripts attribue une couleur prédéterminée à chaque utilisateur, choisie aléatoirement dans un tableau de couleurs RGB.

Nom d'utilisateur coloré dans la fenêtre de chat.
LocalScript - Couleurs de noms d'utilisateur aléatoires

local TextChatService = game:GetService("TextChatService")
local chatWindowConfiguration = TextChatService.ChatWindowConfiguration
local nameColors = {
Color3.fromRGB(255, 0, 0),
Color3.fromRGB(0, 255, 0),
Color3.fromRGB(0, 0, 255),
Color3.fromRGB(255, 255, 0),
}
TextChatService.OnChatWindowAdded = function(message: TextChatMessage)
local properties = chatWindowConfiguration:DeriveNewMessageProperties()
local textSource = message.TextSource
if textSource then
local index: number = (textSource.UserId % #nameColors) + 1
local randomColor: Color3 = nameColors[index]
properties.PrefixTextProperties = chatWindowConfiguration:DeriveNewMessageProperties()
properties.PrefixTextProperties.TextColor3 = randomColor
end
return properties
end

Vous pouvez également appliquer des dégradés de couleur et de transparence aux préfixes des messages à l'aide de UIGradient.

Nom d'utilisateur en dégradé dans la fenêtre de chat.
Couleurs de noms d'utilisateur en dégradé

local TextChatService = game:GetService("TextChatService")
local chatWindowConfiguration = TextChatService.ChatWindowConfiguration
local gradient = Instance.new("UIGradient")
gradient.Color = ColorSequence.new{
ColorSequenceKeypoint.new(0, Color3.fromRGB(255, 0, 0)),
ColorSequenceKeypoint.new(0.5, Color3.fromRGB(255, 255, 0)),
ColorSequenceKeypoint.new(1, Color3.fromRGB(255, 0, 255))
}
TextChatService.OnChatWindowAdded = function(message: TextChatMessage)
local properties = chatWindowConfiguration:DeriveNewMessageProperties()
local textSource = message.TextSource
if textSource then
properties.PrefixTextProperties = chatWindowConfiguration:DeriveNewMessageProperties()
gradient:Clone().Parent = properties.PrefixTextProperties
end
return properties
end

Personnalisation du texte enrichi

Les balises de couleur de police en texte enrichi peuvent être utilisées pour formater les messages de chat, ce qui est utile si vous souhaitez appliquer un formatage à des parties très spécifiques du message. Notez que le texte enrichi ne prend pas en charge les dégradés, mais l'exemple de code suivant montre comment vous pouvez déplacer le nom d'utilisateur (stocké dans TextChatMessage.PrefixText) dans le corps du message, puis appliquer des balises de texte enrichi uniquement à la portion du nom.

Personnalisation du texte enrichi du nom d'utilisateur dans la fenêtre de chat.
Personnalisation du texte enrichi

local TextChatService = game:GetService("TextChatService")
local Players = game:GetService("Players")
local chatWindowConfiguration = TextChatService.ChatWindowConfiguration
local gradient = Instance.new("UIGradient")
gradient.Color = ColorSequence.new{
ColorSequenceKeypoint.new(0, Color3.fromRGB(255, 0, 0)),
ColorSequenceKeypoint.new(0.5, Color3.fromRGB(255, 255, 0)),
ColorSequenceKeypoint.new(1, Color3.fromRGB(255, 0, 255))
}
TextChatService.OnChatWindowAdded = function(message: TextChatMessage)
local properties = chatWindowConfiguration:DeriveNewMessageProperties()
if message.TextSource then
properties.PrefixText = "[VIP]"
properties.Text = string.format("<font color='#00ffff'>%s</font>", message.PrefixText) .. " " .. message.Text
properties.PrefixTextProperties = chatWindowConfiguration:DeriveNewMessageProperties()
gradient:Clone().Parent = properties.PrefixTextProperties
end
return properties
end

Messages de sources non-joueurs

Lorsque TextChatService.CreateDefaultTextChannels est true, l'un des canaux de texte par défaut est le canal RBXSystem. Les scripts de chat par défaut affichent automatiquement les messages système dans ce canal. Vous pouvez personnaliser l'apparence de ces messages en utilisant le callback TextChannel.OnIncomingMessage.

Vous pourriez vouloir personnaliser ou modifier les messages système qui sont automatiquement émis par le système de chat. Étant donné que les messages système par défaut sont localisés pour les utilisateurs, vous devriez vous y référer par TextChatMessage.Metadata dans vos callbacks de chat textuel si vous souhaitez personnaliser leur apparence. Par exemple, vous pouvez utiliser Metadata pour identifier les messages système, les messages d'erreur ou les messages de systèmes spécifiques dans votre jeu.

Système

Pour envoyer un message système au joueur local, tel que "discours" d'un système de sonorisation, appelez DisplaySystemMessage() depuis le canal par défaut RBXGeneral avec un préfixe avant le nom d'affichage du joueur.

Script Client

local Players = game:GetService("Players")
local TextChatService = game:GetService("TextChatService")
local player = Players.LocalPlayer
local generalChannel: TextChannel = TextChatService:WaitForChild("TextChannels").RBXGeneral
local PREFIX = "[Guide] Bienvenue "
-- Envoyer "message système" au joueur avec leur nom d'affichage ajouté
generalChannel:DisplaySystemMessage(PREFIX .. player.DisplayName)
Image montrant un message système basique dans la fenêtre de chat.

NPC/objet

Vous pouvez également styliser le dialogue non-joueur et ajouter des bulles de chat pour faire apparaître les messages comme provenant d'un NPC ou d'un objet dans le monde 3D.

Script Client

local TextChatService = game:GetService("TextChatService")
local Workspace = game:GetService("Workspace")
local generalChannel: TextChannel = TextChatService:WaitForChild("TextChannels").RBXGeneral
TextChatService.OnIncomingMessage = function(textChatMessage: TextChatMessage)
local properties = Instance.new("TextChatMessageProperties")
-- Vérifier les messages système qui contiennent des métadonnées
if not textChatMessage.TextSource and textChatMessage.Metadata ~= "" then
-- Ajouter un préfixe pour faire en sorte que le message ressemble à s'il provenait d'un joueur
properties.PrefixText = string.format("<font color='#%s'>%s: </font>", "#50C999", textChatMessage.Metadata)
-- Ajouter une bulle de chat
TextChatService:DisplayBubble(Workspace.Statue, textChatMessage.Text)
end
return properties
end
local message = "Bienvenue! Je serai votre guide."
local speakerName = "Chevalier Ancien"
generalChannel:DisplaySystemMessage(message, speakerName)
Image montrant une statue de chevalier NPC diffusant un message de chat dans la fenêtre de chat, avec une bulle de chat au-dessus de sa tête.
©2026 Société Roblox. Roblox, le logo Roblox et Powering Imagination font partie de nos marques déposées aux États-Unis et dans d'autres pays.