Personaliza la ventana de chat

*Este contenido se traduce usando la IA (Beta) y puede contener errores. Para ver esta página en inglés, haz clic en aquí.

El sistema de chat de texto en el juego, impulsado por TextChatService, permite a los jugadores comunicarse y socializar fácilmente entre sí en juegos en vivo. Además de soportar el chat de texto predeterminado, puedes personalizar la interfaz de usuario del front‑end.

Configuración de la ventana de chat

La ventana de chat general consiste en:

  • Ventana de chat
  • Barra de entrada
  • Pestañas de canal (opcional)
Componentes principales de la ventana de chat de texto.

Las pestañas de canal están deshabilitadas por defecto y cada componente puede ser activado y desactivado en Studio o a través de scripting:

En la ventana de Explorer, expande la rama TextChatService y selecciona ChatWindowConfiguration, ChatInputBarConfiguration o ChannelTabsConfiguration. Luego habilita o deshabilita el componente en la ventana de Properties.

Cuando ChannelTabsConfiguration está habilitado, cada TextChannel predeterminado aparece en una pestaña como se detalla en la siguiente tabla. Además, cada TextChannel personalizado crea una pestaña correspondiente a la propiedad Name del canal.

Canal predeterminadoNombre de pestaña
RBXGeneralGeneral
RBXSystemGeneral (combinado en una sola pestaña con RBXGeneral)
RBXTeamEquipo
RBXWhisperNombre de usuario del otro jugador

Apariencia de la ventana

La apariencia de la ventana de chat general es personalizable a través de ChatWindowConfiguration.

Instancia de ChatWindowConfiguration en la jerarquía de Explorer.
PropiedadDescripciónPredeterminado
BackgroundColor3Color de fondo Color3 de la ventana de chat.[25, 27, 29]
BackgroundTransparencyTransparencia del fondo de la ventana de chat.0.3
EnabledSi mostrar la ventana de chat predeterminada. Establecer en false para ocultar.true
FontFaceFont del texto de la ventana de chat.BuilderSansMedium
TextColor3Color3 del texto de la ventana de chat.[255, 255, 255]
TextSizeTamaño del texto de la ventana de chat.14
TextStrokeColor3Color3 del trazo para el texto de la ventana de chat.[0, 0, 0]
TextStrokeTransparencyTransparencia del trazo para el texto de la ventana de chat.0.5
HorizontalAlignmentAlineación horizontal de la ventana de chat.Left
VerticalAlignmentAlineación vertical de la ventana de chat.Top
HeightScaleEscala de altura de la ventana de chat en relación al tamaño de la pantalla.1
WidthScaleEscala de ancho de la ventana de chat en relación al tamaño de la pantalla.1

Apariencia de la barra de entrada

La apariencia de la barra de entrada de chat es personalizable a través de ChatInputBarConfiguration.

Instancia de ChatInputBarConfiguration en la jerarquía de Explorer.
PropiedadDescripciónPredeterminado
BackgroundColor3Color de fondo Color3 de la barra de entrada de chat.[25, 27, 29]
BackgroundTransparencyTransparencia del fondo de la barra de entrada de chat.0.2
FontFaceFont del texto de entrada de chat.BuilderSansMedium
PlaceholderColor3Color3 del texto de entrada de chat como marcador de posición.[178, 178, 178]
TextColor3Color3 del texto de entrada de chat ingresado por el jugador.[255, 255, 255]
TextSizeTamaño del texto de entrada de chat.14
TextStrokeColor3Color3 del color del trazo del texto de entrada de chat.[0, 0, 0]
TextStrokeTransparencyTransparencia del trazo para el texto de entrada de chat.0.5
AutocompleteEnabledSi el sistema de chat de texto muestra opciones de autocompletar para emojis y comandos. Los emojis se autocompletan al escribir : seguido de caracteres que no son espacios en blanco, mientras que los comandos se autocompletan al escribir /.true
KeyboardKeyCodeTecla adicional que los jugadores pueden presionar para activar el enfoque en la barra de entrada de chat predeterminada.Slash

Apariencia de las pestañas de canal

La apariencia de las pestañas de canal es personalizable a través de ChannelTabsConfiguration.

Instancia de ChannelTabsConfiguration en la jerarquía de Explorer.
PropiedadDescripciónPredeterminado
BackgroundColor3Color de fondo Color3 de las pestañas de canal.[25, 27, 29]
BackgroundTransparencyTransparencia del fondo de las pestañas de canal.0
HoverBackgroundColor3Color de fondo Color3 de las pestañas al pasar el cursor sobre ellas.[125, 125, 125]
FontFaceFont para el texto en las pestañas de canal.BuilderSansBold
TextColor3Color3 del texto en una pestaña no seleccionada.[175, 175, 175]
SelectedTabTextColor3Color3 del texto en una pestaña seleccionada.[255, 255, 255]
TextSizeTamaño del texto en las pestañas de canal.18
TextStrokeColor3Color3 del color del trazo del texto en las pestañas de canal.[0, 0, 0]
TextStrokeTransparencyTransparencia del trazo para el texto en las pestañas de canal.1

