How to make a animated typing screen

Help and Feedback Scripting Support
#1

So I want to make a thing where when people type something like this pops up:


And when they are done typing it goes away or if they stop typing for 5 seconds it goes away.
I read a bunch of post, but none helped me with this.

2 Likes
#2

Well firstly make a local script

#3

This does not help very much to just say make a local script.

1 Like
#4

And


local userInputService =game:GetService("UserInputService")

userInputService.InputBegan:Connect(function(input,gameProcessedEvent)
      if not gameProcessedEvent then
         -player is typing
      end
en
#5

Sorry it took me a little bit to do it

#6

Please only make 1 reply instead of multiple and make sure it is complete before posting. If it isn’t complete, you can always go back and edit.

1 Like
#7

If the player is typing, simply make a tag on their head

#8

K thanks, I’m new here so i will watch out for that

#9

You wont need to do this yourself shortly, Roblox is updating the chat and this is a new feature:

#10

I dont think this includes it to making a typing gui when they type.

1 Like
#11

A typing UI exists in that as shown in the second GIF, if you want one exactly as shown above you should be able to achieve it through tweening the size of the elements and making the visual images yourself for it.

1 Like
#12

In the second image they were zoomed out, not typing.

1 Like
#14

Apologies, you are correct.

In that case, you can either do it through the method above (this applies for any textboxes) or you could capture focus of any of the chat bar element in the Player UI itself aka:

TextBox = PlayerGui:WaitForChild("Chat"):WaitForChild("Frame"):WaitForChild("ChatBarParentFrame"):WaitForChild("Frame"):WaitForChild("BoxFrame"):WaitForChild("Frame"):WaitForChild("ChatBar")

TextBox.Focused:Connect(SendTyping)
#15

And last thing for the animated dots, it’s easy, put three dot pics and do this

I forgot to say, in the local script make a value when the player starts typing (true) and with player.Chatted(false)
And this is in the gui for the chat

local chatting = false 
local a = —first one
local b = —second one
local c = — third one
while chatting == true do
a:TweenSize(—code)
wait(1)
a:TweenSize(—back to normal)

b:TweenSize(—code)
wait(1)
b:TweenSize(—back to normal)

c:TweenSize(—code)
wait(1)
c:TweenSize(—back to normal)

end
#16

Thank you, this will help me a lot.

#17

That’s easy to adjust in the billboard gui

#18

Final result


local chatting = false 
local a = —first one
local b = —second one
local c = — third one

local userInputService =game:GetService("UserInputService")

userInputService.InputBegan:Connect(function(input,gameProcessedEvent)
      if not gameProcessedEvent then
     chatting = true
      end
end)


local Gui = —gui

local p = game.Players.LocalPlayer
p.Chatted:Connect(function()
chatting = false
Gui.Visible = false
end)

while chatting == true do
—make the gui visible
Gui.Visible = true 

a:TweenSize(—code)
wait(1)
a:TweenSize(—back to normal)

b:TweenSize(—code)
wait(1)
b:TweenSize(—back to normal)

c:TweenSize(—code)
wait(1)
c:TweenSize(—back to normal)

end
1 Like
#19

Where would I put this, and for it to work will there need to be a specific gui name

#20

So put this in a billboard gui (inserted in the player’s head) that represents the chat, and has the frame that is the local Gui And inside of it, the three dots, set the max distance of the gui to a 30, i think that’s good and yeah, make them get bigger with the
TweenSize
And yeah, you should be good

#21

I sent you a message with a problem of something that did not work, just because this thread is getting really long.