Dart (Flutter)
[Flutter] How to use Google Fonts in Flutter
llHoYall
2023. 6. 30. 22:26
이번 포스팅에서는 Flutter 앱에서 구글 폰트를 사용하는 방법에 대해 살펴보겠습니다.
Add Package
pubspec.yaml 파일을 열고, google_fonts를 추가해 줍니다.
dependencies:
flutter:
sdk: flutter
google_fonts: ^5.1.0
Import Google Fonts
다음으로 구글 폰트를 사용할 파일 상단에 다음과 같이 import 해줍니다.
import 'package:google_fonts/google_fonts.dart';
Setting Up for MacOS
예제를 macOS로 작성 중이라 추가로 HTTP fetching에 대한 설정이 필요합니다.
macos/Runner/DebugProfile.entitlements 파일을 열어 다음 key-value를 추가해 줍니다.
Usage
이제 다음과 같이 사용을 해 봅니다.
Text('Oswald', style: GoogleFonts.oswald()),
Text('Oswald Big', style: GoogleFonts.oswald(fontSize: 24)),
Text('NotoSans', style: GoogleFonts.notoSans(color: Colors.amber)),
기존에 Flutter에서 TextStyle을 사용하듯이 사용하면 되요.
Wrap Up
이번에는 Flutter에서 구글 폰트를 사용하는 방법에 대해 살펴보았습니다.
적절한 폰트의 사용은 앱을 좀 더 세련되어 보이게 도와주므로 꼭 필요한 기능입니다. ^^