[iOS] 커스텀 폰트 추가 방법

OS 개발시에 기본 내장 폰트 말고 커스텀 폰트를 추가해서 사용하고 싶을 수가 있는데요.

오늘은 iOS UIKit 프로젝트에 커스텀 폰트를 넣어 사용하는 법을 알아 보겠습니다!

1. Font 폴더 만든 후 그 안에 폰트파일 넣기

먼저 프로젝트에 다운받은 폰트 .otf나 .ttf 파일을 Xcode 프로젝트에 끌어다 넣어주면 되는데요.

폰트를 한 폴더에 넣어 관리하기 위해 저는 Xcode 왼쪽 네비게이션 영역에서 프로젝트 폴더 밑에 Font 폴더를 생성 해준 후 그 안에 폰트 파일을 끌어다 넣어줬습니다.

 

 

2. Add to targets 체크해주기

파일을 프로젝트에 끌어다 추가하면 위와 같은 창이 뜨는데 Add to target을 체크해 줍니다.

여기서 체크해주지않으면 나중에 폰트 파일마다 들어가서 Target Membership 체크를 해줘야 해서 번거로워요.

Finish를 누르면 잘 추가된 것을 볼 수 있습니다.

 

3. info.plist에 폰트명 추가하기

먼저, 왼쪽의 네비게이션 영역에서 info.plist를 선택합니다.

 💡 info.plist란? (Information Property List)

우선, 프로퍼티 리스트(property list)는 iOS, NeXTSTEP 등에 이용되는 객체 직렬화를 위한 파일입니다. .plist라는 확장자를 가집니다.
Info.plist파일은 iOS에서실행 패키지에 관한 필수 설정 정보가 포함된 구조화된 텍스트 파일입니다.
일반적으로 유니코드 UTF-8로 인코딩되며 내용은 XML을 사용합니다.
root XML노드는 키, 밸류(Keys and Value)로 구성된 딕셔너리 형태이며, 시스템은 이 키와 값을 사용하여 앱과 앱의 설정을 가져옵니다.
따라서 플러그인, 프레임워크, 앱에 Info.plist가 있어야 합니다.
더 자세한 정보는 📎Apple 문서 에서 볼 수 있습니다.

 

Key 항목 중 Information Property List를 선택한후 오른쪽 + 버튼을 누릅니다.

Information Property List의 플러스 버튼 누른 후

Fonts provided by application 입력하고 선택하여 추가합니다.

Fonts provided by application 옆의 + 버튼을 눌러 추가한 폰트파일만큼 item을 추가한후 Value 값을 폰트 파일명으로 바꿔줍니다. 잘못 추가한 경우에는 - 버튼을 눌러 삭제하면 됩니다.

파일 명을 입력 할 때는 .otf, .ttf 등의 확장자까지 포함하여 입력해줍니다.

4. 간편하게 UIFont에 익스텐션 추가해주기

코드로 뷰를 짤 때 폰트를 손쉽게 설정해주기 위해서 다음과 같이 UIFont에 익스텐션을 추가해서 사용하면 더욱 편하게 사용 할 수 있습니다.

UIFont++.swift

import UIKit

//AppFontName이라는 이름의 struct를 생성하여 그 안에 각 폰트파일명을 간단한 상수로 선언
struct AppFontName {
    static let DINEng = "DINEngschriftStd"
    static let DINMittel = "DINMittelschriftStd"
    static let DINBdCond = "DINNeuzeitGroteskStd-BdCond"
    static let DINLight = "DINNeuzeitGroteskStd-Light"
    static let DINProblack = "DINPro-Black"
    static let DINProBold = "DINPro-Bold"
    static let DINProLight = "DINPro-Light"
    static let DINProMedium = "DINPro-Medium"
    static let DINProRegular = "DINPro-Regular"
    static let HanSansBold = "SpoqaHanSansNeo-Bold"
    static let HanSansLight = "SpoqaHanSansNeo-Light"
    static let HanSansMedium = "SpoqaHanSansNeo-Medium"
    static let HanSansRegular = "SpoqaHanSansNeo-Regular"
    static let HanSansThin = "SpoqaHanSansNeo-Thin"
}
extension UIFont{
    
		//인자로 size를 넣어주면 해당 size의 글꼴의 UIFont 리턴하는 함수 생성
		//폰트명을 이용하여 함수명 설정
   class func dinEngFont(ofSize size: CGFloat) -> UIFont {
        return UIFont(name: AppFontName.DINEng, size: size)!
    }
    
    class func dinMittelFont(ofSize size: CGFloat) -> UIFont {
        return UIFont(name: AppFontName.DINMittel, size: size)!
    }
    
    class func dinBdCondFont(ofSize size: CGFloat) -> UIFont {
        return UIFont(name: AppFontName.DINBdCond, size: size)!
    }
    
    class func dinLightFont(ofSize size: CGFloat) -> UIFont {
        return UIFont(name: AppFontName.DINLight, size: size)!
    }
    
    class func dinProBlackFont(ofSize size: CGFloat) -> UIFont {
        return UIFont(name: AppFontName.DINProblack, size: size)!
    }
    
    class func dinProBoldFont(ofSize size: CGFloat) -> UIFont {
        return UIFont(name: AppFontName.DINProBold, size: size)!
    }
    
    class func dinProLightFont(ofSize size: CGFloat) -> UIFont {
        return UIFont(name: AppFontName.DINProLight, size: size)!
    }
    
    class func dinProMediumFont(ofSize size: CGFloat) -> UIFont {
        return UIFont(name: AppFontName.DINProMedium, size: size)!
    }
    
    class func dinProRegularFont(ofSize size: CGFloat) -> UIFont {
        return UIFont(name: AppFontName.DINProRegular, size: size)!
    }
    
    class func hanSansBoldFont(ofSize size: CGFloat) -> UIFont {
        return UIFont(name: AppFontName.HanSansBold, size: size)!
    }
    
    class func hanSansLightFont(ofSize size: CGFloat) -> UIFont {
        return UIFont(name: AppFontName.HanSansLight, size: size)!
    }
    
    class func hanSansMediumFont(ofSize size: CGFloat) -> UIFont {
        return UIFont(name: AppFontName.HanSansMedium, size: size)!
    }
    
    class func hanSansRegularFont(ofSize size: CGFloat) -> UIFont {
        return UIFont(name: AppFontName.HanSansRegular, size: size)!
    }
    
    class func hanSansThinFont(ofSize size: CGFloat) -> UIFont {
        return UIFont(name: AppFontName.HanSansThin, size: size)!
    }
}

UIFont의 인스턴스를 생성하지 않아도 바로 UIFont에서 함수를 가져와 UIFont.hansSansBoldFont() 이런식으로 사용하기 위해 클래스 함수로 만들어줬습니다.

사용예시

다음과 같이 UIFont를 친 후 자동완성 기능으로 원하는 폰트를 가져와 사이즈를 지정하면 간편하게 사용할 수 있습니다.

//Snapkit과 Then 라이브러리를 사용한 코드
private let titleLabel = UILabel().then{
        $0.text = "약속 신청"
        $0.font = UIFont.hanSansBoldFont(ofSize: 18)
    }