Clock_App / 폰트 삽입

생각해 보니 프로젝트를 만들 때 했어야 했던 것을 안 했던 것 같다.

지금 내 Figma에서 넣은 텍스트는 모두 inter폰트로 구성되어 있는데 현재 내 프로젝트 파일에는 들어가있지 않다.

https://fonts.google.com/specimen/Inter?query=inter

Inter - Google Fonts

우선 구글 폰트에 들어가서 inter를 다운로드 받아주었다.

그런 후 이제 이 다운로드한 폰트 파일들을 내 프로젝트로 옮겨줄 것이다.

파일 열어보면 사진처럼 되어있을 것인데 그냥 다 무시하고 ‘Inter-VariableFont_opsz,wght.ttf’ 이거 사용해 주었다.

이제 프로젝트 단에 fonts/라는 디렉토리를 생성해 주고 여기다가 방금 그 ttf파일을 삽입해 주면 된다.

잘 되었고 이렇게 들어갔다.

이제 pubspec.yaml에 들어가서 폰트를 정의해 주면 되겠다.

  fonts:
    - family: Inter
      fonts:
        - asset: assets/fonts/Inter-VariableFont_opsz,wght.ttf

 

이제 pub get해주면 사용준비 완료가 되었다.

flutter pub get

 

난 이 inter폰트를 파일 전체에 적용해 줄 것이기 때문에 main.dart안에 배치하였다.

이전에 만들어놓았던 ThemeData안에 fontFamily파라미터가 있어서 쉽게 넣을 수 있었다.

이렇게 폰트를 사용할 준비를 마쳤다.