SETTINGS MENU in Unity

in this video we'll make an in-game options menu using unity he will be able to just stuff like volume resolution graphics quality and full-screen mode also before we get started I want to mention that my friends over at dev doc have created a huge Christmas calendar giveaway they're giving away a crazy amount of unity assets and other game dev goodness all you need to do is visit the link in the description and enter your email to get a daily chance of winning some of these awesome prizes and don't worry you won't be spammed with all sorts of random email so I really encourage you to check that out and without further ado let's get into the video such you can see I've set up some simple UI for our options menu in here I have a resolution drop-down a full-screen toggle a graphics drop-down and a volume slider if you want to learn how to use the UI system to set up something like this I have plenty of videos that you can check out I definitely recommend watching my previous tutorial on setting up a main menu but if you hit play we can see that these options currently don't do anything I can definitely adjust them but there aren't hooked up to our game in any way so that's what we're going to be doing in this video all the sprites that I'm using in this video are from ultimate game UI it's an amazing pack that's free on the asset store so you should definitely check it out as you can see they have a lot of stuff for you to easily make cool-looking menus but you can of course use any graphics that you'd like so let's begin by configuring our volume slider you can see that I'm using the ordinary slider component now let's hook this up to a script we can place the script any way we want I'm just gonna select my canvas I'm gonna hit add component and let's call it the settings menu it's like c-sharp and hit create an ad when they double click it to open it up in visual studio and the first thing that I want to do is delete our two methods and instead create our own one we'll make sure to mark it as public so that we can trigger it from a slider we'll make it void because we don't want to return anything and let's call it set volume well then take in a value from our slider this is gonna be of type float because we want a value with decimal places and let's just call it volume now we can easily set it up so that whenever we move our slider this function will get called and unity will then feed in the current value of the slider as volume just to show you this happening let's go ahead and write debug deadlock and let's display the volume variable if you now save this go into unity select our volume slider and scroll down to where it says on value chain changed this is an event that will trigger whenever our slider changes we can then add an action to this event by hitting the plus sign let's then dragging the object that our script is sitting on that's in our case the canvas we now view all the components on this canvas I'm gonna go into our settings menu script and you can see that our functions set volume now appears here it also says that it takes in a float but instead of selecting it from the list down here let's go to the top where it says dynamic float and here it also appears the reason why our function gets put to the top is that unity recognizes that our function takes in a float value and so unity will automatically input the value of our slider into that float so let's select the method at the top here and my slider is set to go between negative 80 and 0 I'll show you why in just a second but we should now see that if we hit play and are start to drag on this slider a bunch of messages will appear in our console and that as I decrease the slider the value that they show gets reduced so if I drag it all the way to the bottom we can see it says negative 80 and if I drag it all the way to the top it says zero awesome now all we need to do is use this value to control the volume of our game to do that we'll go window and we'll open up the audio mixer I'm just gonna dock this by the game view and you might already have added a mixer to your game if not we can go and hit the plus sign this will create a mixer in our project panel I'm just gonna rename this to main mixer and if we can create different channels for the different layers of audio in our game we could have one for music one for game plays sounds and so on but we just want to adjust the volume of our master slider we do that by simply dragging on it in here but how do we control this through script well whenever we are working with the audio mixer we have the possibility of exposing parameters this means that we make values editable through scripts in our case we want to expose our volume parameter so I'm gonna select the master group here go to the right where it says volume I'm gonna right click here and hit expose volume of master to script now at the top where it says exposed parameters if we click here we should see a new parameter this is a parameter for the volume and currently it's just called my exposed Prahran let's right-click on this hit rename let's just call it something like volume and the reason my choice my slider to go from zero to negative ad is that this is what our master does it starts off at zero and we then decrease it all the way down to negative eighty so if we now open up our script instead of just showing our volume in the console let's change our volume on the mixer to do that we need a reference to our audio mixer so we'll create a public and to reference an audio mixer we need to be using the Unity engine audio system so at the top here we'll write using Unity engine audio and now we can create a public audio mixer we'll call it audio mixer and then inside of our set volume function will go audio mixer dot set float and the float that we want to set is our volume make sure you spell this in the exact same way that you did when renaming the parameter and we'll then set a value for this parameter in our case we just want to set it to volume so whatever the value of our slider is if we now save this and go into unity we can dock our audio mixer to the right of our game view we can then select our canvas and we now have an empty slot for our audio mixer this is where we'll drag in our main mixer and if we now hit play and drag on a slider we can see the value updating for our master as well awesome so next we want to change the graphics quality of our game well we want to be doing this using our graphics drop-down this is just a standard UI drop-down and I've simply gone in and changed the options to low medium and high you can have as many options as you want here the only thing that we need to make sure is that they match with the graphic settings in unity so if we go edit project settings quality we need to have the same amount of quality levels as you can see I have a high a medium and a low and I'm just going to default to high here now let's go to our canvas and open up our settings menu and we're now ready to add another function again we want to make it public so that we can call it from our drop-down we'll write void let's name the method something like set quality will then take in an integer this is going to be the index of the element that we've chosen so if we select low this is going to be zero medium this is going to be one and high it's going to be two let's call this value something like quality index and this part is actually insanely easy all we need to do is access our quality settings and here we can set the quality level and this method simply takes in our index so we'll input our quality index and that should actually be it and all we need to do is hook up our graphics drop down to call this method to do that we'll scroll down to where it says on value changed again this is an event that will be triggered whenever we change our drop-down let's add an action to this event we want our action to access our canvas object because on a canvas object we have our settings menu and again you'll see our function appears in two places both in the bottom list here which says set quality green seed takes in an integer but also undue dynamic int and this is of course the one that we want to choose because just like with our slider unity will now automatically set our quality index to the index of the element that we chose and so we should see that if we hit play and let's go under edit project settings quality so we can see this updating in real time we then use our drop-down and let's try and change to medium first we can see it changes to medium over here if we then try and select low again we can see the level changing and we also now start to see that things don't look as sharp as they did before let's hurry up and bump that back to high awesome the next thing that we want to hook up is our full screen toggle this is just a simple toggle UI element again let's go to our canvas and open up our settings menu for this we want to create yet another method again it's going to be a public void we called it set full screen this time it's going to take in a boolean because our target is either going to be true or false let's just call it is full screen and this is actually also really simple to change all we need to do is go screen dot full screen and set it equal to our is full screen variable now again we need to hook this up to our UI so we'll go into unity we'll select our full screen toggle at the bottom here where it says on value changed we want to add an action so whenever we mess with our toggle we want something to happen here we want to reference our canvas where our script is we then want to go under our script and again at the top here under dynamic Bowl we should now see our set full screen method and just like with our drop-down and with our slider unity will automatically set the value of our is full screen variable to whatever the value of our toggle is which means that if we just go ahead and here play we can now switch in and out of full screen of course this isn't really visible but that's only because we are playing inside of the editor we can simply build our game in order to see this take effect but before we do that there's a final thing that we want to add I'm of course talking about our resolution drop down again this is just a simple drop down I've just put in three placeholder options these really aren't important and you can simply remove them if you want the reason why is that we don't know beforehand what options we have available this is something that unity will figure out for us because it's going to completely depend on what computer your game will run on so before we start changing the resolution of our game we need to make sure that we have the correct options to do that we'll again select our canvas and open up our settings menu and at the top here will now create a void start method this is of course called as soon as I seen loads and here we want to gather some information about what resolutions we have at our disposal we can get an array which basically just means a list of all the resolutions by going screen dot resolutions and let's go ahead and store these in a variable so we can access them later to do that we'll create a variable at the top called resolution we want to turn this into an array so we'll mark it with two square brackets let's call it resolutions then in the start method we'll set our resolutions variable equal to screen resolutions we now want to go through and add each of the resolutions to our drop-down to do that we need a reference to our drop-down component and because our drop-down is a UI element we need to be using unity engine don't you why let's go to the top here and add a line saying using unity engine dot UI let's then create a variable that will reference our UI element so public drop-down and let's call it resolution drop-down then right after we get a list of all the resolutions we want to clear out the default options that we have on our drop-down to make sure that we start with a clean slate to do that we access our resolution drop-down and we call the function called clear options and now we're ready to add some options to this will be using resolution drop-down dot add options and of course you might think to just put in our resolutions here and call it a day but unfortunately the add options takes in a list of strings and not an array of resolutions so this won't work we have to turn our array of resolutions into a list of nicely formatted strings to do this let's start by creating a list of strings notice how I'm using a different syntax for creating this list that's because this is in fact the list and not an array the only difference is that an array has a fixed size but the size of a list can be changed now we'll give our list a name we'll just call it options and we'll set it equal to a new list of strengths we then loop through each element in our resolutions array so for in I ice less then resolutions dot length I plus plus and for each element we want to create a string called our option and here we could displayed something like the width of our resolution and then plus an X so x and then the height of our resolution so to get the width of our resolution we take the resolution that we're currently looking at which is the eighth element of resolutions and then we can access start with and we do the same thing with height so resolutions and we give it the index I John height and we can then write options dot add to add an element to our options list and here we simply give it the option string that we just created and finally when we're done looping through all the elements will tell a resolution drop down to add some options the options that we want to add is our options list so now just to go through this we clear out all the options in our resolution drop-down we create a list of strings which is going to be our options we then loop through each element in our resolutions array and for each of them we create a nicely formatted string that displays our resolution and we add it to our options list when we're done looping through we'll add our options list to our resolution drop-down if we save this now and go into unity we should get an empty spot here for a resolution drop down here we of course want to drag in or drop down and if we now hit play we should see that we have all the available resolutions in our drop-down the only thing that it doesn't do is select the correct one right off the bat to change this that's going to our script right before we start looping let's create an integer called our current resolution index let's just afford it to zero we'll then go into a for loop and we'll check if allusions to the ith element so the resolution that we're currently looking at is equal to screen dot current resolution so if the current resolution we are looking at is equal to our resolution well then we want to go ahead and set our current resolution index equal to I it's just one slight problem with this and this is extremely annoying and that is that you can't compare two resolution types don't ask me why this isn't in here so we actually have to compare first the width and then the height of both resolutions so resolutions to eye width is equal to screen their current resolution dot width and we'll put in two ands here resolutions to I dot height is equal to screen dot current resolution dot height so now we compare both the width and the height of our resolutions and if they both match up well then we're looking at the correct resolution so we store the index of that and then after we add all the options we can go resolution drop down dot value and set it equal to our current resolution index as well as curve resolution drop down dot refresh shown value in order to actually display it now I know this code doesn't feel pretty but updating resolutions in unity has always been a bit of a hassle but that's alright because this should actually work now so if we save this go into unity and hit play you can see that it automatically sets itself to full HD which I know is indeed the default resolution for my system then we can of course go in here and change it but this doesn't update fortunately updating your resolution is much much easier all we have to do here is create another function just like we did with all our other properties we create a public void set resolution this is going to take in a integer called our resolution index this works in the exact same way that it did for asset quality drop down now inside of this function will write screen dot set resolution now this takes in a width and a height this was a boolean saying whether or not we want the game to be displayed in full screen to get the width and the height we need to simply use a resolution index to find the correct element in our resolutions array so we'll create a resolution variable here let's call it resolution we'll set it equal to resolutions and as the index will our resolution index it's now we've found the resolution that we want to select in our array and we then simply use resolution dart width as well as resolution dart height and as for the fullscreen parameter well let's just use screened at fullscreen just like we did down here so we'll input screen dot fullscreen and wallah if you now save this go into unity select our resolution drop-down scroll to the bottom let's add a new action to our on value change to vend that's dragging our canvas go under our settings menu and choose set resolution as the function we then save our scene go file build settings we'll drag in our scene to the scenes and build let's hit build and run I'm gonna create a separate folder for this and let's name it test build now unity is going to start building our game it's going to open up in full screen and we should now see that we can adjust the resolution of our game truths whether or not we want it to be full screen we change the graphics quality and adjust the volume awesome finally now that we have our settings menu we can go edit project settings go under player and here under standalone player options we can make sure to set display resolution dialog to disabled so that we don't get that annoying default settings window before we play the game and that should be it yay that's pretty much it for this video again if you haven't checked out the Christmas calendar giveaway that's a link for that in the description the deaf dog guys are super nice and definitely deserve a big thanks for setting up this cool event well in that thanks watching and I will see you in the next video thanks all of the awesome patreon supporters who donated in November and especially thanks dude oh man I mean arou see hands off tune Sybok Mamiko Cabral Dan Evans John Perot guard Superman the great James P Thomas Wally Jason the Tito dark heaps Kirk Chaisson Murphy Rob fern James Rogers Alex rickets key man Alice Oh March I'm Robert boon and Peter Locke

Channel: Brackeys

Views: 647,160

Keywords: brackeys, unity, unity3d, asset, assets, how, to, howto, learn, course, tutorial, tutorials, tip, game, development, develop, games, programming, coding, basic, basics, C#, menu, settings, SettingsMenu, MenuSettings, options, button, volume, slider, graphics, resolution, gamedev, quality, full, screen, fullscreen, Devdog, Christmas, Calender, Giveaway, adjust, Ultimate, UI

Id: YOaYQrN1oYQ

Length: 17min 21sec (1041 seconds)

Published: Wed Dec 06 2017

Reddit Comments

[u/Romestus]

Screen.resolutions not only contains all the width & height values but also refresh rates. If you use it straight up you'll notice on certain devices people will have upwards of 5 1920x1080's to choose from.

[u/TimUilkema]

Thank you for these great tutorials. I use them a lot, and as a coincidence I need to make a start menu and settings menu for my game!

[u/DOOManiac]

This is a great video. I love the edits that keep the pace fast as well. Thanks!

[u/PappaJew]

My man Brackeys delivers again