Personalizar mensajes

Puedes personalizar la apariencia de los cuerpos de los mensajes de chat y los prefijos utilizando ChatWindowMessageProperties y TextChatService.OnChatWindowAdded callbacks sin sobreescribir la interfaz de usuario existente. Las opciones de personalización permiten modificar la apariencia de los mensajes de chat para que coincidan con el tema de tu juego, y también puedes ordenar o resaltar mensajes de diferentes grupos de usuarios coloreando los prefijos o agregando etiquetas de chat.

Colorear nombres de usuario

Cuando un usuario envía un mensaje de chat, su DisplayName se muestra como la parte del prefijo del mensaje. Por defecto, el nombre de cada usuario se colorea de acuerdo a su Player.TeamColor, pero puedes cambiar los colores de los nombres de chat utilizando ChatWindowMessageProperties y OnChatWindowAdded. El siguiente LocalScript en StarterPlayerScripts asigna un color predeterminado a cada usuario, eligiendo aleatoriamente de una tabla de colores RGB.

Nombre de usuario coloreado en la ventana de chat.
LocalScript - Colores Aleatorios de Nombres de Usuario

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

También puedes aplicar degradados de color y transparencia a los prefijos de mensaje utilizando UIGradient.

Nombre de usuario con degradado en la ventana de chat.
Colores de Nombres de Usuario con Degradado

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

Personalización de texto enriquecido

Las etiquetas de color de fuente de texto enriquecido pueden usarse para dar formato a los mensajes de chat, lo cual es útil si deseas aplicar formato a partes muy específicas del mensaje. Ten en cuenta que el texto enriquecido no soporta degradados, pero el siguiente ejemplo de código muestra cómo puedes mover el nombre de usuario (almacenado en TextChatMessage.PrefixText) al cuerpo del mensaje y luego aplicar etiquetas de texto enriquecido solo a la parte del nombre.

Personalización de texto enriquecido del nombre de usuario en la ventana de chat.
Personalización de Texto Enriquecido

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

Mensajes de fuentes no jugadores

Cuando TextChatService.CreateDefaultTextChannels es true, uno de los canales de texto predeterminados es el canal RBXSystem. Los scripts de chat predeterminados muestran automáticamente los mensajes del sistema en este canal. Puedes personalizar la apariencia de estos mensajes utilizando el callback TextChannel.OnIncomingMessage.

Es posible que desees personalizar o alterar los mensajes del sistema que son emitidos automáticamente por el sistema de chat. Dado que los mensajes del sistema predeterminados están localizados para los usuarios, deberías hacer referencia a ellos a través de TextChatMessage.Metadata en tus callbacks del chat de texto si deseas personalizar su apariencia. Por ejemplo, podrías utilizar Metadata para identificar mensajes del sistema, mensajes de error, o mensajes de sistemas específicos en tu juego.

Sistema

Para entregar un mensaje del sistema al jugador local, como "discurso" de un sistema de megafonía, llama a DisplaySystemMessage() desde el canal RBXGeneral predeterminado con un prefijo antes del nombre que se muestra del jugador.

Script Cliente

local Players = game:GetService("Players")
local TextChatService = game:GetService("TextChatService")
local player = Players.LocalPlayer
local generalChannel: TextChannel = TextChatService:WaitForChild("TextChannels").RBXGeneral
local PREFIX = "[Guía] Bienvenido "
-- Enviar "mensaje del sistema" al jugador con su nombre de pantalla agregado
generalChannel:DisplaySystemMessage(PREFIX .. player.DisplayName)
Imagen que muestra un mensaje del sistema básico en la ventana de chat.

NPC/objeto

También puedes estilizar diálogos de no jugadores y agregar burbujas de chat para hacer que parezca que los mensajes provienen de un NPC u objeto dentro del mundo 3D.

Script Cliente

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")
-- Verificar si son mensajes del sistema que contienen metadatos
if not textChatMessage.TextSource and textChatMessage.Metadata ~= "" then
-- Agregar prefijo para hacer que el mensaje parezca enviado por un jugador
properties.PrefixText = string.format("<font color='#%s'>%s: </font>", "#50C999", textChatMessage.Metadata)
-- Agregar burbuja de chat
TextChatService:DisplayBubble(Workspace.Statue, textChatMessage.Text)
end
return properties
end
local message = "¡Bienvenido! Seré tu guía."
local speakerName = "Caballero Antiguo"
generalChannel:DisplaySystemMessage(message, speakerName)
Imagen que muestra a una estatua de caballero NPC transmitiendo un mensaje de chat a la ventana de chat, junto con una burbuja de chat sobre su cabeza.
©2026 Roblox Corporation. Roblox, el logotipo de Roblox y "Powering Imagination" son algunas de nuestras marcas registradas y no registradas en los Estados Unidos y otros países.