Making a Modal Window in Unity

Поділитися
Вставка
  • Опубліковано 7 лют 2025
  • The first 1,000 people to use this link will get a 1 month free trial of Skillshare: skl.sh/gamedev... - Modal windows are a crucial part of Game UI, so let's make one in Unity that's flexible and versatile!
    Levelling Up Animations: • Using IK to Improve An...
    Tooltip System: • Designing A Responsive...
    Making UI That Looks Good: • Making UI That Looks G...
    --------------------------------------------------------------------------------
    Want to support the channel?
    ▶️ Help fund new episodes by joining the Patreon - / gamedevguide
    Use these links to grab some cool assets from the asset store:
    Get the Must Have Assets! - assetstore.uni...
    Free Unity Assets! - assetstore.uni...
    New on the Asset Store! - assetstore.uni...
    Top Paid Asset Store Packages - assetstore.uni...
    Asset Store Partners - assetstore.uni...
    --------------------------------------------------------------------------------
    Socials and Other Stuff:
    • Subscribe - www.youtube.co...
    • Join the Discord - / discord
    • Twitter - / gamedevguideyt
    • Facebook - / gamedevguideyt
    • Instagram - / gamedevguideyt

КОМЕНТАРІ • 113

  • @GameDevGuide
    @GameDevGuide  3 роки тому +19

    The first 1,000 people to use this link will get a 1 month free trial of Skillshare: skl.sh/gamedevguide07211

    • @4.8olympos
      @4.8olympos 3 роки тому

      Thx

    • @Mr.IN3V1T4BL3
      @Mr.IN3V1T4BL3 3 роки тому

      Can u make a video on mod installing system in unity

    • @unluckyyooo6598
      @unluckyyooo6598 Рік тому

      _declienButton.gameObject.SetActive(!hasTitle); otherwise it will never display the title with information

  • @ZahhibbDev
    @ZahhibbDev 3 роки тому +45

    I adore this channel because it's one of the few that actually goes fairly in-depth on UI, and as an aspiring UI/UX designer I just love to learn more on how to create these things! :p

    • @rmt3589
      @rmt3589 2 роки тому

      You should check out the Non-Designer's Design & Type Book.
      It's essential to any kind of graphic designer.
      I'm trying to learn unity. I'm fluent in HTML and CSS, but those don't transfer well. C# is a completely different beast!

  • @rimoldi98
    @rimoldi98 3 роки тому +21

    This is probably the most underrated channel on youtube

  • @Jesus-fi9kp
    @Jesus-fi9kp 2 роки тому +38

    I am grateful for the free content, but please, make those sequences a little bit slower next time!! They are incredibly fast ... So we can get these useful tips for learning ... Thank you!

    • @draganjonceski2639
      @draganjonceski2639 Рік тому +5

      yes i have to pause almost every second and sometimes go frame by frame looking very closely at what is happening

  • @ben_burnes
    @ben_burnes 3 роки тому +12

    I've created a TON of dynamic content from your videos. I love your teaching style because it shows the theory and methods of making this kind of stuff instead of "just copy paste this code in and you're done!" It's great to learn how this stuff works.

  • @williamtetlie4274
    @williamtetlie4274 3 роки тому

    the way you say, "Welcome, to Game Dev Guide" is really satisfying for some reason.

  • @KamaKase
    @KamaKase 3 роки тому +16

    Highly recommend using a builder pattern for configuring the modal. Much easier to maintain than multiple constructors.

  • @r1pfake521
    @r1pfake521 3 роки тому +17

    Don't forget that the Dialog Panel must be the last child in the canvas so that it is drawn above every other UI element and blocks the clicks properly

    • @johnleorid
      @johnleorid 3 роки тому +12

      Or draw it on it's own Canvas with a higher sorting order, so you can never forget about it (and you can use it as a prefab in your main menu)

  • @VEOdev
    @VEOdev Рік тому +1

    I good way to add is a transparent background that fill the screen so the player can't click something else while the window is open, and maybe add a button to the background so when the player click it the windows will close

  • @alon_vita
    @alon_vita 3 роки тому

    Oh my god where were you 3 months agooooo!
    Awesome vid mate, as always!

  • @jayvatar
    @jayvatar 2 роки тому +7

    Sorry this is not easy to follow. At some point it appears that you changed onConfirmAction to onConfirmCallback. Then you have UnityEvents with the callback suffix onContinueCallback, that are never used. Then all of a sudden you have onContinueEvent which I am assuming was the UnityEvent earlier. All this while rarely showing what file you are working in.

    • @unluckyyooo6598
      @unluckyyooo6598 Рік тому +1

      Totally agree... I spent a few hrs going through the slow speed of the video, and now totally stucked on what are those. Have you figure it out?

    • @77eight8
      @77eight8 Рік тому +1

      @@unluckyyooo6598 I spent 3 hours so far. Did you manage to make it work?

  • @dailydoseofhalal6767
    @dailydoseofhalal6767 3 роки тому +2

    Your videos are so well made and really easy to follow! Keep it up!

  • @MsPlone
    @MsPlone 3 роки тому

    The picture you used is my desktop background lol
    Very good video btw. It's always nice to watch. I learn something and you have a very chill vibe

  • @damionmccoy9966
    @damionmccoy9966 Рік тому +1

    Man first of your Tutorials I have seen helpful but super hard to follow you should slow down and when you change variable names mid display say something so we don't spend 20 minutes trying to figure out where we went wrong. Or please have a link to the source so we can examine the code. Otherwise love the stuff can't wait to see more very helpful.

  • @TheRealMobiius
    @TheRealMobiius 3 роки тому

    That UI website at the start was made my a guy I work with! He's recently won an award for it as well!

  • @TheJasonCD
    @TheJasonCD 2 роки тому +5

    This is really cool but also... Really hard to follow. I've had to go through this a few times and things still aren't quiet right.

  • @rashiddev7545
    @rashiddev7545 3 роки тому +2

    Although I have decided to leave the gaming development behind me but I still watch your videos. Keep it up.

  • @taharvingames
    @taharvingames 3 роки тому +1

    Just on time :). I love it

  • @DeLaBerni
    @DeLaBerni Рік тому +3

    Is there a way to download the file ? This video is to fast for me!

  • @samuelrussell5259
    @samuelrussell5259 3 роки тому

    Another absolute banger! Great content

  • @enchart
    @enchart 3 роки тому

    Been waiting for this tutorial for so long!

  • @gfhtyty
    @gfhtyty 3 роки тому

    you are the best i really love what you do and tnks for the best tutorials i ever seen on youtube

  • @shiv-iwnl8188
    @shiv-iwnl8188 3 роки тому +7

    I really want to learn this but your going too fast and jumping around everywhere in the tutorial so its very hard to follow

  • @tingwen1713
    @tingwen1713 3 роки тому

    Love this channel. I always learn so much from you!

  • @KevinsTimeWasters
    @KevinsTimeWasters 3 роки тому +15

    Why so fast? And you barely show what you're doing, instead just explaining the concepts without much detail.
    There's a problem if I need the video at .5x speed to even have a CHANCE of following along.

    • @draganjonceski2639
      @draganjonceski2639 Рік тому

      yea you can use comma and dot key when it is paused to go frame by frame but that is to slow so i just used a framebyframe youtube watcher where you can set it to larger increments of frames and smaller seconds than the 5 or 10 that youtube does.

  • @branidev
    @branidev 3 роки тому

    Yesterday I released video where i said UI needs a to be polished a lot and now this video! great!

  • @riverboatgambler3401
    @riverboatgambler3401 2 роки тому +10

    This content is obviously intended for Unity experts. The entire video is basically on fast forward. It's literally impossible to slow the frame rate to a point where a rookie can follow what is going on. Bummer because it's potentially very valuable training. Minimally, posting an example project would be helpful

    • @77eight8
      @77eight8 Рік тому +2

      True, I slowed down the video on 0,25x and still many parts were either not shown or skipped.

  • @Steveplays28
    @Steveplays28 3 роки тому

    Very nice tutorial, Game Dev Guide! :D

  • @paulorodriguez6288
    @paulorodriguez6288 3 роки тому +3

    niceee, i'm finishing the UI for my project and i had to do a different modal script for every different case, but maaan i want to implement this method tho

  • @BrontoKroxig
    @BrontoKroxig 3 роки тому +2

    I don't really get how Content Size Filter and Layout Element works, documentation is not clear for me, any video-recommendation to learn how both component works? ^^

  • @vitiet8229
    @vitiet8229 3 роки тому

    Awesome content as always!

  • @Andredy89
    @Andredy89 3 роки тому +2

    5:54 what means "=>" when assigning a variable? I know that this sign used with anonymous functions to quickly assign , but with vars?

  • @dirt410
    @dirt410 2 роки тому +6

    This is a good video, but not a good tutorial. I'm not new to unity in anyway, but there is no way you can follow along with anything being done here and understand how any of these components work, or how you should use them in combination with each other.

    • @draganjonceski2639
      @draganjonceski2639 Рік тому

      yeah if you have alredy made this in the past with looking at another tutorial and trying it out yourself it may be possible to get around the speed of this and the lack of import and code showing, for instance in the ShowPrompt function he has LeanTween.cancel(_box.gameObject). for starters i had to look at another video about tweening and find the library in the description, but i still have no idea what _box is, maybe it is in the parameters of the SHowPrompt function and its just another name for the panel, verby verbose for something that is esentialy panel.setactive(false);

  • @dotaportalvideo
    @dotaportalvideo 3 роки тому +8

    Some of the most engaging presentation of some of the driest topics. Not easy to do.

  • @rutchjohnson
    @rutchjohnson 3 роки тому

    Great video! Super useful! :)

  • @StummyEnjoyer
    @StummyEnjoyer 3 роки тому +11

    Good tutorial but please show the code in the right order. I got stuck for 30 minutes on the continue-cancel- and alternate Callback part because you hadn't shown where they get created and referenced :-)
    EDIT: I've now watched the entire tutorial and Unity is giving me 14 context errors that didn't get brought up in the video :-)

    • @fearian
      @fearian 3 роки тому +1

      Same, I think the name changes from onContinueCallback, to onContinueAction between images!

  • @cianb5047
    @cianb5047 3 роки тому +1

    I love your content

  • @The28studio
    @The28studio 2 роки тому +1

    Couple these with Scriptable objects and you will have very powerful UI system.

  • @laserbean00001
    @laserbean00001 Рік тому

    It wasn't so clear, but are you just rewriting the stuff on the modal window? Like you don't instantiate a new modal window for each message? I guess that makes sense.

  • @PreslavKolev
    @PreslavKolev 3 роки тому

    Finally a new video!!!!

  • @francoiss.8433
    @francoiss.8433 3 роки тому +7

    I've a little newbie question : In the ModalWindowPanel.cs, the close() command is not recognized after the Invoke...
    This is the header of my file :
    using System;
    using System.Windows;
    using UnityEngine;
    using UnityEngine.UI;
    using UnityEngine.Events;
    using TMPro;
    What did I miss ? Thanks for your help.

    • @galaxy-wy9sd
      @galaxy-wy9sd 2 роки тому

      No

    • @unluckyyooo6598
      @unluckyyooo6598 Рік тому

      He never showed it. There is also different variable name like onConfirmAction vs. onConfirmCallback at least that's my guess.

  • @souifilyes2873
    @souifilyes2873 2 роки тому +1

    the methode Close(); isn't regognize how can i make it regognize

  • @twibby6625
    @twibby6625 3 роки тому +2

    5:58 what does the => mean ? Is that a shortcut for accessors get&set ?

    • @GameDevGuide
      @GameDevGuide  3 роки тому +1

      Yep it's a "get" shortcut.🙂

    • @Salmonman0604
      @Salmonman0604 3 роки тому +3

      That's called the lambda operator. It can be used in many ways, mostly used to create what's called an "expression bodied property" which is sort of like a method return consisting of just one line of code. One expression. Anything that the compiler can evaluate to a single value result. So in this case, yes, it's being used as a shorthand to create a getter property. But this syntax can't be used to make a setter property because it doesn't feature the "value" keyword for you to use. However you can define a method as an expression bodied property, using any parameters you'd pass into the method signature like normal. I use it for any method that can be evaluated in that single expression limit.

  • @pbliable
    @pbliable 2 роки тому +1

    guess i gotta dl it and frame-by-frame it ...

  • @darthshuichi3453
    @darthshuichi3453 3 роки тому

    great content! I hope you'll do UIElements soon. I love using it.

  • @allanmacdonald2943
    @allanmacdonald2943 3 роки тому

    awesome video!

  • @ngjiayi2705
    @ngjiayi2705 3 роки тому

    Will you be doing a video on modulus window in unity?

  • @hoangduong5954
    @hoangduong5954 3 роки тому

    u are so underrated

  • @GingerNingerish
    @GingerNingerish 3 роки тому

    Oh my fucking god, I was wanting to know what these were called for so long. I was googling pop up boxes for ages and couldn't find anything

  • @alaslipknot
    @alaslipknot 3 роки тому +1

    Great tutorial as always!
    Question: are these characters yours or are they from a an asset ? if its the latter, could you share a link please ?

  • @puretrack06
    @puretrack06 3 роки тому

    Great Video. You can simplify this greatly just by using UnityEvents from the start. Can't see any real benefits from using actions.

  • @pinkhairblackman8141
    @pinkhairblackman8141 2 роки тому +2

    omfg why did you have to fast forward the ui, makes it so confusing and easy to make mistakes

  • @johnleorid
    @johnleorid 3 роки тому

    I think these should be static methods, which just don't do anything but sending a Debug.LogError() when the UI does not exist.

  • @tommasomaestri3107
    @tommasomaestri3107 3 роки тому

    What should I do if I had a method to assign to one of the actions which required a parameter?

  • @stressbuster5500
    @stressbuster5500 2 роки тому

    my modal window is taking few seconds to resize. what can be the reason? and how to fix this issue? if anyone know about this issue please reply

  • @LinharitoHervvon
    @LinharitoHervvon 2 роки тому

    onConfirmcallback = confirmAction
    CS0029 Cannot implicitly convert type 'System.Action' to 'UnityEngine.Events.UnityEvent'

  • @mitotv6376
    @mitotv6376 2 роки тому

    Nice

  • @laserbean00001
    @laserbean00001 Рік тому

    Shouldn't bool hasTitle = !string.IsNullOrEmpty(title);?

  • @nocultist7050
    @nocultist7050 3 роки тому +9

    Too fast.

  • @fakydev
    @fakydev 3 роки тому

    You are basically a Mumbo Jumbo, but for unity :)

  • @tc61049
    @tc61049 3 роки тому +1

    I followed your code but the trigger class OnEnable() always go first and the Awake() in UIController Class go second.
    This cause null reference exception at the singleton (not assigned) in the UIController Class.
    How did you solve it?

    • @GameDevGuide
      @GameDevGuide  3 роки тому

      Try changing the script execution order so that the UI Controller is executed beforehand!

    • @tc61049
      @tc61049 3 роки тому

      @@GameDevGuideWow that was quick!
      It solved the problem! Thank you!! Love this channel!

  • @unluckyyooo6598
    @unluckyyooo6598 Рік тому

    What are Close() and Show() ?

    • @mikeohc
      @mikeohc Рік тому +1

      It's a method he didn't really show, but maybe void Close(){ //probably SetActive(false) to all UI gameobjects }

  • @SaiponathGames
    @SaiponathGames 3 роки тому

    Nice! First to watch. Will try port this over to Godot.

  • @TheBurriagas
    @TheBurriagas 3 роки тому

    How will u avoid clicking on buttons repeatedly? Like pressing “continue” 2 times before modal window closes. I think thats the first thing QA will report

    • @GameDevGuide
      @GameDevGuide  3 роки тому +1

      You can force the button to disable, and/or remove the callback in the button's method. So that as soon as the button is pressed, it only performs the action once.

    • @TheBurriagas
      @TheBurriagas 3 роки тому

      @@GameDevGuide I am thinking more of a generic solution for this. Removing the callback might led into confussion when button gets reused. I find myself doing the same logic controlling over the same class if button pressed == button clicked and I was wondering how would you solve it.

    • @charlesselrachski34
      @charlesselrachski34 3 роки тому +1

      @@TheBurriagas why don't you store a counter and if it pressed , ++, then next time in the func check if > 1 then ignore and do nothing ?

  • @pbliable
    @pbliable 2 роки тому +2

    wtf does "Content" have on it ?? i cant replicate your thing cause u dont show us ... whyyy???
    ... okay there is literally 1 frame at 4:09 where u click on it, okay, got it, ... jeez dude .. 1 frame ?

    • @pbliable
      @pbliable 2 роки тому

      speeding up the video is okay, if you then go over every setting / change ... orr if the speed is slow enough to catch and see with a pause ... but .. you never show us Content, only for 1 frame lol which is impossible to pause i frame-by-framed it in vlc

  • @srbiscuit
    @srbiscuit 2 роки тому +2

    Nice tutorial but way too fast

  • @mad_man_86
    @mad_man_86 3 роки тому +1

    Thank you so much Mr. Guide! ;) Little issue I'm having: how do you ensure that UIController Awake is called before Trigger OnEnable? In my situation Unity complains about instance being null. Not the first time I struggle with this issue and I usually solve this by using events, but maybe you or someone here could tell me a better way to handle this :) Thanks!

    • @Khanguyen_
      @Khanguyen_ 3 роки тому +1

      Hey, I ran into this issue as well and fixed it by making sure that the UIController is executed first (Edit > Project Settings > Script Execution Order). The issue that we were having is very likely because the Trigger script's onEnable() was being called before the UIController's Awake(). I could be wrong, but this is what fixed it for me. good luck.

    • @mad_man_86
      @mad_man_86 3 роки тому

      @@Khanguyen_ thank you for the fast reply! I found this solution as well but I was hoping that there is another way, since I don't want to mess with the execution order. Guess that is one down-side of using a singleton in Unity. Nevertheless, thank you :)

  • @The_Ancient_Guardian
    @The_Ancient_Guardian 6 місяців тому

    i love this channels but some times is just a...mess, to fast, i cant follow and have to go back all the time.

  • @HAWXLEADER
    @HAWXLEADER 3 роки тому

    All hail Google Lens that helped me copy parts of the scripts to my computer.
    I now have a cooler Modal window system in my game!
    I could have written this system myself but Copy Paste is faster.
    I made the modal window panel as a prefab so that I can call if from anywhere in code.

    • @dominikhirsbrunner8774
      @dominikhirsbrunner8774 3 місяці тому

      Is there a way that I can get this prefab? For me the Video is too fast and jumps around and I can not make it work :(

  • @TruckerJoeOfficial
    @TruckerJoeOfficial 2 місяці тому

    The content is great, but the video sequezes are much too fast.

  • @Mr.IN3V1T4BL3
    @Mr.IN3V1T4BL3 3 роки тому +1

    Can u make a video on mod installing system in unity

  • @themaskyyt
    @themaskyyt 3 роки тому

    Wait...you're telling me that all this time there was a web page literally called Game UI Database?...

  • @BrontoKroxig
    @BrontoKroxig 3 роки тому +1

    bool hasTitle = string.IsNullOrEmpty(title); shouldn't be *!*string.IsNullOrEmpty(title); ??

    • @klkzz64545
      @klkzz64545 2 роки тому

      this confused me so much too haha

  • @GymCritical
    @GymCritical 3 роки тому

    Matt, I need you to stop uploading videos as I need them, it’s creepy 😂

  • @AllThatLOZ
    @AllThatLOZ Рік тому +2

    too quick

  • @Allbitable
    @Allbitable 6 місяців тому

    I must be stupid. I don't get this tutorial. I'm 3 minutes in and he constantly jumps around frames at 10x speed, adding and removing components off-screen. This is the first time I see this kind of tutorial. Then he says "now we're just going to add rest of our components here" and adds them at 20x speed as if the viewer is supposed to know what the components are.
    I have watched through most of the playlist by now and the lessons are great, - and I know this video is 2 years old by now. But I really wish the guy spared a thought or two for people who watch this tutorial video while not already being masters of it's content.

  • @yeeeetsssusdelets
    @yeeeetsssusdelets 7 місяців тому

    this is way too fast and half of the stuff is incorrect or incomplete. wonder if everyone who liked it even tried it out

  • @bruhmanbruhmanzz
    @bruhmanbruhmanzz Рік тому

    Way too fast and there are jump cut edit everywhere.

  • @nico_kempe
    @nico_kempe 3 роки тому

    No one:
    Game Dev Guide: WINDOW WINDOW WINDOW WINDOW WINDOW WINDOW

  • @Gonzakoable
    @Gonzakoable 3 роки тому

    OK, before I go ahead on the vid I'm gonna guess you use some kind of content size fitter

  • @nathanmaximiano8774
    @nathanmaximiano8774 2 роки тому

    like like like like

  • @through-it
    @through-it 4 місяці тому

    ThisTutorialBrokeMy'Space'KeyOnMyKeyboard.NowIWorryAboutMyMouse.MorePausesToTheGodOfPauses!Admen!