Better Logs with Rich Text (Unity Tutorial)

If you're like me then you rely heavily on logs. I log everything and I do mean everything. When the player takes damage, when the player causes damage, when the player takes a potion; when the player mines some resources, when.. Wait... What's going on? I can't see, I can't see! I think I'm suffering from.... Scrolling blindness! I used to have 20/20 vision until I started logging. But that doesn't have to be you. In this video, I'm going to show you a simple technique to improve your development workflow by making your logs easier to read in the console. According to the Apache log4net manual, approximately 4% of code is dedicated to logging. Now that sounds like a lot of logs but honestly when I look back at the code that I've written it seems pretty accurate. At least for me. Now when you're using a robust logging tool like log4net you have the ability to toggle those logs on a class by class basis. But with unity you either get all or nothing. So it's actually pretty easy for your console window to fill up so much that it becomes a meaningless blob of text. But we can transform that text into something more meaningful with formatting. The logging methods on Unity's built in Debug class actually support rich text, which is similar to HTML in that you can wrap text with tags that will format it in the console. These tags include rendering text with boldface or italics, changing the size, and color. Which allows you to come up with some pretty unique styles that are much easier on the eyes when you're trying to scan the console for some meaningful data. So why don't we see if we can leverage this rich text to improve the logs that gave me that scrolling blindness. Maybe one day I'll be cured. So here's some example code that probably isn't indicative of anything you'd see in production but it'll be enough to serve for this tutorial. We can see it's got two methods, heal and damage, that both output some logs of the console. And of course I've got some simulation methods that are just gonna allow us to test this way easier from the editor. Speaking of which why don't we run these and see what they look like. I'm gonna switch to Unity and let's make our console a little bit bigger. And I'm also going to dock an Inspector window. That way we'll be able to very easily simulate our damage and healing. Beautiful. Well not really. I'm actually getting triggered by this and I'm feeling my scrolling blindness flaring up again. So what can we do to make this easier on the eyes? Well first of all it's super small. I'm looking at this thing on a 4K monitor and the text is incredibly tiny. So I think I'd like to increase the size. Next I'd like to be able to differentiate somehow between healing and damaging. An easy way to do that would be to use color. We can color the amount of health healed green and the amount of health damage red. Other than that we could probably build the damaged and healed text so it's easier to spot what action took place. And then finally I think I'll probably want to color the name of the player, that player one text. Just give it maybe like a blue color just to kind of separate it. So let's switch back to the editor and see what we can do. The first thing I said we'd do is increase the size. So let's wrap the whole thing in a size tag. Of course we're gonna need to close out the tag and you do that with a forward slash. And I think we should make this, I don't know, let's try 16 for now and see what that looks like. All right. That's a good start. We can switch right back to the editor. And go ahead and simulate our healing. All right. Looking good, it's bigger. I don't really like how this is being cut off here so maybe we can go a little bit bigger and see if we can get this text to take up the entire height of the row. Switch back and I'll give 22 a try. All right. OK. That's much better. I can see that very clearly. So next we can start differentiating between damage and health by coloring this amount. Switch back. This switching back and forth is going to get really annoying. So I think moving forward let's try the Unity console window inside of writer. Which funny enough doesn't actually support font size but it does support the other rich text tags so we'll still be able to use it. All right. So let's wrap this amount with a color tag. And we can go ahead and use green. Which is one of the many named colors that's built into the rich text tags. Test that... nice. So now we'll be able to differentiate between healing and damage a little bit better. An d speaking of which I'd like to be able to see what action took place because you know there might be healing, damaging, maybe crafting would be an action that could be taken. So I'll go ahead and wrap the healed text in a bold tag. That way we can kind of see the action much easier. Test that. All right. Nice, looking good. And last thing I said we would do is give the player a name a different color. So let's go ahead and wrap that in a color tag. OK. And I have a color in mind that isn't a part of the built and named colors. So I'm going to use a hex value to get that: #0D9EFF. And you can use any old color picker online to get the hex values of colors. Let's see what that looks like. Oh what happened here. So I did some digging in on this and apparently Rider doesn't currently support more than one color. This looks like it's a bug to be honest with you but if we switch back to Unity we can see that the built in Unity console does support multiple colors and rich text. So I'm going to go ahead and submit this bug to JetBrains and they're really good at getting back to you so I'm sure they'll have this fixed by the time the next release comes out. In any case we'll just go ahead and continue with the Unity Editor but we'll only need switch back and forth a couple more times so don't worry. Speaking of which let's switch back. And to finish this off I think the last thing I want to do is make this amount bold just so it's a little, it gives it a little pop. Which we can do pretty easily because rich text actually supports nested tags. What I could do is wrap this whole color tag in a bold tag. And that will allow the text to be both bold and green. And if we wanted to make it italic too we could wrap it in an i tag. Now I don't have to keep switching back and forth so why don't we implement the damage log. So I'm just gonna copy this paste this in here and then onlt things we really need to change are this healed text, we'll change it too damaged, and then the color of the amount, we'll change that to red. All right let's switch back to Unity. And again we can go ahead and apply some healing. Looking good. And then some damage, and let's do a couple of these to kind of simulate what would happen in a fight. In this case I'm getting my butt kicked so I'm going to do some damage maybe I drink a potion here and I heal myself. All right and that looks much better and it's way way way easier to read. All right. So at this point the video you're probably looking at all of this markup and thinking like, "this this looks ugly like there's no way I'm going to have to add all of this every time I log, right?". Well it really just depends on you and the project. You really could add rich text markup to every log in every class if you'd like or, if it starts to become more tedious than you want it to be, you could wrap it up in some helper functions. In fact I've got a couple of really nice helper functions that make this look much cleaner but, you know what, I think I'm going to save that for another video. In the meantime you can experiment with this and see how you can improve your own logs using just a couple of tags. The longer you work on your game the larger the codebase will become and more complex which means it'll become more difficult to debug as time goes on. Logs are great at combating this but unfortunately they're useless if you can't read them or even worse if you don't bother to read them because there's just too much information to digest. The tips I gave you in this video will help alleviate some of that pain by turning them into something that's more meaningful to the eye. I'd like to see what sort of logs you guys come up with so feel free to send screenshots to me on Twitter @infalliblecode. Thanks for watching. If you enjoyed this video then please leave a like and a comment letting me know what you thought. As always I'll catch you guys in the next video. Special thanks to Trond, Dark Rush Photography, NZ, WayneGlows, Thomas, and LootPigeon.

Channel: Infallible Code

Views: 5,734

Keywords: unity tutorial, unity 2019, unity3d tutorial, unity 3d, unity c# tutorial, unity 3d tutorial, unity tutorial for beginners, unity 3d tutorials for beginners, unity3d, learn unity 2019, game development unity, learn unity c#, learn unity, game development, tutorial, programming, c#, make a game, unity tutorials, unity for beginners, unity technologies, unity basics, coding, tutorials, unity, rich text, unity game dev, basics, gamedev, development, unity3d college, unity 2d, code, dev

Id: S2LNvvcVgRo

Length: 8min 53sec (533 seconds)

Published: Thu Sep 12 2019