^(코딩캣)^ = @"코딩"하는 고양이;

[iOS・iPadOS] 앱에 커스텀 폰트(custom font) 적용하기.

API/Cocoa
2021. 8. 14. 21:44

iOS・iPadOS

이전 게시글: Application의 이름 localization 적용하기.

다음 게시글: iOS 앱에서도 안드로이드처럼 DrawerLayout(사이드 메뉴) 만들기

 

앱에 커스텀 폰트(custom font) 적용하기.

이번 시간에는 iOS 또는 iPadOS 앱에 커스텀 폰트를 내장시킨 후 이를 적용시키는 방법에 대해 정리한다.

 

1 단계. 커스텀 폰트 적용 전

전・후 비교를 확실하게 보기 위하여 일단 스토리보드에 적당한 텍스트를 추가한다. 시스템 폰트가 적용되어 있고, 폰트 목록에도 아직 커스텀 폰트가 나타나지 않는다.

목록에 시스템 기본 폰트들만 떠 있고, 텍스트 폰트도 기본 폰트만 적용되어 있다.

 

2 단계. 커스텀 폰트 추가

앱에서 사용하고자 하는 폰트 파일을 Xcode의 프로젝트 내비게이터(Project navigator) 안으로 복사해 넣는다. 여기에서는 무난한 나눔폰트(나눔명조)를 사용해 보겠다.

나눔명조체 파일을 Xcode 프로젝트 안으로 드래그하여 넣는다.

 

3 단계. 번들에 커스텀 폰트 인식

앱에 폰트가 추가되었음을 번들(bundle) 차원에서 알고 있어야 한다. 이를 위해 ① 프로젝트 내비게이터(Project navigator) - ② 최상단 항목 - ③ TARGET에서 해당 항목을 선택한 후 ④ Info 탭을 클릭한다. Custom iOS Target Properties에서 ⑤ [+] 모양의 버튼을 클릭하여 ⑥ "Fonts provided by application"이라는 이름이 붙은 변수를 새로 추가한다.

번들에게 새 폰트가 추가되었음을 알린다(1).

 

새로 추가할 폰트의 수만큼 Item을 추가한 다음 각 Item마다 폰트 파일의 이름을 정확하게 적는다.

번들에게 새 폰트가 추가되었음을 알린다(2).

 

4 단계. UI 요소에 커스텀 폰트 적용

그 다음 스토리보드로 돌아가서 커스텀 폰트를 적용한다. 폰트를 적용할 대상을 클릭하고 폰트 유형을 System에서 Custom으로 바꾼 다음, 폰트 이름을 클릭하여 폰트 목록을 연다.

UI 요소에 커스텀 폰트를 적용한다(1).

 

폰트 목록에서 앞의 1단계에서는 없었던 폰트가 추가된 것을 확인할 수 있다. 이것으로 앱에 커스텀 폰트 적용이 끝났다.

UI 요소에 커스텀 폰트를 적용한다(2).
UI 요소에 커스텀 폰트를 적용한다(3).

카테고리 “API/Cocoa”
more...