Skip to main content

Hello all! 😄


This post is LONG in the making, as I am trying to best explain what issue I am experiencing.


Background: I am working on a tab-like toggle switch that would allow users to filter search results.



End / desired result: Using the auto-layout feature enables me to add a background fill to a text box. That fill would indicate which side of the selector had been clicked, as in the screenshot below. ⬇️


image



In order to achieve this result, I have actually nested an auto-layout inside of an auto-layout; one for the text background color and one for the layout of the selector element itself. I believe this is where my issue is deriving from—however, I cannot verify whether that hypothesis is correct.


SO, the problem: after giving you that lengthy lead-in, here’s the issue. If you take a really close look at the image, you’ll notice a discrepancy between the left and right padding on the inside. I’ll blow it up and point it out:


image


As I said, I am unsure of what is causing this minor issue, but I feel that it has to do with the auto-layout-inside-auto-layout setup I’ve got going here.



If anyone can figure this one out, I would greatly appreciate it! Let me know if more context is needed, or if I need to spin up an example file for folks to experiment with.


Cheers and happy troubleshooting! 🥂


ML

Hi @micah_david.mn, with which tool did you create this divider: Line, Pen tool, Rectangle? If Line, then replace it with any of the two remaining ones.

Yes, I did use a line. When I switch it out for a rectangle, it does fix the issue. Why would there be any difference…? It’s odd that those elements could not be used interchangeably with the same result.


ML

The difference is that the stroke of the line only grows in one direction. Watch the video:


This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.

Terms & ConditionsCookie settings