seong

Flutter - Google font 적용 본문

Flutter/Flutter

Flutter - Google font 적용

hyeonseong 2023. 10. 16. 21:29

Google font를 적용하는 방법은 두가지가 있다.

1. 폰트를 다운 받은 후 적용

2. pub.dev에서 Google fonts 라이브러리를 활용한 적용


폰트를 다운 받은 후 적용 하는 방법

1. Google Fonts 사이트에 들어가서 마음에 드는 폰트 설치 

 

Browse Fonts - Google Fonts

Making the web more beautiful, fast, and open through great typography

fonts.google.com

2. 프로젝트 최상위 폴더에 assets/google_fonts 생성 ( 폴더 이름 상관 x )

3. pubspec.yaml 파일에 아래 처럼 fonts의 경로를 추가

 family는 아무거나 써도 되지만 웬만해선 font이름과 같게 사용하는게 좋을듯 하다.

4. TextStyle에서 fontFamily에 내가 쓴 것과 동일하게 작성해주면 된다. 

TiltNeon 폰트 적용


Google 라이브러리 활용한 적용

1. pub.dev에서 Google fonts를 찾아서 pubspec.yaml에 적용 

2. TextStyle에서 style에 GoogleFonts.getFont("적용할 폰트") 를 사용해주면 된다

'Flutter > Flutter' 카테고리의 다른 글

Flutter - ScreenUtil  (1) 2023.10.20
Flutter - Weather앱 TabBar 만들기  (0) 2023.10.18
Weather앱 만들기 - 날씨 API연동 (GetX,MVVM)  (0) 2023.10.13
Flutter - Pro Animate 3D 입체감 살리기  (0) 2023.09.14
Flutter - SideMenu  (0) 2023.09.12