Search Unity

  1. Welcome to the Unity Forums! Please take the time to read our Code of Conduct to familiarize yourself with the forum rules and how to post constructively.

Unity UI What are panels?

Discussion in 'UGUI & TextMesh Pro' started by Denisowator, Feb 22, 2019.

  1. Denisowator


    Apr 22, 2014
    I can't find anything on the manual, or via Google.

    Here's what I wanna know:
    • What are panels used for?
    • What do they allow me to do, that I wouldn't be able to do without them?
    • Are there any situations where it would be bad practice to not use a panel?
    I've seen panels used in assets I downloaded, and in tutorials, but don't have a clue why they're used.
    aigamecreator and tessiof like this.
  2. Ryiah


    Oct 11, 2012
    To quote Adam Buckner in his tutorial, it "just gives you a slight edge up on getting started". My impression is that it was meant to be a starting point for grouping other UI elements. If Unity wasn't based off of combining components to make the end result it might have made more sense, but because of how the engine works it's basically just a shortcut.

    Last edited: Feb 23, 2019
  3. eses


    Feb 26, 2013

    What @Ryiah just said.

    Both are just collections of same components, with slightly different starting values, for different purposes.

    Image defines something that is more usable as an image. It's aspect ratio is kept, and it's placed somewhere. You'll have to assign the sprite yourself, as image is seldom the default panel sprite. Also, image you want to show, is usually opaque, not semi-transparent.

    Panel defines an area that will by default stretch to fit it's parent RectTransform dimensions, more likely usable as container of other RectTransforms (could be called panels if these have same setup) that can define other types of UI elements, depending on what UI components you add to these RTs (Image, Button, ScrollRect...).

    - RectTransform set to stretch mode, anchored to it's parent RectTransform corners
    - CanvasRenderer component
    - Image component
    -- Source image (Sprite) set to default panel sprite called "Background"
    -- Color alpha set to semi-transparent
    -- Image Type set to sliced (can stretch nicely with 9-slice setup)

    - RectTransform set to "flower" mode anchored to it's parent RectTransform center.
    - CanvasRenderer component
    - Image component
    -- Source image (Sprite) set to empty
    -- Color alpha set to opaque
    -- (No Image Type, as no sprite is defined)