TextChatService で、バブルチャットを使用して、ユーザーアバターと NPC の上にカスタマイズ可能なスピークチャットバブルを表示できます。バブルチャットは、エクスペリエンスをより視覚的に没入させ、ユーザーがコンテキストに関連する方法でメッセージとスピーカーを簡単に識別できるようにすることができます。この機能は、ユーザーがコンテンツに集中しながら他の人とのコミュニケーションを少なく目立たない方法で行う必要がある経験に特に役立ちます。
バブルチャットを有効にする
エクスペリエンスでバブルチャットを有効にするには：
エクスプローラー ウィンドウで の下に を選択します。
In the プロパティ window, check the BubbleChatConfiguration.Enabled checkbox.
バブルのカスタマイズ
バブルチャットを有効にした後、チャットバブルの外観と動作をカスタマイズして、エクスペリエンステーマに合わせることができます。 プロパティ ウィンドウを使用して、テキストの色とスペースなどの基本的な変更、またはバブルの背景画像やその他の視覚調整のカスタマイズを 高度化 します。
代わりに、すべてのカスタマイズ設定を含む LocalScript を StarterPlayerScripts に追加します。これにより、エンジンは実行時にカスタマイズを適用し、Studio の設定を上書きできます。ユーザーが特定のイベントまたは条件をトリガーすると、チャットバブルに特殊効果を追加するのに便利です。
基本的なカスタマイズ
次の表には、一般的なバブルチャットのカスタマイズプロパティが示されています。カスタマイズプロパティの完全なリストについては、BubbleChatConfigurationを参照してください。
| 性質 | 説明 | デフォルト |
|---|---|---|
| BackgroundColor3 | バブルの背景色は Color3 です。 | [250, 250, 250] |
| FontFace | Font バブルテキストの。 | BuilderSansMedium |
| TextColor3 | バブルテキストの色在 Color3 。 | [57, 59, 61] |
| TextSize | バブルテキストのサイズ。 | 16 |
詳細なカスタマイズ
バブルの詳細なカスタマイズのために、バブルの外観の特定のアスペクトを子として BubbleChatConfiguration に含む UI オブジェクトを追加してください：
- ImageLabel 背景画像設定用。
- UIGradient 背景グラデーション設定用。
- UICorner バブルの角形状のため。
- UIPadding テキストとバブルの端の間のパッドスペース、親の通常のサイズに対して。
これらのオブジェクトを追加した後、チャットバブルに適用できるこれらのオブジェクトのプロパティを変更して、高度なバブルカスタマイズを行うことができます。次の例 LocalScript は、バブルに背景画像と鋭い角を追加します：
詳細なバブルカスタマイズ
次の表では、使用可能な GuiObject および 外観修正子 の子供たちと、それらの有効なカスタマイズプロパティを説明します：
| 性質 | 説明 | デフォルト |
|---|---|---|
| Image | バブル背景画像のアセットID。 | |
| ImageColor3 | バブル背景画像の色彩濁度は Color3 です。 | [255, 255, 255] |
| ImageRectOffset | ピクセルで左上から表示される画像領域のオフセット。 | (0, 0) |
| ImageRectSize | ピクセルで表示される画像領域のサイズ。全体の画像を表示するには、寸法を 0 に設定します。 | (0, 0) |
| ScaleType | サイズがバブルの絶対サイズと異なるときに画像をレンダリングするスケールタイプ。 | Stretch |
| SliceCenter | 画像が 9 スライス画像の場合、画像の境界をスライスする。ScaleType を Slice として設定した場合にのみ適用されます。 | (0, 0, 0, 0) |
| SliceScale | 画像が 9 スライス画像である場合のスライスエッジのスケール比率。ScaleType を Slice として設定した場合にのみ適用されます。 | 1 |
| TileSize | 画像のタイル化サイズ。ScaleType を Tile として設定した場合にのみ適用されます。 | (1, 0, 1, 0) |
バブルごとのカスタマイズ
一般設定をオーバーライドするために、特定の条件に基づいてチャットバブルの動作を個別にスタイル化し、修正できます。たとえば、チャットバブルを使用して、NPCとユーザーを区別し、重要な健康状状況を強調し、プリ定義されたキーワードを持つメッセージに特殊効果を適用できます。
バブルごとのカスタマイズを設定するには、LocalScript を使用してクライアント側に BubbleChatMessageProperties を追加し、BubbleChatConfiguration の一致するプロパティをオーバーライドし、TextChatService.OnBubbleAdded コールバックを使用して、各バブルをカスタマイズする方法を指定します。コールバックは、TextChatMessage プロパティと装飾を提供し、ユーザーに関連する属性、チャットテキストコンテンツ、ユーザーキャラクタープロパティ、および定義したい特別な条件を基にカスタマイズできます。
次の基本的なカスタマイズプロパティは、バブルごとのカスタマイズに利用可能です：
| 性質 | 説明 | デフォルト |
|---|---|---|
| BackgroundColor3 | バブルの背景色は Color3 です。 | (250, 250, 250) |
| BackgroundTransparency | バブルの背景透明度。 | 0.1 |
| FontFace | Font バブルテキストの。 | BuilderSansMedium |
| TextColor3 | バブルテキストの色在 Color3 。 | [57, 59, 61] |
| TextSize | バブルテキストのサイズ。 | 16 |
次の例では、チャットメッセージ送信者が IsVIP 属性を持っているかどうかをチェックして、VIPユーザーのチャットバブルに特別な外観を追加します：
VIPバブル
local TextChatService = game:GetService("TextChatService")
local Players = game:GetService("Players")
-- エクスペリエンスに新しいチャットバブルが追加されたときのイベントハンドラー
TextChatService.OnBubbleAdded = function(message: TextChatMessage, adornee: Instance)
-- チャットメッセージにテキストソース (送信者) が付属しているかどうかをチェック
if message.TextSource then
-- 新しい BubbleChatMessageProperties インスタンスを作成して、チャットバブルをカスタマイズ
local bubbleProperties = Instance.new("BubbleChatMessageProperties")
-- ユーザーがチャットメッセージを送信したユーザーをユーザーID に基づいて取得する
local player = Players:GetPlayerByUserId(message.TextSource.UserId)
if player:GetAttribute("IsVIP") then
-- プレイヤーが VIP の場合、チャットバブルのプロパティをカスタマイズする
bubbleProperties.TextColor3 = Color3.fromHex("#F5CD30")
bubbleProperties.BackgroundColor3 = Color3.fromRGB(25, 27, 29)
bubbleProperties.FontFace = Font.fromEnum(Enum.Font.PermanentMarker)
end
return bubbleProperties
end
end
すべての高度なカスタマイズオプションは、バブルごとのカスタマイズに利用可能です。一般的なバブルの詳細なカスタマイズと同様、BubbleChatMessageProperties の子としてカスタマイズしたいインスタンスを追加します。次の例では、ユーザーの健康状態が低いユーザーのチャットバブルに特別なグラデーション効果を追加し、チャットメッセージ送信者の Humanoid.Health プロパティをチェックして、ユーザーの健康状態を確認します：
低健康バブル
local TextChatService = game:GetService("TextChatService")
local Players = game:GetService("Players")
-- エクスペリエンスに新しいチャットバブルが追加されたときのイベントハンドラー
TextChatService.OnBubbleAdded = function(message: TextChatMessage, adornee: Instance)
-- チャットメッセージにテキストソース (送信者) が付属しているかどうかをチェック
if message.TextSource then
-- ユーザーがチャットメッセージを送信したユーザーを取得するには、そのユーザーIDを使用する
local player = Players:GetPlayerByUserId(message.TextSource.UserId)
-- ユーザーのキャラクターでヒューマノイドを見つける
local humanoid = player.Character:FindFirstChildWhichIsA("Humanoid")
if humanoid and humanoid.Health < 25 then
-- 新しい BubbleChatMessageProperties インスタンスを作成して、チャットバブルをカスタマイズ
local bubbleProperties :BubbleChatMessageProperties = Instance.new("BubbleChatMessageProperties")
-- 低い健康状態のためのチャットバブルプロパティのカスタマイズ
bubbleProperties.BackgroundColor3 = Color3.fromRGB(245, 245, 245)
bubbleProperties.TextColor3 = Color3.fromRGB(234, 51, 96)
bubbleProperties.TextSize = 20
bubbleProperties.FontFace = Font.fromEnum(Enum.Font.DenkOne)
-- 子として UIGradient を追加して、グラデーションをカスタマイズ
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
バブルを手動で表示する
プレイヤーがメッセージを送信していないときにチャットバブルを表示したい、例えば NPC とのやり取りです。TextChatService:DisplayBubble() メソッドを使用して、チャットバブルを手動で表示します。
これらのバブルのカスタマイズは、プレイヤーがテキストチャンネルを使用してメッセージを送信すると自動的に表示されるバブルのカスタマイズと同じです TextChatService.OnBubbleAdded コールバック 。
NPCバブル
非プレイヤーキャラクター (NPC) のチャットバブルを表示するには、TextChatService:DisplayBubble(character, message) を呼び出し、NPCキャラクターとメッセージをパラメータとして使用します。これらのバブルは、他のチャットバブルと同じように TextChatService.OnBubbleAdded コールバックを使用してカスタマイズできます。
TextChatService:DisplayBubble() はクライアント側のスクリプトでのみ機能しますので、Script を RunContext に設定して Enum.RunContext.Client 、または LocalScript を 適切なコンテナ で使用してください、などのように StarterPlayerScripts 。NPCにProximityPromptを付け加えると、チャットバブルを表示するスクリプトは次のようになります:
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, "Hello world!")
end)