Personalizar la ventana de chat

El sistema de chat de texto en experiencia , impulsado por , permite que los jugadores se comuniquen y socialicen fácilmente entre sí en experiencias en vivo.Además de soportar el chat de texto predeterminado, puedes personalizar la interfaz de usuario frontal.

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)

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

En la ventana Explorador, expanda la rama TextChatService y seleccione ChatWindowConfiguration , ChatInputBarConfiguration o ChannelTabsConfiguration .Luego habilita o deshabilita el componente en la ventana Propiedades.

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

aspecto, lookde la ventana

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

aspecto, lookde la barra de entrada

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

aspecto, lookde las pestañas de canal

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

Personalizar mensajes

Puedes personalizar la apariencia de los cuerpos de mensajes de chat y los prefijos usando ChatWindowMessageProperties y TextChatService.OnChatWindowAdded llamadas de devolución sin anular la interfaz de usuario existente.Las opciones de personalización le permiten modificar la apariencia de los mensajes de chat para que coincida con el tema de su experiencia, y también puede ordenar o resaltar mensajes de diferentes grupos de usuarios coloreando prefijos o agregando etiquetas de chat.

Nombres de usuario de color

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 según su Player.TeamColor pero puedes cambiar los colores de los nombres de chat usando ChatWindowMessageProperties y OnChatWindowAdded .El siguiente LocalScript en StarterPlayerScripts asigna un color predeterminado a cada usuario, seleccionando aleatoriamente de una tabla de colores RGB.

LocalScript - Colores de nombre de usuario aleatorios
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 gradientes de color y transparencia a los prefijos de mensajes de color usando UIGradient.

Colores de nombre de usuario degradados
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 rico

Las etiquetas de color de fuente de texto rico se pueden usar para formatar mensajes de chat, útil si desea aplicar formato a partes muy específicas del mensaje.Tenga en cuenta que el texto enriquecido no admite gradientes, pero el siguiente ejemplo de código muestra cómo puede mover el nombre de usuario (almacenado en TextChatMessage.PrefixText) al cuerpo del mensaje y luego aplicar la etiqueta de texto enriquecido solo a la parte del nombre.

Personalización de texto rico
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

Enviar mensajes de fuentes no jugadoras

A veces, querrás mostrar diálogo no jugador en la ventana de chat, como "discurso" de un sistema de direcciones públicas o un personaje no jugador.

Sistema

Para enviar un mensaje del sistema al jugador local, llame a DisplaySystemMessage() desde el canal predeterminado RBXGeneral con un prefijo antes del nombre de visualización del jugador.

Script del cliente
local Players = game:GetService("Players")
local TextChatService = game:GetService("TextChatService")

local player = Players.LocalPlayer
local generalChannel: TextChannel = TextChatService:WaitForChild("TextChannels").RBXGeneral

local PREFIX = "[Guide] Welcome "

-- Enviar "mensaje del sistema" al jugador con su nombre de visualización añadido
generalChannel:DisplaySystemMessage(PREFIX .. player.DisplayName)

Para una guía más detallada sobre cómo personalizar la apariencia de los mensajes del sistema, vea Personalización de mensajes del sistema.

Mensajes del sistema predeterminados

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

Quizás quieras personalizar o modificar los mensajes del sistema que se emiten automáticamente por el sistema de chat.Dado que los mensajes del sistema predeterminados se localizan para los usuarios, deberías referenciarlo por TextChatMessage.Metadata en tus llamadas de chat de texto si deseas personalizar su aspecto, look.

A continuación se muestra una referencia de los mensajes del sistema predeterminados que emite el sistema de chat:

NPC/objeto

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

Script del 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")

	-- Compruebe los mensajes del sistema que contienen metadatos
	if not textChatMessage.TextSource and textChatMessage.Metadata ~= "" then

		-- Añade un prefijo para hacer que el mensaje parezca que fue enviado por un jugador
		properties.PrefixText = string.format("<font color='#%s'>%s: </font>", "#50C999", textChatMessage.Metadata)

		-- Añadir chat de burbujas
		TextChatService:DisplayBubble(Workspace.Statue, textChatMessage.Text)
	end

	return properties
end

local message = "Welcome! I will be your guide."
local speakerName = "Ancient Knight"
generalChannel:DisplaySystemMessage(message, speakerName)