Flutter에서 커스텀 폰트를 사용하는 방법은 무엇인가요?

Q1: Flutter 프로젝트에 커스텀 폰트를 추가하려면 어떻게 시작하나요?
A1: 먼저 프로젝트 내에 `assets/fonts`와 같은 폴더를 생성하여 원하는 커스텀 폰트 파일(예: `.ttf` 또는 `.otf`)을 넣습니다.

---

Q2: 커스텀 폰트를 `pubspec.yaml` 파일에 어떻게 등록하나요?
A2: `pubspec.yaml` 파일에서 `flutter:` 섹션에 폰트를 등록합니다. 예를 들어:

```yaml
flutter:
fonts:
- family: CustomFont
fonts:
- asset: assets/fonts/CustomFont-Regular.ttf
- asset: assets/fonts/CustomFont-Bold.ttf
weight: 700
```

위 예시에서 `family`는 폰트 패밀리 이름이며, 앱 내에서 이 이름으로 참조합니다.

---

Q3: 폰트를 등록할 때 여러 굵기(weight)나 스타일(italic)을 지정할 수 있나요?
A3: 네, 가능합니다. 각 폰트 파일에 대해 `weight`, `style`을 명시할 수 있습니다. 예:

```yaml
fonts:
- family: CustomFont
fonts:
- asset: assets/fonts/CustomFont-Regular.ttf
weight: 400
- asset: assets/fonts/CustomFont-BoldItalic.ttf
weight: 700
style: italic
```

---

Q4: 폰트 등록 후 앱에서 어떻게 사용하나요?
A4: `TextStyle`에서 `fontFamily` 속성에 등록한 `family` 이름을 사용합니다.

```dart
Text(
'커스텀 폰트 텍스트',
style: TextStyle(
fontFamily: 'CustomFont',
fontWeight: FontWeight.bold,
fontSize: 20,
),
)
```
---

Q5: 앱 전체에 커스텀 폰트를 기본 폰트로 설정하는 방법은?
A5: `MaterialApp` 혹은 `CupertinoApp`의 `theme` 속성 내 `TextTheme`를 수정하여 기본 폰트를 지정할 수 있습니다.

예:

```dart
MaterialApp(
theme: ThemeData(
fontFamily: 'CustomFont',
),
home: MyHomePage(),
);
```

이렇게 하면 앱 전체에서 `fontFamily`을 명시하지 않아도 커스텀 폰트가 기본 폰트로 적용됩니다.

---

Q6: 폰트 로딩 시 자주 발생하는 오류는 무엇이고, 해결 방법은?
A6: 주요 오류는 다음과 같습니다.

- `pubspec.yaml`의 들여쓰기 오류: YAML 파일의 들여쓰기가 맞지 않으면 폰트가 제대로 인식되지 않습니다. 스페이스 2칸 또는 4칸 일관되게 유지하세요.
- 폰트 경로 오류: 폰트 파일 경로가 정확한지 확인하세요. 상대경로를 올바르게 지정해야 합니다.
- `flutter pub get` 미실행: `pubspec.yaml` 수정 후, 반드시 `flutter pub get` 명령어를 실행해 변경사항을 반영하세요.

---

Q7: 웹이나 데스크톱 플랫폼에서도 커스텀 폰트가 적용되나요?
A7: 네, Flutter 웹, 데스크톱 모두에서 동일하게 `pubspec.yaml`에 폰트를 등록하면 작동합니다. 다만 웹에서는 폰트 용량이 크면 초기 로딩 시간이 늘어날 수 있으므로 최적화를 고려하세요.

---

Q8: 커스텀 폰트 사용 시 권장하는 폰트 포맷은 무엇인가요?
A8: `.ttf`(TrueType)와 `.otf`(OpenType) 형식을 모두 지원하며, 일반적으로 `.ttf`가 널리 호환됩니다. 웹에서는 `.woff` 또는 `.woff2` 포맷을 별도로 사용하는 경우가 많지만, Flutter 자체는 `.ttf`, `.otf`를 사용합니다.

---

