Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

ListHeader: fix text cut off #3898

Merged
merged 1 commit into from
Sep 28, 2023

Conversation

jpelgrom
Copy link
Member

Summary

Prevent text from being cut off abruptly in the ListHeaders used in the app (on almost every screen) by calculating the number of lines that fit based on text size + overflow with ellipsis + centering text.

Screenshots

Before After default size After very large size (title only)
Wear screen with text in title showing 2.5 lines (text cut off) Wear screen with text in title showing 2 lines, ending in ellipsis Wear screen with large text in title showing 1 line, ending in ellipsis

Link to pull request in Documentation repository

n/a

Any other notes

 - Set overflow for ListHeader to ellipsis instead of cutting of text
 - Set the maximum number of lines for ListHeader based on the font size
 - Center text in the list header for nicer appearance in case of multiple ines
Copy link
Member

@dshokouhi dshokouhi left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks good to me, nice fix should hopefully take care of the text cut off issue that was reported

@JBassett JBassett merged commit 2f777a1 into home-assistant:master Sep 28, 2023
4 checks passed
@jpelgrom jpelgrom deleted the wear-text-cut-off branch September 28, 2023 21:48
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants