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

Allow dynamic font size scaling in title label #3

Closed
FelixLisczyk opened this issue Jun 3, 2022 · 2 comments · Fixed by #4
Closed

Allow dynamic font size scaling in title label #3

FelixLisczyk opened this issue Jun 3, 2022 · 2 comments · Fixed by #4
Labels
bug Something isn't working

Comments

@FelixLisczyk
Copy link
Contributor

FelixLisczyk commented Jun 3, 2022

The title label currently uses a fixed font size:

private lazy var fontSize: CGFloat = traitCollection.horizontalSizeClass == .regular ? 80 : (UIScreenType.isiPhoneSE || UIScreenType.isiPhone6s ? 41 : 44)

This causes the layout to break with long app names and localization. For example, replace "Welcome to" with "Willkommen bei" and run the sample project on a small iPhone.

UILabel supports automatic text scaling by setting the adjustsFontSizeToFitWidth property to true and specifying a minimumScaleFactor. Unfortunately, this only works with single-line text.

My suggestion would be to split the title into two labels ("Welcome to" and app name), enable automatic text scaling for both, and place them inside a UIStackView.

I can create a PR with this change, but would like to hear your opinion first. @lascic.

@lascic
Copy link
Owner

lascic commented Jun 8, 2022

My initial thought when first building UIOnboarding was that the order between the app name and "Welcome to" could be in reversed or mixed order for some other languages, for which I let other developers decide how to name it in only one single NSMutableAttributedString and UIOnboardingLabel instance.

Another thought behind this was that in Apple's Stocks onboarding screen the title label always has only two lines, regardless of Dynamic Type setting or not. And this is something I want to stick with UIOnboarding. Let's assume we have the label's text size set to XXXL in Dynamic Type on an iPhone SE (1st generation). First, it would have too many lines and second, the words would be clipped which is hard for users to read. I can imagine it to look too big to read during the short time where the app icon and app name label get animated in the beginning.

Since we have layout issues with line breaks I'd say we do it the way you suggested – which sounds good to me. Only thing I'd like to keep is the two line restriction with the fixed font size alongside adjustsFontSizeToFitWidth toggled (the font size of both labels in that stack view should be identical in any case with adjusted line spacing) and a minimumScaleFactor set.

@FelixLisczyk
Copy link
Contributor Author

FelixLisczyk commented Jun 10, 2022

Hi @lascic,

Thank you for sharing your thoughts. I've added the first draft of my implementation to PR #4. The changes are currently only included in the "UIOnboarding Demo" project.

I haven't found a solution for the requirement yet that the two labels should always have the same font size. As far as I know, UILabel does not update its fontSize property when it scales down the text. I assume we would have to calculate the largest possible font size manually and apply it to both labels. That would defeat the main purpose of the automatic scaling, though.

If you have any other ideas, please let me know. You can also make changes to the code in my PR directly. Thanks! 👌

@lascic lascic added the bug Something isn't working label Jun 19, 2022
@lascic lascic linked a pull request Jun 19, 2022 that will close this issue
@lascic lascic closed this as completed in #4 Jun 21, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working
Projects
None yet
Development

Successfully merging a pull request may close this issue.

2 participants