Skip to main content

unity make a menu, the basics

  1. dev log, NZK's GNZ day 1

  3. make a game  scene and a menu scene
    1. IDK how to make an empty one
      1. so I copied and pasted the default one in the assets folder and renamed it
      2. then I dragged into the hierarchy area
      3. I renamed them then reloaded/refreshed em when it asked me to
    2. how do I move in the scene
      1. click the hand tool, then right-click it and WASD and scroll wheel to move faster like Minecraft spectator mode + playing Roblox for moving the camera side to side up and down
    3. when I create a panel in the  wrong scene it won't let me change to the scene I want
      ask Kunal
  4. create a panel, 
    1. right click in the correct scene, UI>panel
      1. this will create a canvas with a panel
      2. how to change bg img
        1. import img
          1. click on file
            1. change the texture type to 2d and UI if it asks you  to refresh do it
              1. click on panel
                1. drag the img onto the panels img source img area, it should give a + symbol on your mouse
        2. then rename your panel to "background" so you remember that its a background img/panel
      3. create text!
        1. open asset store for custom fonts on older versions,

            1. Click on the "Window" menu at the top of the screen.

            2. From the dropdown menu, select "Asset Store."

              1. if on a newer version open the package manager instead of the asset store

            3. If this is the first time you are opening the Asset Store, Unity will prompt you to log in using your Unity account credentials. If you don't have a Unity account, you will need to create one.

            4. Once you are logged in, the Asset Store window will open, showing various assets, packages, and resources available for download and use in your Unity project.

          2. then install or make sure text mesh pro is installed
        2. right click on the menu scene
          1. hover over ui
          2. click text mesh pro
            1. it may ask you to import stuff, do it
          3. on the inspector menu for the text, u can scroll down to underlay, use this to create a fake shadow if you want
        3. make sure you're text is in front of the img, it needs to be under the background in the hierarchy
          1. create a color gradient
            1. go to the text mesh pro folder
            2. mouse menu creates text mesh pro color gradient
              1. right click to open the mouse menu
              2. text mesh pro
              3. click color gradient
              4. name it
            3. click on the file you just created
              1. click color mode and do 4 corners gradient
              2. each rectangle corresponds to the 4 corners of the text and it will make a gradient from each corner to the others based on relative space
        4. create a button
          1. in canvas under your text, make a button,
            1. use mouse menu
              1. go to UI
              2. then button, probably text mesh pro
          2. scale the button to be similar in size to your text object or the relative size to your text
          3. this button usually comes with a text object, you can replace that one with the one you just made
            1. if you do this 
              1. rename button to "PlayButton"
              2. rename the text you created and moved into the button object to Text
            2. make text center to button
              1. click on Text, the object
              2. In the inspector, in the rect transform area,
                1. click the stretch, align/ arrows in a box
                2. then hold alt then click the bottom right option for stretching in all axis
          4. make the button state, and show visual feedback to the user when hovering.                               highlight lowlight, when selected or not
            1. go to button 
              1. right click the button and look in the inspector
            2. set normal color alpha to 0
            3. change the highlighted color to not 0 but not max
            4. set pressed color to a darker color
            5. set the disabled color to whatever you want, usually grayed out
          5. duplicate button for other settings
            1. right click on the desired button
            2. ctrl+c
            3. ctrl+v
            4. click the new button and hold shift to drag only on one axis
            5. repeat till you are satisfied with the number of buttons
              1. drag with the right mouse button
              2. resize your buttons to only fit the text, or fit your needs
                1. hold alt to mirror the padding changes on both sides of the button
                  1. just try this it doesn't make sense when reading
              3. rename your buttons
              4. edit the text 
          6. create the MainMenu canvas
              1. click canvas
              2. create blank
              3. rename to MainMenu
              4. resize it to fit all the elements
          7. drag all of your buttons onto the MainMenu object
            1. ctrl+click and specifically target the buttons
            2. or highlight a list of objects all at once
              1.  click the first item on the list
              2. shift click the last item on the list
          8. duplicate the main menu object and rename
            1. right-click the main menu object to bring up the mouse menu
            2. click duplicate
            3. rename to "OptionsMenu"
              1.  or whatever new menu you want to link to a button
          9. temporarily disable the MainMenu
            1. right click MainMenu
            2. in the inspector window uncheck the check box on the top left
              • we do this so we don't mess up the MainMenu when editing things
          10. time to make a volume slider
              1. click options menu
              2. open mouse menu
              3. hover over UI
              4. Select Slider
              5. resize it to your liking
              6. color it to your liking
              7. hide the handle
                1. slider>handle slide area>handle
                2. disable the img compontent
                3. select the background
                4. color the sliders bg to your liking & decrease the alpha
              8. slider>fill area>fill
                1. change the color, this will be the indicator of how loud you want things to be
            2. link to tutorial to make the slider do things
        5. don't edit  play mode without saving plz
        6. Titlebar>file>buildsettings
        7. go to assets in project area
        8. drag the scenes of your game into the scenes in build area in the builds settings window
        9. the number to the right is called the build index
Back to top