Q9: Flutter에서 커스텀 폰트를 사용하기 위한 요약 단계는?
A9:
1. 프로젝트 내 `assets/fonts` 폴더 생성 및 폰트 파일 추가
2. `pubspec.yaml`에 폰트 등록 (들여쓰기 주의)
3. `flutter pub get` 실행
4. 코드에서 `TextStyle` 혹은 `ThemeData.fontFamily`에서 폰트명 지정
5. 앱 실행하여 정상 적용 확인

---

이상으로 Flutter에서 커스텀 폰트를 등록하고 사용하는 기본적인 절차 및 팁을 안내드렸습니다.

Flutter에서 커스텀 폰트를 사용하는 방법은 비교적 간단합니다.

아래 단계에 따라 커스텀 폰트를 프로젝트에 추가하고 사용하는 방법을 설명하겠습니다.

1. 폰트 파일 준비 먼저, 사용할 커스텀 폰트 파일을 준비합니다.

일반적으로 `.ttf` 또는 `.otf` 형식의 폰트 파일을 사용합니다.

이 파일을 Flutter 프로젝트의 `assets` 폴더에 저장합니다.

만약 `assets` 폴더가 없다면, 프로젝트 루트 디렉토리에서 새로 생성합니다.

예를 들어, `assets/fonts` 폴더를 만들고 그 안에 `MyCustomFont.ttf` 파일을 저장한다고 가정하겠습니다.



2. `pubspec.yaml` 파일 수정 다음으로, `pubspec.yaml` 파일을 열고 폰트 파일을 등록합니다.

`flutter` 섹션 아래에 `fonts` 항목을 추가하여 폰트를 정의합니다.

```yaml flutter: fonts: - family: MyCustomFont fonts: - asset: assets/fonts/MyCustomFont.ttf ``` 여기서 `family`는 폰트의 이름으로, 나중에 코드에서 이 이름을 사용하여 폰트를 참조합니다.



3. Flutter 앱에서 폰트 사용 이제 Flutter 앱에서 커스텀 폰트를 사용할 수 있습니다.

`Text` 위젯의 `style` 속성에서 `TextStyle`을 사용하여 폰트를 지정합니다.

```dart import 'package:flutter/material.dart'; void main() { runApp(MyApp()); } class MyApp extends StatelessWidget { @override Widget build(BuildContext context) { return MaterialApp( home: Scaffold( appBar: AppBar( title: Text('Custom Font Example'), ), body: Center( child: Text( 'Hello, Custom Font!', style: TextStyle( fontFamily: 'MyCustomFont', // 커스텀 폰트 사용 fontSize: 24, ), ), ), ), ); } } ```

4. 앱 실행 이제 앱을 실행하면, 지정한 커스텀 폰트가 적용된 텍스트를 볼 수 있습니다.

만약 폰트가 제대로 표시되지 않는다면, 다음 사항을 확인해 보세요: - `pubspec.yaml` 파일의 들여쓰기가 올바른지 확인합니다.

YAML 파일은 들여쓰기에 민감합니다.

- 폰트 파일의 경로가 정확한지 확인합니다.

- 앱을 다시 빌드하여 변경 사항이 반영되도록 합니다.

(예: `flutter clean` 후 `flutter run`)

5. 여러 폰트 스타일 추가 여러 스타일의 폰트를 추가하고 싶다면, `pubspec.yaml` 파일에서 추가적인 폰트 파일을 정의할 수 있습니다.

예를 들어, 볼드체와 이탤릭체를 추가하려면 다음과 같이 설정할 수 있습니다.

```yaml flutter: fonts: - family: MyCustomFont fonts: - asset: assets/fonts/MyCustomFont-Regular.ttf - asset: assets/fonts/MyCustomFont-Bold.ttf weight: 700 - asset: assets/fonts/MyCustomFont-Italic.ttf style: italic ``` 이렇게 하면, `TextStyle`에서 `fontWeight`와 `fontStyle` 속성을 사용하여 다양한 스타일을 적용할 수 있습니다.

결론 Flutter에서 커스텀 폰트를 사용하는 것은 간단하며, 위의 단계를 따르면 쉽게 구현할 수 있습니다.

다양한 폰트를 사용하여 앱의 디자인을 더욱 풍부하게 만들 수 있으니, 필요에 따라 다양한 폰트를 실험해 보세요.