What is the difference between the various LV_ALIGN_OUT_* alignments

General discussion
1

Hi,
As arguments to lv_obj_align_to, there are numerous LV_ALIGN_OUT_* constants defined in lv_area.h. The documentation in LVGL_Library.pdf just lists them and states “the following can be used”.
But what do these alignments mean? Which part of the obj_to_align (corner, middle of side, ???) is aligned relative to which part of reference_obj?
What adds to my confusion is that there are eg LV_ALIGN_OUT_TOP_LEFT and LV_ALIGN_OUT_LEFT_TOP!?! However, as far as I read the names, I would assume that LV_ALIGN_OUT_TOP_LEFT and LV_ALIGN_OUT_LEFT_TOP will work identical, although the constants have different values.
Still: some description of which part aligns with which part would be helpful.
Thanks,
Josef
PS I could try each one, but sometimes the effects are not clear and this would take ages during which I need to memorize every effect :wink:

2

Hey, the documentation has an image explaining what these alignment values do:

https://docs.lvgl.io/master/details/common-widget-features/coordinates.html#align-to-another-widget

3

@AndreCostaaa Ah … OK. I didn’t spot that one. I had actually expected this kind of image, but failed to find it. Thanks for pointing that out.

I still have two questions:

  1. which part of the obj_to_align is aligned? I assume the top left corner, but it didn’t look that way, when I tried LV_ALIGN_OUT_TOP_RIGHT: the bottom left corner of theobj_to_align was slightly left of the top right corner of the reference_obj, and
  2. what would be the difference between eg OUT_TOP_LEFT and OUT_LEFT_TOP?

It would be nice to have a description of the various alignments in terms of the x and y parameters of lv_obj_align_to().

4

I just did a small experiment, putting buttons at each of the 9 reference points of the screen: each button was fully visible put in the corresponding position.

So I think that lv_obj_align() and lv_obj_align_to() will choose a suitable point on the obj_to_align, eg (in my given example) LV_ALIGN_OUT_TOP_RIGHT will align the bottom right corner of the obj_to_align with the top right corner of the obj_reference, ie if, in the image you pointed me to, the alignment type is written above the rectangle, a point on the bottom of the obj_to_align will be used. Likewise, LV_ALIGN_OUT_LEFT_TOP will align the top right corner of the obj_to_align with the top left corner of the obj_refernce.
I’m tempted to put a table here …