Search Unity

Scroll view starts at bottom instead of top... how to fix?

Discussion in 'Unity UI (uGUI) & TextMesh Pro' started by JoeStrout, May 14, 2015.

  1. JoeStrout

    JoeStrout

    Joined:
    Jan 14, 2011
    Posts:
    8,207
    I'm trying Scrollview for the first time. After a bit of stumbling about and watching tutorials (it was not obvious to me that my "scroll view" needs an Image component in addition to Scroll Rect and Mask... I hope they add that as one of the built-in UI presets in a future release), I've got a scrolling area set up and working. There's just one problem: it always starts at the bottom of the content, and I want it to start at the top.

    Here's my setup:
    1. My "Scrollview" object has the default (centered) anchors and pivot, and the size of the scrolling area. It also has ScrollRect, Mask, and Image components as mentioned above.
    2. Under that is a "Content" object using the Top-Left anchor preset, and pivot set to 0,0. This is initially empty and has full width, but an arbitrary height of 300.
    3. A script attached to Content creates a bunch of child objects in the Start method, from a prefab. This involves doing more math than I expected, because the coordinate system goes from 0 at the bottom of the content area, to +1000 or whatever at the top of the content area (i.e. it's bottom-up instead of top-down). The child objects are created from a prefab that also has Top-Left anchors and 0,0 pivot.
    Here are the relevant bits of code.
    Code (CSharp):
    1.     void Start() {
    2.         rowHeight = entryPrefab.GetComponent<RectTransform>().rect.size.y;
    3.         rows = 10;
    4.         contentHeight = rowHeight * rows;
    5.  
    6.         Vector2 size = GetComponent<RectTransform>().sizeDelta;
    7.         GetComponent<RectTransform>().sizeDelta = new Vector2(size.x, contentHeight);
    8.  
    9.         for (int i=0; i<rows; i++) {
    10.             AddEntry(i);
    11.         }
    12.     }
    13.  
    14.     void AddEntry(int row) {
    15.         GameObject entry = Object.Instantiate(entryPrefab, Vector3.zero, Quaternion.identity) as GameObject;
    16.         entry.transform.parent = transform;
    17.         entry.name = "Achievement " + row.ToString();
    18.         entry.transform.localPosition = new Vector3(0, contentHeight - rowHeight - rowHeight*row, 0);
    19.         entry.transform.Find("TitleText").GetComponent<Text>().text = entry.name;
    20.         Debug.Log("Instantiated " + entry.name + " at " + entry.transform.localPosition);
    21.     }
    There is also a Scrollbar hooked up to the ScrollRect component, which behaves very oddly: I can set its default Value to 1, but as soon as I hit Run, it goes to 0... and it stays at 0 even after quitting the run! (How rude.)

    I suspect there's something wrong in my setup that is causing this, perhaps related to the inverted coordinate system (with 0 meaning "bottom" and 1 meaning "top"). But I've googled and experimented, and I'm stumped. Can somebody throw me a clue?
     
  2. JoeStrout

    JoeStrout

    Joined:
    Jan 14, 2011
    Posts:
    8,207
    Nobody? Have I stumped the interwebs?
     
    Lohoris2 likes this.
  3. JoeStrout

    JoeStrout

    Joined:
    Jan 14, 2011
    Posts:
    8,207
    Fine then, I'll just solve it myself. ;)

    It turns out that the key is the pivot on the content object. With a pivot set to 0,0, the pivot is in the bottom-left corner. I then had to position everything bottom-up, with that weird math in the code above, and the scroll position started at bottom.

    But if I set the pivot to 0,1, i.e. the top-left corner, then things are more sensible. Content now builds from the top down. I still have to use negative numbers (because +Y is "up" in the Unity GUI coordinate system), but at least they're more sensible negative numbers — each entry is simply positioned at -row * rowHeight. And the scroll view starts at the top, instead of the bottom. Huzzah.

    Unity, if you're listening, you really need to add a preset for a scroll view (Create > UI > Scroll View), including a properly configured content view. There are way too many hoops to jump through, and too many easy mistakes to make, in setting one of these things up, and it's going to be a frequent stumbling block for newbies (such as myself).

    But I've got it sorted out now, so it's back to work for me... and hopefully, the next poor sap to run into this problem will find this thread, and waste less time than I did!
     
  4. bobbymcsteels

    bobbymcsteels

    Joined:
    Mar 15, 2013
    Posts:
    12
    Thanks, this helped me out although I was looking for the opposite of you, I was trying to make my scrollview start from the bottom and the user has to scroll upwards... it's for a chat room.
     
    JoeStrout likes this.
  5. vahi4m

    vahi4m

    Joined:
    Apr 27, 2014
    Posts:
    1
    It my be late, but try setting the position of the content of scrollview.
     
    PloyGTM and CoughE like this.
  6. guneyozsan

    guneyozsan

    Joined:
    Feb 1, 2012
    Posts:
    63
    I generate scroll content on the fly. In my case I also needed to set Anchor Y to 1. Here is my setup:
    upload_2019-5-18_12-51-37.png
     
    qpzmwn likes this.
  7. ImperativeGames

    ImperativeGames

    Joined:
    Dec 11, 2016
    Posts:
    32
    Yep, had to manipulate Pivot of Content object, set it to 0 or 1. Shame on Unity, still didn't implement basic things like that!
    Thank you for the help guys)