Search Unity

  1. New Unity Live Help updates. Check them out here!

    Dismiss Notice

Fix Buttons to Background Image

Discussion in 'UGUI & TextMesh Pro' started by UlfvonEschlauer, Mar 25, 2020.

  1. UlfvonEschlauer


    Dec 3, 2014
    I have the following problem to solve.
    I have a UI. The UI consists of a Canvas, a Panel, a backdrop image and a few buttons.
    I want the backdrop image to scale nicely with the screen resolution while maintaining it's aspect ratio. It is OK, if there is some empty space to the left, to the right and to the top and bottom, depending on the screen resolution/aspect ratio.I will fill that in with another background image later.
    Now, I was reading up on this and I was able to make my background image scale nicely by applying an Aspect Ratio Fitter to it. So that works nicely. Now the problem is my buttons.
    Imagine the background image representing a map and the buttons representing locations on the map. Of course I want to ensure that my location- buttons "stick" to the part of the background image (the map), no matter how the map is getting scaled by the Aspect Ratio Fitter.
    This is where my problem comes in: Between Rect Transforms, Aspect Ratio Fitters and whatnot, I can for the life of me not figure out how to make the buttons "stick" to the background image map. They get scaled nicely with the canvas, but that makes them move all across the map, when the screen aspect ratio changes.
    Hope the explanation of the problem somehow makes sense.
    Thanks in advance for the help!
  2. Hosnkobf


    Aug 23, 2016
    You need to move the anchors to the location you want them to have (relative position in relation to the parent. In this case the backdrop should be the parent). Make sure that the pixel positions are zero then.

    See my video about anchors for better understanding:
    UlfvonEschlauer likes this.
  3. UlfvonEschlauer


    Dec 3, 2014
    Thanks! I will try that!

    Worked like a charm! Thanks so much for the help! I never knew about the anchor point thing!
    Last edited: Mar 26, 2020