iOS 13에서 .SFUIText, .SFUIDisplay Font가 Times New Roman이 되는 현상 기록.

안녕하세요 :) Zedd입니다.

오늘은 제 이슈..와 아직 해결은 안했지만..해결할거라 믿고 해결하는 과정을.. 그냥 기록해보겠습니다...

제목 넘 구구절절임???

디자이너 : 특정 어떤 Label은 SFUIText / SFUIDisplay font로 나왔음 좋겠는 부분..인정하는 부분?

iOS 개발자 : ㅇㅋㄷㅋ

여기서 하나 알고 가야하는 사실이 있는데, 지금부터 할거는 Xcode (beta seed 1), iOS 12.2입니다. 

(iOS 버전만 중요하게 보면 됩니다.)

이렇게 UILabel이 있다?

내가 font를 systemfont로 지정해주는데 size를 "19"로 지정해주겠습니다.

그리고 myLabel의 font가 뭘로 지정됐는지 보겠음

네 font-Family가  .SFUIText로 지정됐네요.

이렇게 출력해보면

그럼 size를 "20"으로 지정해주겠습니다.

그러니까 갑자기 .SFUIDisplay로 바뀌었네요. 

네 그렇습니다..! iOS에서는.....? 

출처 : https://developer.apple.com/design/human-interface-guidelines/ios/visual-design/typography/

이렇게 font의 size에 맞게 font가 바뀐다고 하는게 맞는 워딩인지 잘 모르겠는데 암튼 그렇습니다.

갑자기..San Francisco 폰트에 대해서 더 자세히 알고싶어서 위키를 살펴보게 되었습니당.

https://en.wikipedia.org/wiki/San_Francisco_(sans-serif_typeface)

전부 다 맞는 내용인지는 잘 모르겠지만...

암튼 위키에서는

- San Francisco는 무려 애플에서 "직접" 개발한 서체로, 산세리프 서체라고 합니다.

- San Francisco는 watchOS에서 처음 소개되었대요!!

- 그 다음해 WWDC에서 애플은 watchOS font로 SF Compact를 출시 && 동시에 SF UI(보통 SF UI가 그냥 "SF"라고 불린다고 하네요)를 소개했다고 해요. 이 SF UI는 OS X El Capitan, iOS 9에 사용되었다고 합니다. 

- High Sierra, iOS 11에서는 SF UI가..SF Pro에 의해...계승되었다..???(SF UI was succeeded by SF Pro. succeed가 계승하다..라는 뜻이있잖아요? 성공하다는;;이상하니까 암튼 그런뜻같아요)

아나 한글 위키 있었네?

https://ko.wikipedia.org/wiki/샌프란시스코_(글꼴)

안봐

자 지금 위에서 font size가 20보다 작으면 font-Famliy가 .SFUIText, 

20보다 크면 .SFUIDisplay로 지정됐었던거 기억하시죠?

언제?

Xcode 11 (beta seed 1), iOS 12.2 환경에서 ㅇㅇ

그럼 13.0으로 빌드를 해보겠습니다.

size가 19니까 font-Famliy가 뭐로 나와야한다?

.SFUIText

근데 뭐나온다??

.SFUI-Regular ㅇㅇ

근데 font-family랑 UIFont의 familyName이랑은 다른 정의(?)인가..?

familyName이 iOS13에서는 .AppleSystemUIFont네요.

그럼 20넣으면 어케됨

아나 저는 뭐 좀 바뀔 줄 알았는데 똑같네욥?

5를 넣어도, 100을 넣어도..".SFUI-Regular"가 font-family로 나오게 되네요.

아니 HIG에는

이렇게 되어있는데..이건 그럼 뭐지? 

업데이트가 안됐다기 보다는..일단 SF Symbols이야기도 있으니 업데이트 됐다는건데..

그럼 정답은 하나..

내가 틀렸다!

아니 근데 SF UI가 SF Pro를 계승한거 아녀?..

암튼 잘 모르겠네요? 이부분은..

그래서!!!! 제 문제점은 뭐였냐면요

이렇게 font-family를 하드코딩해서 넣어주고 있었거든요?

 

아니 왜 하드코딩했어?

1. SFUIText랑 SFUIDisplay차이는 자간값이라 (text 자간이 더 넓음) 레이아웃에 따라 다르게 씀

(디자이너 마음) 

2. 스케치에서 19줬다고 SFUIText로 되는거 아니고, 20줬다고 SFUIDisplay로 바뀌는거 아님

즉, 디자이너가 지정한게 스케치로 나온다.

그럼 어떤 화면에서는 size가 20이 넘는데 SFUIText가 될 수 있는거잖아요?

디자이너가 정하는거니까???

그래서 .systemFont(~)이런식으로 해줄 수 x

왜냐면 size에 따라 text인지 display인지 바뀌니까...

암튼

로 하면

이렇게 잘 나온단 말이지?

이렇게 잘 나오고?

근데!! iOS 13에서 

이 코드는

Times New Roman이 되더니...

.........

ㅋ...

자 그러며는..이걸 어떻게 해결하면 좋을까요.....iOS 13대응도 하면서...하위버전도 영향 안받ㄱㅔ..

일단 이와 관련된 WWDC세션이 있다는 사실..

https://developer.apple.com/videos/play/wwdc2019/227/

여기 키노트 보면

name으로 Font초기화..

- name으로 시스템 폰트 초기화 하지마셈. dot prefix(.)랑 같이 font name 쓰지마셈

뜨끔...

- name으로 폰트 초기화는 보장되지 않ㄴ는다구??? 왜냐면 font는 교체될 수도 있고..사용자 설치 font가 사라질 수도 있자나

아나 

그럼 어떻게 하징?

iOS13에서는 iOS12이전 버전과 다르게 font size에 따라 font-family가 바뀌지 않았었잖아요? 

.SFUI-Regular로 일괄적으로 나왔었는데..이렇게 하면 이전의 SFUIText랑 SFUIDisplay랑 암튼 얘네 자간자체가 다른데...그럼 디자이너가 원하는 font가 나올것이냐..! 이게 제 고민입니다. 

그러니까 .SFUI-Regular가 font size에 따라 (자간이) 달라지느냐...

이해가시나요..??

일단 제 눈에는...똑같아 보이는데..디자이너 분들의 눈에는...다를수도

근데 제가 볼땐...뭔가 SFUI"Text"랑 SFUI"Display"가 iOS 13에서 없어진느낌..? 

걍 SFUI로 된 느낌...???

 

그럼 iOS13도 커버하고 그 이전버전도 커버할라면

ㅇㅣ게 답이다....weight는 어차피 View에 따라 다르니까..제가 넣어주고 있었고, 

size에 따라 iOS 12 이전버전 에서는 다른 font가 나오겠고, iOS13에서는 SFUI-(weight)가 나오겠군요. 

이거 글 뭔가 저만 이해ㅣ......가능 할 것 같은데.....ㅋㅎ............뭐 어쩔 수 없지. 

암튼....일단은 이렇게 해결해보겠읍니다..