[Unity] SIMPLE way to add Text Chat to your Multiplayer Game

Video Statistics and Information

Video
Captions Word Cloud
Reddit Comments
Captions
hey guys today i'm going to be doing a tutorial on how to add a very simple chat system to your game um this will allow you to add multiplayer chat and give you quite a lot of control over what the output looks like as well as not requiring any sort of um additional plug-in other than what your existing networking already does so you're going to be handling everything yourself so for this scene i've got a very simple um scene set up this is just an example scene i have a text mesh pro text field which i've changed to be a scroll rate so you need to make sure your overflow is set to a scroll rect i have a simple text mess pro input field um and i have a just a regular button so this is a very simple setup obviously your game is probably going to be a lot different and a lot better than this but for the purposes of this tutorial this is just going to be showing you how to create a blank like a very simple system so what we're going to do first of all is we're going to create a new c-sharp script i'm going to put going to call this chat manager so we're going to go into our chat manager script and we're going to declare a few variables so get rid of the comments i'm going to create the following variables [Applause] now of course we're missing the dependency here so i'm going to go alt enter we also have the chat contents and now we're going to declare some private variables which we're going to be using again because i'm using photon for this example um i'm going to be adding a photon view component if you're using some other sort of networking the only thing that we're really going to need is the rpc functionality so if you know what you're doing with networking you should know what that means otherwise again if you're using photo you can pretty much copy this exact implementation and of course we need to add the dependency um so we've just got the chat import chat content the photon view we're also going to create a list of strings and this is how we're going to be storing our messages very simple like 95 percent of cases you're really not going to need more than this especially if you're just adding like a simple chat into your game and we're going to add a field delay and maximum messages okay so this is all we're going to need for this simple example um [Applause] and so i'm going to make sure we get our photon view as well so now we're going to create a few functions the first one is going to be the rpc which just adds a message to the list of strings that we've created here so extremely simple as you can see this rpc will be called over the network and just adds the message that you give it to all players list of messages on top of that we're going to create three more functions the first one we're going to create is the sendchat function which is going to send a specific message [Applause] now for this function because i'm using the photon network i'm automatically going to be getting a user's name um using the photon network infrastructure if you're not using photon you just have to pass in the player name i'm in however way you're getting the plane name but for this example we'll be using photon network dot nickname alrighty so very simple as you can see we pass in a message that we want to send we add the player's nickname and then we pass it into all players so they they all add that message to their list of strings um the next function we're going to create is a submit chat one which will basically take the context of the input and then send that as a message so for this one because we're handling a player input we're going to do a few checks that simply just make sure that the player isn't trying to send a blank message or just like empty spaces it's a good way to get around some of the most common ways that people trying to exploit this system so we're going to create um we're going to use regular expressions for this so if you're not familiar with the regular expressions this might be a bit foreign to you but this is what you want to do we need to make sure we add the dependency as well so essentially this is just going to look for anything that's got a space in it and replace it with blank and then it's going to check if there's any other value to the message if there's not any characters in the message other than the blank characters then it's just not going to try and send the message because there's no point so every time you send the message obviously you're going to want to clear the chat field um even if you try and send a message that's nothing but blank you you want to be clearing the chat field and for this example as well we're also going to activate the input field just because it makes that a little bit nicer when you when you're trying to type multiple messages all right and again i'm going to activate the input field and empty it so very simple just check if it's blank if it is blank then don't send the message if it's not blank send the message and either way we're clearing out the input field and setting it to blank to last the last thing that we need to do in terms of adding new functions is to create a function that builds the chat contents so what this means is essentially taking this list of messages and turning it into something that can be displayed in the chat content field so we're going to create a new string and then use a for each loop and we're just going to add it to that string this of course being the new line character so for each string that we have in messages the contents of the message is the message and then a new line and then it will keep going on to the next message over and over again until we've got the contents and then simply set the contents to the new contents well you should probably set the text field and not the text mesh pro all right there we go um now we need to we do need to go over to our update function there is one more thing that needs to be done i know i said that we've done with all the functions um but we do need to actually be updating the chat contents so that we can actually see any time we get a new message so again for this example i'm using photon but you do not need to use photon for this next example you just need to make sure that your chat you know how to check that you're in a lobby or in a room or whatever whatever system your networking uses just need to make sure you're actually connected to the network so for this one else is so if we're not connected to the room we want to see if we have any messages and then just clear them um because there's no point showing messages from a separate room um or also we might as well clear the contents of the other chat as well so we'll clear the chat contents so this is where the maximum messages value comes into play and also the build delay you might be wondering what the build delay was for um it's essentially just going to give a slight delay on updating the messages so we're not updating every single frame which is when the update function is going to be called there's really no reason for it to be updating every frame it's just going to affect performance so first of all we're going to set the maximum visible lines on the chat content to the maximum messages the reason we do this is because the scroll rect will continue to overflow and it'll go off the screen if you don't set a maximum and it's also just easier on users memory as well so now so essentially what this does is if we've exceeded the maximum number of messages we're going to remove message index 0 which is going to be the oldest message so this essentially just make sure that we've got a sane amount of messages stored in memory and that we're always removing the oldest one at any given time and the final step alrighty and that is the entire chat manager um very simple if if the build delay is smaller than time or time we're going to update the chart contents and then wait another quarter of a second so that is the entire system very simple so let's show you how to set it up alrighty so back into unity we're going to create a new object and we'll call it chat manager and we're going to add the chat manager script to it now as you can see we've got a few fields that need to be set we want the chat input which is going to be an input field so we'll put chat message in there and then the chat contents drag that over now for this example we've got a button we're also going to need to add an on click function to the button there are easier ways if you handle like an enter press for example you can submit the chat that way but for this example keeping it extremely simple so drag over the chat manager and assign the submit chat function which is going to submit the chat based on the chat message and one thing i've also forgot to add is for this example because we're using photon we're going to need to add a platform view as well alrighty so now let's press play and see what happens as you can see it's cleared the contents of the chat type hello and there we go example player 249 says hello and if we type a lot of messages you can see that once we hit the limit it's going to remove them alrighty and we'll just build this project up just to make sure that it's actually working test one and we can see we have a chat room now one of the cool things about this particular system as well although you do need to be careful with it is that because it's text mesh pro you can pass in tags like if i want to do color for example you can see that it automatically handles colors and this is a great way as well to handle like player names for example you can set player names to a certain color or if you have a color system in your game you can set each player's name in the chat to their own specific color the one thing you do need to be careful of though is handling certain tags like for example you're actually able to set the size in the current system so if you set the size you can see there are some undesirable settings so you need to make sure you handle that but as far as a simple chat system there you go
Info
Channel: lamp-dog
Views: 1,134
Rating: undefined out of 5
Keywords: unity, chat, multiplayer, online, photon, photon networking, pun, c#, tutorial, text chat, game development, game dev, unity engine, how to
Id: xDWpOtvE9q0
Channel Id: undefined
Length: 15min 18sec (918 seconds)
Published: Wed May 12 2021
Related Videos
Note
Please note that this website is currently a work in progress! Lots of interesting data and statistics to come.