ไม่สามารถเล่นวิดีโอนี้
ขออภัยในความไม่สะดวก
Dynamic Tooltip in Unity! (Resizable, Follows Mouse, Edge Detection)
ฝัง
- เผยแพร่เมื่อ 14 ส.ค. 2020
- ✅ Get the Project files and Utilities at unitycodemonke...
Let's build a Dynamic Tooltip that can resize itself to fit whatever text we give it.
This is essential for any game that is UI heavy like a Tycoon or a RTS.
👇
Simple Chat Bubble in Unity (Chat, NPC, Multiplayer)
• Simple Chat Bubble in ...
What are Delegates? (C# Basics, Lambda, Func)
• What are Delegates? (C...
How to make a Tooltip
• How to make a Tooltip ...
🌍 Get Code Monkey on Steam!
👍 Interactive Tutorials, Complete Games and More!
✅ store.steampow...
If you have any questions post them in the comments and I'll do my best to answer them.
🔔 Subscribe for more Unity Tutorials / @codemonkeyunity
See you next time!
📍 Support on Patreon / unitycodemonkey
🤖 Join the Community Discord / discord
📦 Grab the Game Bundle at unitycodemonke...
📝 Get the Code Monkey Utilities at unitycodemonke...
#unitytutorial #unity3d #unity2d
--------------------------------------------------------------------
Hello and welcome, I am your Code Monkey and here you will learn everything about Game Development in Unity 2D using C#.
I've been developing games for several years with 7 published games on Steam and now I'm sharing my knowledge to help you on your own game development journey.
You can see my games at www.endlessloopstudios.com
--------------------------------------------------------------------
- Website: unitycodemonke...
- Twitter: / unitycodemonkey
- Facebook: / unitycodemonkey
![[Official Music Video] ฝังใจ - BOW Maylada [Prod. By Tan LIPTA]](http://i.ytimg.com/vi/rSjk1jKWRN4/mqdefault.jpg)
![เหนื่อยหน่อยนะ (SOMEONE LIKE ME) - GEMINI Prod. by URBOYTJ [ OFFICIAL MV ]](http://i.ytimg.com/vi/M55XjfhbrNw/mqdefault.jpg)
![LISA - NEW WOMAN feat. Rosalía (Official Music Video) reaction [NEW LEVEL!]](http://i.ytimg.com/vi/BcppQEBJzEA/mqdefault.jpg)
🌐 Have you found the videos Helpful and Valuable?
❤️ Support on Patreon www.patreon.com/unitycodemonkey or get the Game Bundle unitycodemonkey.com/gamebundle.php
For anyone interested:
Instead of hardcoding the padding. Go into your text object, go to Extra Settings, and you can set margins.
You can then get those margins using text_object.margin.x, etc
Multiply by 2, then Add that to your adjustment, and your good to go.
So you can dynamically get the margins needed, as well as have the text pad itself.
Oh good point! I haven't used those extra settings much, definitely makes it even more adaptable!
@@CodeMonkeyUnity My pleasure, and thank you for the tutorial.
oh that seems like a good solution. I just took the localPosition of the text * 2.
Ever made an RTS or Management game? Add extra information for your player!
Tooltips can seems tricky but they're actually quite simple!
I just wanna say that you are the one of the best teachers in the community.
Thanks!
@8:08 If you are using the new input system, and don't want to set your player settings to both input systems... instead of using Input.mousePosition, use Mouse.current.position.ReadValue(). Just be sure to include using UnityEngine.InputSystem at the top. Thanks for this video, I used it for the tool tips on the input key rebinding system I just built for my game.
Great tutorial but you seemed to have messed up at the end. With your code the tooltip can still go off the bottom and left side of the screen. Luckily there is a way easier solution to this problem that looks nicer and will work for all edges of the screen. Simply get rid of the if statements and add a clamp on both the x and y to the boundaries you want to set. In this case, 0 is the left and bottom of the screen and canvasRect.width/height - backgroundRect.width/height is the right and top of the screen. Here is how I did it (but of course code in youtube comments is horrifying)
anchoredPosition.x = Mathf.Clamp(anchoredPosition.x, 0, canvasRect.rect.width - backgroundRect.rect.width);
anchoredPosition.y = Mathf.Clamp(anchoredPosition.y, 0, canvasRect.rect.height - backgroundRect.rect.height);
I always anchor the tooltip on the lower left so that's why I didn't bother with that extra check. But yup if you want to anchor the tooltip elsewhere then that code helps.
To make it not leave the screen from left & bottom side you can add this code
Rect screenRect = new Rect(0, 0, Screen.currentResolution.width, Screen.currentResolution.height);
if (anchoredPosition.x < screenRect.x)
{
anchoredPosition.x = screenRect.x;
}
if(anchoredPosition.y < screenRect.y)
{
anchoredPosition.y = screenRect.y;
}
thanks, bro that works even better then the tutorial :D
@@aboodriazy3387 Welcome. Did not thought it will help even a year later hehe
Thanks for the tutorial, great stuff and has really helped me out with my projects!
If you use Screen Space - Camera render mode, following mouse wouldn't work as intended. So i suggest you guys use these instead:
Vector3 screenPoint = Input.mousePosition;
screenPoint.z = 10.0f; //distance of the plane from the camera
transform.position = Camera.main.ScreenToWorldPoint(screenPoint);
MAN U SAVED ME THANKS
@@bukooldfutag2867 glad to hear it :)
I just checked the video quickly and i was wondering; why couldn’t just use content size fitter?
For anyone dealing with the flickering of text on hover problem make sure `Raycast target` is turned off
Yup if you use offset of 0,0 then what happens is the Tooltip shows up, then it blocks the mouse which causes it to hide in the next frame, but in the next frame the Tooltip is no longer there to block it so it shows again, etc, etc.
Appreciate you making this, helped me out a lot today.
Thank you! Plus it's not too difficult to make this appear on mouse hover too :) will be using this!
I cried tears of joy after finding this tutorial.
I'm glad it helped you!
I don't know if I did something wrong, but instead of dividing the "canvasRectTransform.localScale.x" I had to divide the "canvas.scaleFactor".
Nice. Beautiful tutorial 🤓👍
Hello, can you make a detailed tutorial on the New Input System? The basics aren't that hard but there are no tutorials about how to edit Inputs at runtime using the system. I'd really appreciate it if you did a video on that.
Thank you so much, i really needed that information
This is an incredible tutorial! You'll always stay one of the gamedev community main pillars.
I have a question regarding the use of the delegates -
they justification for a delegate is to store dynamic values, and update them accordingly. My question is, wouldn't it be best to have the inputting class (in our case, Tester) call ShowTooltip every one of its updates?
The reason for this, is that set text is already called every frame on the tooltip instance, so that the actual tmp will update the values with the new delegate vales. That means you have the tester class with the timer calling update, the delegate updating, and the tooltip instance setting the text each frame. Wouldn't it be best to just have the tester class call show tooltip in it's update and that's it? Just out of curiosity, I'm sure the delegate system has more functionality aside from what's demonstrated.
Thanks again for the tutorial!
Unity has made the editors dark theme free for all users, why don't you upgrade to 2020.1
I've had Unity Pro for a long time, I use the Light theme by choice, not because I dont have Dark, I just prefer light themes in general.
And unless it's necessary for some beta feature I will keep using 2019.4 since it's the stable version that most people should be using.
Just to let you all know these videos are in their original form, he really programs at this speed XD. Thanks Code Monkey, great tutorial and just what I was needing. The tooltip function in your old video that used your class file didn't seem to be working properly for some reason.
Fire burns, water flows, wind blows, " CM " makes great videos... )))
Great video as always
Great video as always.love and respect for you💙🙌
Thank you so much!
Exactly what I needed just now :-)
What would be the process for having this appear when hovering over a button or image? Great tutorial thanks!
Combine it with a IPointerEnter and IPointerExit th-cam.com/video/U1LFOTDLh3o/w-d-xo.html
May i get a suggestion on best way to add sprites between the texts? I want to make my tool tip show wood, stone, coin icon for RTS building costs, instead of doing wood:100 stone:50 etc... Thanks for the tutorial!
TextMeshPro comes with the option of adding some custom icons directly in the text, look into that as well as custom fonts which I used here th-cam.com/video/nBcP7FaDPE0/w-d-xo.html
Just what I needed, thank you! One more sub :-)
Perfect video!
Yep, there you go!
Cool video!
I would have loved this tutorial like a year ago when it took me a week to realize i needed the divide by canvas scale....
hey I love the tutorial but I am having one problem. when I use this tooltip I have a problem where if I move the mouse over a button I can see the tooltip, but I can move my mouse towards the tooltip and then the mouse will be over the tooltip for a few frames, which cause the mouse to stop being over the button which will then turn the toolkit off, which will then make the Button be selected again, which will then put the tooltip back on and then the same things happens until you move the mouse off everything that can make the toolkit show. do you have any solution?
You can disable the Raycast target on the tooltip which will make it so it doesn't block mouse events.
You can also add a tiny offset and make it update on LateUpdate();
@@CodeMonkeyUnity Thank you!
I just have a question that always comes to my mind....Is there any other difference between void Awake and Start other then Awake getting called before it? If we want the some awake commands to be called before start ,then we could just write them in Start, before the Start commands...Whats the exact advantage and use of Awake?
That's the main difference, they both get run just once, first all the Awake()'s run then all the Start()'s
Another difference is if you instantiate an object, you get Awake() right away, but if the object starts off disabled then it will only run Start() when enabled.
Usually I use Awake() to do any initialization on that object and on Start() do anything that requires access to other objects.
@@CodeMonkeyUnity ohh okk thanks👍🏼👍🏼
Thank you, are you also using transform.Find(); on your regular codes or is it for the video for fast prototyping? Because its string-based which is very dangerous
I used to use Find(); all the time, nowadays I tend to use SerializeField for my references.
But both methods are imperfect, both have issues.
With Find yup you have the regular issues with strings.
But with SerializeField you also have issues with dragging the wrong reference or just forgetting to drag it.
Great tutorial! Is there a way to make the tooltips stick to a button instead of a mouse pointer?
Sure, modify the Show function to receive a Vector2 for the position and just set in there instead of on every Update
5:10 Hi CodeMonkey - is there a reason you are using those TMP methods instead of just using the preferredWidth / preferredHeight to resize background which you used in the original video? I tried it and it does work, but am wondering if there is a technical reason you went with these TMP functions over that?
Hmm I don't remember why I did it that way, I think there was something about weird characters having weird sizes? Not sure but the function to get the rendered size should always be correct
Hey bro can you plz make a series of tutorials about making a full game!
I've made the complete Snake and Flappy Bird games, check out the Steam app th-cam.com/video/Iy17L8tLd2I/w-d-xo.html
Instead of making canvasRectTransform a SerializeField, make it private and type: canvasRectTransform = transform.parent.GetComponent(); inside Awake() body.
This way, you won't have to drag and drop it; and it will be instantly assigned on awake.
Make some multiplayer tut
I just wrote a comment regarding using Random.Range in conditional section of for statement (bad idea) and it's just gone.
The comment disappeared? I didn't delete any comment and there's nothing in the "Held for Review" tab
Great Tutorial.
Just have one question. how can I add a max size to the tooltip? if the textmesh pro set to wrapping false. the background-size keeps increasing the more text I add. I want to set it so that the background-size not exceed the max size and the text will be wrapped? Thank you in advance
You could maybe add some manual validation
Set the text like normal and look at the size, if its too big then disable overflow and set your max width, then if you want set a max height as well and again look at the size, if it doesnt reach maxHeight then use the minimum as the vertical size
have you stopped with the bolt videos?
I'm currently working on a Complete Visual Scripting Course so there's a lot more Bolt content planned
Why are you using a Func as a parameter? It seems like you could just pass a method or property which returns a string.
If you pass in a string it shows a fixed string value, if you pass in a Func you can use it with a function that updates the string over time.
@@CodeMonkeyUnity Ah! I have a lot to learn about Funcs.
I really don't understand why you're getting backgroundRectTransform and textMeshPro through find and get component. I feel like that could teach beginners bad practices. Make them public or add [SerialzeField] and set them in the editor
Adding SerializedField is indeed another valid option, it's just personal preference and personally I prefer to keep my games as much through code as possible rather than depending on the editor for references.
Making them public is a bad practice since it exposes the field to every other class in your code base.
@@CodeMonkeyUnity To be honest this example looks like a shit code, because almost everything is hard coded and highly coupled. Sure it's just for learning, but then we see such "beauty" in production.
I mean it is not reusable and extendable. And if some game designer desides to change layout options or game object hierarchy we get nothing working. Even if I change camera's render space - it get broken.
@@CodeMonkeyUnity That's fair enough I suppose, but having the possibility to break the code by changing the name, or even just the capitalization of a child seems like a bad idea.
@@LinDahai88 We are all looking forward to your videos or at least text lessons with pictures, if you know how to do better )))
Code Monkey. I love the vids and they are super helpful. Could you make a tutorial about string localisation (string tables stored on an excel sheet) or similarlly about reading data varibales from a excel sheet on google dirve?
Localization is very necessary so it's definitely something I'd like to cover but it's a very niche topic so not sure when I'll be able to have the time to get to it.
Why do you have the canvas object inside of a couple other game objects?
Just to keep things organized, instead of having everything on the hierarchy root I like to group general objects organized inside its own "folder"
Help! I got a warning CS0649: Field 'TooltipScreenSpaceUI.canvasRectTransform' is never assigned to, and will always have its default value null. Anyone know the solution?
That warning is inevitable since that variable is set as a SerializedField and set in the editor. So Visual Studio doesn't know it is being set outside the codebase.
there is a weird offset problem happening where the background grows out left and right from its 0, 0,0 positioning, versus text moves from 0,0,0 to the right of that. So while the background is shifting its size, the background and text aren't lining up as they should be @___@
Is the text set to align to the left? And is the pivot set correctly?
@@CodeMonkeyUnity huhm I may have missed the pivot, what changed for that? I must have missed it
@@CodeMonkeyUnity Yup pivot was the problem, after that some minor tweaks with text positioning and padding and it was beautiful. Thank you for pointing that out!
Is it possible to create notifications on
Desktop (Windows)? I tried googleing it but could find anything. Would appreciate any answer.
Notifications how? Windows notifications? I'm sure if you interact with the Win32 API you'll figure it out th-cam.com/video/RqgsGaMPZTw/w-d-xo.html
Hey! Currently is there any free multiplayer tool where you can join a room with friends not sharing the same wifi..even if it has a small capacity of users it is ok for now..
Mirror is a fork of the old Unity UNet system. It's on GitHub.
You can use unity's multiplayer system, it's free for upto 100 concurrent users I think.
Photon is the best i thing (i use it lol)
please tutorial game like PixelWorlds!
please please please....
please tutorial 2d sandbox or it's like Pixelworlds Game!
i'm please bro..
so much people wanna make this one.
Doesn't look like "so much people" based on the likes for your comment 🤔🙄
Please make series on car parking type game ❤❤❤
I remember playing tons of Flash car parking games, they were fun! I might make one someday
Out of interest, where do you learn what you know?
Lots of experimentation, trial and error, over the course of 20+ years!
hi im having a problem can anyone helo me
so im instaiting a object and that object is animated after a while their animation breaks
Could you give some throughout information? :)
@@arthurjvnb of course im changeing the position of the object in the animation i make the y -20 and then back to 0 but when u go further (its a 3d endless runner game) the position of the object change for example if its on 0 0 0 its become 0 20 0
@@heroalireza90 did you see on Animator if the animation is looping correctly? Or something in code that is resetting animation really quickly (and it seems that nothing is happening, but actually is only starting every single frame). Try this and reply what you've found :)
@@arthurjvnb its working perfectly fine at the beginning but as the object keep instaiting its becomes more broken
@@heroalireza90 hmm, that's weird. I've had something similar before, but was something related to my AI State Machine that I was implementing. Some states could override some animation commands and disable or enable inappropriately, i.e. a state could say "run" and some other would say "idle", but in fact the character was running, so it would slide playing "idle" because of the command order that I created wrongly in my State Machine. Maybe it's something like that? Or a script that handles character animation and some other script that is giving wrong information to that animation script (like speed 0f when it actually was like 10f).
Maybe you could see how different people use Unity's animation system and compare their implementations to yours and see if it's something wrong happening
Hey Usefull videos but your website isnt avalable ...
Should be back up now
so...is been 2 months or so...and you haven't gone back to continue building a full RTS as promised... 🙄😢
It's definitely on my list, I've got tons and tons of things to do and it's hard to find the time to do them all.
@@CodeMonkeyUnity i understand...but why put priority to the RTS instead of other random videos? most of the things you do like the tool tips could be definitely been added in the rts...over the taskbar ti show the build times and pre requirement and cost of resources..the targeting and everything. so why not make those videos for new technics as part of the RTS series?
just a thought.🙄 thanks for your content.
@@johnnyxp64 Why should the tutorials be shunted into one type of game?. You just described a way to use this tooltip system for an RTS, so use it that way?. Using codemonkeys systems for pathfinding, time-tick, item, health, damage, etc. You could make an RTS right now. Personally I'm glad these videos are separated so I can adapt the systems to whatever it is I'm working on instead of having to waste time untangling it from systems I don't need.
@@jackrxfg you're right, code monkeys way of segregated topics is REALLY EFFICIENT for adapting into our own games
"alright pretty basic"
so annoying xD
I noticed at 11:42 it does go offscreen a bit, I was able to get it more precise like this:
anchoredPosition.x = Mathf.Clamp(anchoredPosition.x, 0, Screen.width - backgroundRectTransform.rect.width * canvasRectTransform.localScale.x);
Hmm I think I just forgot to save the file at that point, the final demo works fire
But yes if you change the scale on the object then yup that addition you made will solve it.
Good job: "Assets\Scripts\testing.cs(13,48): error CS1503: Argument 1: cannot convert from 'System.Func' to 'string'"
and because you explain so well. i have NO idea what the error is.
The error is exactly what it says, you are using the wrong type, you are passing in a string when it expects a Func
If you don't know what is a Func watch this video on delegates unitycodemonkey.com/video.php?v=3ZfwqWl-YI0
@@CodeMonkeyUnity Hey thanks for answering. Sorry i got frustrated.
I got everything to work, except for the timer. which i should be able to fix. it just stays at 0 for now.
The main problem i had, was following the instructions. You go so fast, and do it in a kind of unstructured way, that sometimes i have to use the > and < to skip frame by frame to see what youre doing.
listen, it took me all afternoon to enter and troubleshoot a 15 minute video tutorial.
Regrettably you also dont explain what you are doing when entering code. Sometimes in a recap you go over the various elements and their function. The best tutorials i have seen were "line by line" where the guy talked about every line he entered, what it did what options there were etc (in a vulkan setup tutorial).
Ill watch the delegates video.
I hope you dont skip the critical step of putting the cript in a game object LIKE YOU SKIPPED IN THE PREVIOUS VERSION OF THIS TUTORIAL!
i ffing hate that shit.
Uh?
@@CodeMonkeyUnity yeah your tutorial does NOT work in 2022.1.16f1 not even when using legacy text elements.
@@avatharbehemoth I'm using this exact class in the game that I'm currently working on which is being built on 2022.1
There's nothing here specific to any Unity version
@@CodeMonkeyUnity Well, you must have attached the script to an object at lightning speed then. which is not a good thing in a tutorial, where every step should be clear.
like i said sometimes i have to skip from frame to frame to see what you have done, because you sped up the vid enormously.
so ALL the critical steps are made in sped up time. im at 13:58 and i get a NullReferenceException: Object reference not set to an instance of an object
TooltipSreenSpaceUI.Update () (at Assets/Scripts/TooltipSreenSpaceUI.cs:36) an now i have to find out where in the SPED UP RECIPE WITH NO EXPLANATION OF WHAT YOU ARE DOING i forgot a CRITICAL STEP!!
can you PLEASE a) explain what you are doing and b) show what you are doing in a way so i DO NOT HAVE TO PAUSE AT EVERY LINE, or play the vid in slowmotion??!!??
it turns out a previous "settext()" was still present at line 36