Hello !
I and my team we are searching for information about the new function to automatically truncate text. Do you know how it works ? What is the rules of truncating ? Because we made some tests and we don’t understant how it works actually
Make sure your text has a fixed height (cuts it off horizontally) or is set to fill content when using auto layout, otherwise figma does not know where to cut off your text and turns “truncate” off. (you need to turn it on again, might be one confusing point) If you are not using auto-layout and just constraints you can set your text to for example left and right and top and bottom in the constraints menu to make truncating work.
I think @Aurelien_Barbier is referring to the rule behind the truncation feature. It’s pretty weird, sometimes it advances by one character, at other times by four.
I’m also having this issue, sometimes it truncates in the middle of the word (what I want) and other times it will only truncate at the end of a word, leaving extra space rather than filling the whole frame.
Hi All, Thank you for bringing this to our attention!
After checking internally about the text truncation rules, we expect that the ICU word break rules will be applied.
If you’re experiencing something different, would you mind reaching out to our support team here?: https://help.figma.com/hc/en-us/requests/new?ticket_form_id=360001744374
Please be sure to use the email associated with your Figma account, and include the video of the issue you are facing.
This way, our team can go ahead and pass this along to our engineers so they can help us look into this further.
Any update on this, in plainer English than the “ICU word break rules”?
I’m working with a use case that is pretty common; i.e., I’m trying to create a simple banner notification with a title and timestamp that maintain 10 pixels of separation.
So, I have the title text set to “Hug” within an auto layout containing both text elements. This is then nested within another auto layout that controls all the banner elements. (e.g., icon, expand/collapse arrow, etc.)
Ideally, the title would ONLY be truncated when the banner width shrinks to the point that the title, timestamp, and expand/collapse arrow can no longer fit without overlapping or violating the padding rules of the auto layout. But I haven’t found a way to do this.
Setting a max-width on the title is a less-than-ideal solution, as I have to choose a narrow width that works with narrow banners. But when the banners are wider, the title text is still relatively short.
Also, it doesn’t resolve the truncation problem shared above whereby the text box extends by many spaces beyond the ellipsis.