Skip to main content

unity make a menu, the basics

  1. 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 wast and scroll wheel to move faster like minecaft spectatormode + playing roblox for moving camera side to side up and down
    3. when I create a panel in the  wrong scene it wont let me change to the scene i want
      ask kunal
  2. 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.

          1. 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 crate 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 heirarchy
          1. create a color gradient
            1. go to text mesh pro folder
            2. mouse menu create text mesh pro color gradient
              1. right click to open 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 usialy 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 inspector, in the rect transform area,
                1. click the stretch, align/ arrrows in a box
                2. then hold alt then click the bottom right option for streach in all axis's
          4. make the button states, and show visual feedback to the user when hovering.                               highlight lowlight, when selected or not
            1. go to button 
              1. right click 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 disabled color to whatever you want, usually grayed out
          5. duplicate button for 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 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