Unity C# - Fade out GameObject when player is behind it.

Video Statistics and Information

Video
Captions Word Cloud
Reddit Comments
Captions
in this video I'm going to show you how you can have objects fade out when they are blocking the player from the camera all right let's get it in my small little scene here I have two pillars um a little platform and a player that I could move around we're gonna be making these two pillows transparent when the player goes behind them but real key here is in the materials themselves um if you go up right here and check out the alpha channel for this notice if I lower it up and down um nothing really happens I'll do this one as well for the red material um let me just bring this up a little bit here all right so again uh the trick is really in the materials you want to go up here and switch the surface type to transparent let me show you the drawback the drawback of this if you notice the shadow right here it disappears the shadow disappears when you switch it from surface type um you switch it to transparent the shadow disappear so I would suggest you simply bake your shadows because you're going to do this effect on maybe a tree or something stationary in your scene anyway so you just go ahead and bake the shadow you will have to worry about that object being moved um let's go for it you can see now that if I go to the alpha Channel and lower it with that surface type being set to transparent it actually works now I have two scripts in the scene I have this object fader and a camera script camera script is on the camera and the object fader is on the uh pillars oh can't speak today pillars the object script is on the pillars you can see that they're completely snippet codes the very default that Unity generates and we are good to go so let's go ahead and jump into our first script you're gonna see how this works so we're inside of the object fader script this script will be adding to all of the objects in your scene that you want to have this faded effect and let's begin with grading two public floats first one will be our fade speed so how quickly it's going to fade with a comma here and then we're going to do our fade um our fatal opacity or fade amount let's say a fair amount to how much we're gonna fade uh and then after that we need a private float we don't have dry private just write float and then this will be our original opacity um basically the the the default settings or the the previous settings that we're going back to when the player moves away from being um behind an object that is faded now I only have a few more variables here to create but I do insist um you watch this till the end if you're trying to have this done to like something going on with your terrain and objects being blocked all right so I'm going to call this last not this last variable but this variable here will be our renderer public variable um doesn't actually have to be public so let's go ahead and remove public from it and then finally um we'll create a reference to uh material because in materials where you get access to that color that we were looking at the alpha channel so I got a renderer and a material I'm gonna actually remove the renderer and just do material for right now I might put that back later when I show you how to do it with things that has multiple materials finally uh public uh Boolean here which is what's going to tell the script that you want to fade go ahead and fade now the player is no longer being visible by the camera I'm going to just get rid of these comments don't need them um yeah let's continue now that I'm done organizing the code let's go ahead and actually set up these references we made a material variable let's go ahead and tell the um the script here what material is what math is actually equal to and that's going to be or just go ahead and get component material on the player um and then the original or yeah the original opacity we're going to go ahead and set that so as the game start we say hey this is what the current opacity is set to right now let's go ahead and save that for later so we can go back to it so if you go to material or mat which is a variable dot color we choose color dot a which is that Alpha number right so if you look at the material here in the color see the color the alpha Channel it is a it has a value and that is well I think it's 255 um I'm also realizing that the time of this recording that um some of it is cut off on the edges here so I do apologize for that you're not really missing anything though um I'll try to make everything um look better so all of our variables are set up it's time it's time to go into the update and let's basically say hey if the Boolean to do Fade is true we're going to go ahead and make the fade happens otherwise we go back to the default so let's create two functions that will handle this um we'll call this one fade now and then we'll just go ahead and create another one here that's going to go back to what it was before and I'll just say reset fade I guess and just copy this and say oh if uh if do Fade then we call the okay now otherwise we just call the reset fade simple easy peasy lemon squeezy and remove some of that unused space all right everything's looking good it's a really really simple code guys let's hop into the fade now and I'll show you how we will actually tell it to fade for right now so we're going to create a new color similar to how you create a vector well three like a new Vector three so this is going to be our current color and right from the material we can just go ahead and grab that color boom toss it in there so now we have current color the reason for this is during the update as we're changing the color we don't want to change it from where it started we want to change it from what it currently was or currently is as we're changing it so we do need the reference to the current color and now we'll create another color here which is a smooth color basically a smooth transitioning color and that's where we go new color just like you would do with a new Vector three and we're going to pass in the current color red so the RGB for the current color the the green the blue and then you can actually pass in the alpha at the end of this so as you can actually do RGB a and so that's what I'm going to do and for the a which is the alpha I'm actually going to have this slowly um change and that's what I'm going to do a math F Dot lerp which basically means the lerp allows you to give it an A and A B value a two floats A and B float and then a t which is basically the time how long would it take you to move the a value into the B over the course of whatever time this is all going to be happening in the update anyways because we're calling the update so our a value is basically our current caller Alpha and where are we trying to make it fade to is the Spade amount which is then our B value and then how quickly and that is our fade speed so hopefully that wasn't too complicated and so now we have a smooth color which is basically the alpha being change over the period of time and then we simply say hey Matt go ahead and set your color to this mood color and with all of this happening it should give us the desired results that we want copy paste this and then in the research colleges grab the original opacity and all you're doing is removing the fade amount that we're setting the alpha channel to back to setting it to whatever it was B4 right makes perfect sense with that code we're head back into Unity don't forget to hit save head back into unity and our do Fade is public so we'll be able to just kind of like hit play and then check this box to check if it works all right so for the fade speed I'm going to set about 10 and then the fade amount what you want to do is I just remove this Alpha Channel up and down pretend the full length of it is just one so somewhere in the center right half of it would be like a 0.5 just assume of it assume assume it's it's one and pretend it's like that because um what that's what you kind of want to it won't work if you just go with the full value I don't know what I'm saying today but yeah that's basically what I'm saying it won't work if you go to full value so hit play and I'll set both of these to 0.5 and then when I hit the do fade it should work but that doesn't the plot twist down and then the plot twist it doesn't and the reason why is uh let's see of course as I expected um get component material you can see the line was a 16 get component material if you look at the objects in your scene there is no component called material inside the renderer which is the same as the mesh render that is where you find material but you don't have a material component so a quick change there to the code get the render and then dot material um now when we hit play Perfect now click on this and just check the box and you can see it fades out all right what's happening with my speed here it's being instant all right huh looks like I gotta recheck the code one more time I have goofed up once again um it's going instant it should it should Fade Out in a a nice smooth way not just instant all right let's go and check our code real quick and I'm using the fade speed yes indeed I'm using the phase B but guess what missing the time dot Delta time so we got our fade speed here after that just times it by time dot Delta time that is important ladies and gentlemen you got to put your time don't doubt it's time do this for both copy paste uh hit save one more time and just zoom in a little bit better there we can see it perfect save head on back that's not a very country head on back I don't know it just came out like that sorry just came out like that let's click it boom and there we go nice fade in and out just by checking these boxes so as you can see we have the fade system set up if you are smart enough from this point to assume the rest go ahead and thank you for watching and complete the rest on your own otherwise stick around I'll show you how to do this with like a tree and all that stuff but basically all we have to do now is detect when the player is not visible by the camera and call the function on the object that is blocking The View and so in our cam script let's go ahead and do that my good good uh my good friends I was gonna say my good sir but then if you are a female and you do not identify as a sir it might it might come off the wrong way all right so reference to the script object fader it can be private no need to make it public and I'm going to call it fader now I know what you're thinking why not just check if something is blocking the player's View and immediately just get component and call The Faded script well we need to actually keep a reference to it so that when we walk away from the object we can still tell it hey to go back right okay all right so we removed the um you just saw me remove the star function don't need that and then the update here let's go ahead and grab the player reference by simply creating a variable a game object player and finding that player with a tag so we know where the player is we're found a player don't forget to tag your player as a player make sure you spell it the same way capital P okay P for player next line down we're going to check to see if that reference comes back and it's not no so we did indeed find the player now we're going to create a position to check the camera position uh the direction from the player in the camera all right so this is a vector three a three-dimensional coordinates that's going to give us the camera position um the direction from the camera and the player so we go ahead and player transforms our position minus transform that position which is the cameras transform because the script will be on the camera or is on the camera next we need the array let's go ahead and just call it Ray and then that's going to equal to a new Ray which is then going to take the camera's position and then the direction which we created on the line above there so now we're going to be casting array from the camera to the position that we identify the player is at finally array cast hit the variable just call it hit and now let's check the physics to see if this has hit the player why did I just yell at the end like player if this if it says oh man I'm cracking myself up if you don't find it funny I do apologize sorry not sorry uh raycast um physics out raycast we're gonna send the raycast out there's a lot of um parameters you can put in here like a a certain amount of length layers and all that stuff we don't need this for right now so let's uh proceed check to see if we uh hit something that has a Collider very important because only things with colliders will be detected from this so if we let's just check yeah let's just check if we did not hit something so if the collider is is equal to no then we're just going to return the colonel go any further now I'm going to check to see all right if that collider is the player all right so if we've hit the player I know we want to check to see if we if we did not and because that would mean that there's something in front of us but first this means that there's nothing in front of us because we've hit the player all right we've cast array directly and there wasn't a Collide the colada the collider that got hit was the player then we're simply just going to um get a component on well actually we won't need to do that let's just go ahead and fader yep if the fader is not new we're just gonna go ahead and tell it to set the do Fade to false now I know there is no reference to the Shader the fader there is no reference to the fader yet in this code so how would this work simple because the the time that there's something in front of the player that reference will be set and then when he moves away then this code here will go ahead and tell it hey go back to being false so it's going to be slightly different in the L statement here so in the L statement is where we say Okay fader equals and basically we're going to get the component from whatever we hit because the else means that we weren't able to directly shoot a laser from the camera to the player there was something in between so we've hit something and we're going to check that hit that hit object that we've hit for the object fader component if it has that object fader component let's go ahead and set that reference and if that reference is not new so we were actually able to get one then we say hey fader go ahead and set that to true and I will basically say hey do the fade so now you can see where this top uh if condition will actually go ahead and already have a fader reference setup and we can actually just tell it to basically go to files online 31. all right save head back into Unity and we're going to go ahead and do a quick test here all right and I'm gonna hit play I can move my little character and boom when I go behind it and I'm blocked it fades out just like that all right now I can walk through these because I'm just moving using um position I'm not using any rigid body so don't for a second think that it's because they're faded out you can walk through them that is not the case and if that's what you're trying to do then this is not the tutorial for that we're simply making them um fade out so if you had a you know rigid body and all that stuff you still wouldn't be able to walk through things that are faded all right I think I've uh said enough let's go ahead and I'll show you how you can do this now with a tree so let me go ahead and find a tree here in the asset store and I'll get right back into the tutorial so I got myself a nice little tree here um let's go ahead and fix the settings here on the material so I'm just go ahead and try to find the material that is made up of this or this tree is made up of you see everything here is grayed out and whenever that happens um it just means that they are within the tree basically like this you see how they're kind of like this one object um to to overcome this if you run into this issue just go ahead and duplicate the material um shortcut keys just Ctrl D boom there's that one and boom there's that one and now each material is no longer kind of like Link in that one object there so you can click on each material and we need to set that to transparent go here and set this as well to transmit so that's all that's required is for the materials to be set to that surface type transparent now I'm going to go ahead and reassign these materials with the new ones that I've just edited and we can see and there we go so now you see um this tree has multiple materials so how would this work with the code I'll let me show you how that's done let's get it let's start by renaming our matte variable to mats and go ahead and make an array add in those two square brackets there and then this should be mats and then we want to get an array of materials and the full list of materials is actually just adding an L an S at the end there if you see here materials because there's two all you got to do is add an S there at the end once we have that all we got to do now is do a four each loop we're going to Loop through all the materials that we have gathered doing a for each Loop and then just go ahead and set the original opacity of the alpha a here just grab this boom drop it in there and um it's a lowercase m right here let's go ahead and put matte um there we go it's for each for each material and then we just say matte basically you can just copy this part right here the for each Loop because that material is set when the game start right there all the materials are set to mats at this point just copy this and or just copy the for each Loop and then we just come down here where it says fade now paste that in take this code remove what's in the loop drop the code in the loop and all you got to do is change this to matte and change this to easy peasy lemon squeezy same thing goes for the reset fade below oops wrong copy paste what you want to do is you literally just copy paste this and paste it below and of course don't forget the fade amount needs to be changed back to now original amount which is right there see how that works easy peasy lemon squeezy um a few things you do have to do to your tree though other than the material set as we just changed but basically we need to drop the script on it and that's one of the that's one of the first thing we need the script audit so there's a fader object script I'm gonna set it to five and set this to 0.5 also needs a collider so the camera knows that oh there's something in front of us so add your collider to your tree and we're good to go I'm actually going to change this fade amount to 0.2 all right well we hit to play and that is it guys thank you so much for sticking out the what is it 20 about 20 something minutes of video but we did it we now have a tree faded now we have our obstacles here that also Fade Out um there you have it do what you must with this and again again the shadow issue just go ahead and bake your shadows there's other ways to do this if you like to create your own Shader using the Shader graph but anyways thank you for watching and see you in the next one
Info
Channel: Online Code Coaching
Views: 12,302
Rating: undefined out of 5
Keywords: Fade, fading, transparent, make object fade, fade out object, fade Gameobject, how to, unity, unity3d, guide, tutorial, faceout object in unity, C#, c# script
Id: mOqHVMS7-Nw
Channel Id: undefined
Length: 22min 17sec (1337 seconds)
Published: Tue Feb 21 2023
Related Videos
Note
Please note that this website is currently a work in progress! Lots of interesting data and statistics to come.