Table of Contents Dots

Hi

I am attempting to create a table of contents with a Title, Page Number and in between them there would be Dots that would need to repeat based on the Title and Page Number width. I am trying to use only the built in UI scripts if possible.

The Dots are a tiled sprite consisting of a single dot and so far I have successfully set up my hierarchy with Layout Groups and Content Size Fitters to make the dot tile as many times as needed. However, sometimes they cut off in the middle…

So my question is, how can I tile a sprite but every time it tiles it needs to use the sprites width as a minimum? Or does someone perhaps have a better solution for this problem?

Thanks!

Maybe check the width of the ‘in between’ element that’s being filled with the sprite? Then since you know the width of the dot you could calculate any fractions that are in there and then somehow resize the elements according to what the size of the dots container should be? Maybe add a special spacer element that’s empty with a Layout Element that you can size to whatever you like.

It needs to be dynamic though, so I cannot set the size. The size needs to increment in steps of the dot sprites width.