Skip to main content

Auto-layout (fill container) should respect snap to pixel grid

Adam

For example, if I have 3 horizontal child containers with “Fill Container” constraint, they will divide their width by 1/3 pixels (Width: 16.33px) if inside an odd pixel number parent container. So now any element inside that child container is not able to be spaced according to it’s container unless manually typing sub-pixel x-axis placement. Very arduous and tedious workaround.

I’m not sure there’s an elegant solution to this outside of simply making one of the child containers 1 less pixel than the others. Does anyone else struggle with this?

EDIT: After further testing, I’ve realized that layout grids currently work in this way and auto-layout does not. This causes misalignment if using both of these methods in a frame (auto-layout modal within a parent layout grid frame)

7 replies

A

Totally agree! It happens with me all the time

Anna_Nalewajko

It would be great. For now, it’s kind of messy. 🙁

Lau
  • Lau
  • 1 reply
  • December 22, 2021

I am struggling with this issue and the worst part is that when a resource is exported its measure is not the expected.
For example: 3 tabs, each tab with icon + text. The measure of the icon is 16x16 but when exporting is 17x16. Moreover when it is exporte x3 a side part of the icon is cut.

I think is not necessary that visually we are able to see the icons in the right place but at least the exportation should be correct.

Meanwhile I have to provide this icons to the developer team isolated so they can export them correctly.

Hope it is fixed soon.

Issue_autolayout

Derick
  • Derick
  • 1 reply
  • December 22, 2021

I’ve run into this too. It seems that any node that is not positioned on a whole pixel - rounds up when it gets exported.

Lau
1 person likes this
  • Lau
    Lau
Lukas_von_Niederhausern

Yes, please!

royabbink
  • royabbink
  • 2 replies
  • November 25, 2022

Same here.

It’s annoying and messy when the auto layout (fill container) values aren’t matching the layout grid.

Piper_Deck

I think that retaining sub-pixel values in the live design artifact makes sense, but I would like it if there was a toggle for whether shapes should be rounded to the nearest whole-pixel during export (for example to png). This should also be reflected in pixel preview mode.

This is very important when designing for the precise resolution of a specific display. If I set the resolution of my design frame to match the display I’m designing for, I expect that to mean that 1-pixel wide lines should fall directly along a line of pixels in the final rendered image (at least for certain design applications).

I imagine that this could only be done near the very end of the layout process. If one box fills the width of the screen, and then 5 child boxes fill the space inside that box, and 3 more levels of nested boxes each fill their parent boxes, it will get really ugly really fast if each nested division rounds to the nearest whole pixel. But once all of the lines have landed in their sub-pixel defined destinations, I would like to have them snap to whole pixels when I export.

111660
A
2 people like this
  • 111660
    111660
  • A
    ahmedgazali

Reply


Terms & ConditionsCookie settings

Cookie policy

We use cookies to enhance and personalize your experience. If you accept you agree to our full cookie policy. Learn more about our cookies.

 
Cookie settings