Problem with positionning panel

Unity Engine
1

Hello everybody :slight_smile:

I’m trying to making a system to move smoothly the panel to the up when a new message is add to it ( Like messenger app )

For this I use these line of code on the panel wich contain message element:

float valutoadd = lastbutton.GetComponent<RectTransform>().rect.height / 2;

float distance = Mathf.Abs(minposTR.position.y - (lastbutton.position.y - valutoadd));

if ((lastbutton.position.y - valutoadd) > minposTR.position.y)
{
        up = false;
}

transform.position += Vector3.up * Time.deltaTime * (speed * distance);

Debug.Log(" valu to add" + valutoadd + "// Distance:" + distance + " POS lastbutton:" + (lastbutton.position.y - valutoadd) + "  Minpostr pos:" + minposTR.position.y);

The weirdest part comes here… When I add the value "valutoadd " , the final position of my panel is wrong…
If I remove "valutoadd " to all line of code , the position of the panel is good.

I Post here some screenshot for more details :

403×666 65.5 KB

In this first screen ( MinPos in red) , I removed valutoadd , corresponding to the height /2 of the message element.
And it’s work perfectly at this point, the center of the message align to the MinPos Y.

But I need to the panel to move up to have the bottom of the message element align to the MinPos
That’s why I calculate :

 float valutoadd = lastbutton.GetComponent<RectTransform>().rect.height / 2;

So if I add it to my code like above, this is what I have :

403×666 71.5 KB

You can see that MinPos and the bottom of the Message element are not align at all…

And I don’t understand what i’m doing wrong here …
When i’m getting the height/2, I take the white image background height , not the Text height.

If someone can explain me how to resolve that you will litteraly save my day ^^’ ( 10hours of debbuging and no solution here for me…)

Have a good day ! :)!

2

@shuskry

“I’m trying to make my own scroll panel”

I don’t see any code resembling scroll rect or such. So can you explain a bit more perhaps? It seems like you are simply trying to offset panel relative to previous panels.

Also, how are the panels wrong? Red X doesn’t tell much, do you mean that panels overlap each other or what. It is not obvious from the image.

When using UGUI system, it isn’t usually a good idea to use position, like you seem to be using everywhere. Canvas mode, screen pixel size and Canvas Scaler settings matter too. Usually it is easier to use localPositions IHMO.

Edit: and isn’t this actually a UI question?

3

@eses Sorry about talking about scroll panel, we remove this from the equation for sure.

Yes , i’m simply trying to move the panel ( not the offset), wich contain the UI message element on the Y axis .

So, I instanciate a UI message in a panel in down position, then I call Up bool then, the code above is executed in the Update function.

The problem is the positionnement of the panel wich contain the message.
I have a object Call MinPosTR , This is this object wich is select in editor view ( red cross on screenshot for his position)

So, I want to move up my panel holder until the Ui message element position become > than MinPos.y.

The first screen show what’s happen if I don’t add in the equation the calcul of the UI message element
(float valutoadd = lastbutton.GetComponent().rect.height / 2; )
The panel position is good in this case . Because the UI message element is positionning a the same Y of the MinPos object.

So the problem appear when I’m trying to get the Height/2 of the UI message element to add it in the equation to positionning the pannel more up
In the second screenshot, the red cross show the position of MinPos, and the blue cross the bottom of the UI Message element. Normaly, the bottom of the UI element should be positionning where the red cross is…
(Hope it’s more explain ^^)

For my Canvas I have to use : Scale with screen size, but don’t think that’s matter for this case :confused:

I don’t know if the problem is from UI or scripting :/…

4

Rects are in the local space of the Transform… if you are using position that is a world space value, your canvas could be scaled, or RectTransform containing the items could be scaled. Also, think what happens if you want to use your code in a rotated RectTransform… or in World space Canvas… so the question is - did you try using localPositions + your rect values instead of using position?

Here is an old example of mine where all position calculations are using local positions. That way you can scale and rotate container where the blocks (RectTransforms + Image) are, and blocks will still stack nicely with same offset values:

6409224--715686--blocks.gif

1 Like
5

@eses
I had the same problem that you when i wanted to instanciate and positionning multiple UI element Message but I solve that with local position like you said…

Here it’s seem to not work…

I tried with :

transform.localPosition += Vector3.up * Time.deltaTime * (speed * distance);

And nothing change :confused:

EDIT : Effectively , something is about screen size, I notice that if I change screen size, there is a difference of positionning

EDIT 2 :
I found a part of the solution :

float heithFactor = (float)Screen.height / canvas.ReferenceResolution.y;
float valutoadd = (lastbutton.GetComponent<RectTransform>().rect.height) /2;
valutoadd = valutoadd * heithFactor;

With this modified code, with all different screen size, the positionnement of the panel is always the same! I always have a difference bewteen the panel pos and the wanted pos, but the difference is always the same, so i can fix it.

The problem now is that the movement speed of the panel is not the same with different screen resolution but I just have to fix it with the heightfactor I get …

Thanks for everything ! :slight_smile: