[flutter] 플러터 아이콘 폰트 변경

18 Dec 2023

플러터 앱을 개발하다보면 기본적으로 제공되는 아이콘 폰트를 사용할 때 우리가 아는 아이콘들이 아닐 수 있습니다. 이때, 우리가 원하는 아이콘 폰트를 사용하려면 어떻게 해야 할까요? 이번 포스트에서는 플러터 앱에서 아이콘 폰트를 변경하는 방법에 대해 알아보겠습니다.

1. 새로운 아이콘 폰트 추가하기

우선, 우리가 사용할 새로운 아이콘 폰트 파일을 프로젝트에 추가해야 합니다. 이를 위해 프로젝트의 pubspec.yaml 파일에 아래와 같이 flutter_icons 섹션을 추가합니다.

flutter:
  fonts:
    - family: my_icon_font
      fonts:
        - asset: fonts/my_icon_font.ttf

여기서 my_icon_font.ttf는 사용할 아이콘 폰트 파일의 경로와 이름을 의미합니다. 필요에 따라 파일 이름과 경로를 변경해주세요.

이제 아이콘 폰트를 사용할 위젯에서 해당 폰트를 설정해야 합니다. 아래는 텍스트 위젯에서 새로 추가한 아이콘 폰트를 사용하는 예시입니다.

Text(
  '내 아이콘',
  style: TextStyle(
    fontFamily: 'my_icon_font',
    fontSize: 24,
  ),
)

위와 같이 fontFamily를 이용하여 사용하고자 하는 아이콘 폰트의 family 이름을 지정하여 설정할 수 있습니다.

마지막으로, 새로 추가한 아이콘 폰트에 있는 아이콘을 사용할 수 있습니다. 이때 Icons 클래스 대신 새로 추가한 아이콘 폰트의 이름을 사용하여 아이콘을 표현할 수 있습니다.

Icon( IconData(0xe900, fontFamily: 'my_icon_font'), size: 24, color: Colors.black,)

위와 같이 Icon 위젯에서 IconData를 이용하여 해당 아이콘 폰트의 유니코드 값을 지정해주고, 이때 fontFamily를 통해 새로 추가한 아이콘 폰트를 지정할 수 있습니다.

이제 우리의 플러터 앱에서 우리만의 아이콘 폰트를 사용할 수 있게 되었습니다. 필요에 따라 새로운 아이콘 폰트를 추가하고, 사용하는 방법에 대해 자유롭게 고민해보세요.