17. [Flutter] font awesome 위젯으로 Icon 사용하기

설치방법.

1. 아래 설치링크로 이동하여, pubspec.yaml 용 Install 소스를 복사합니다.

 

- 설치 링크: https://pub.dev/packages/font_awesome_flutter/install

font_awesome_flutter | Flutter Package

설치 소스

 

2. pubspec.yaml에 아래와 같이 복사된 소스를 붙여넣고 저장하면 설치가 끝납니다.

왼쪽 그림처럼 넣어주셔야 설치가 됩니다.

---

위젯 사용하기.

 

1. 사이트 접속 및 가입하기

 

- Font Awesome 사이트: https://fontawesome.com/icons

Font Awesome

 

---

2. 원하는 무료 아이콘 찾기

---

3. 패키지 및 위젯 추가하여 사용

패키지

import 'package:font_awesome_flutter/font_awesome_flutter.dart';

Widget 추가(google 아이콘)

FaIcon(FontAwesomeIcons.google),

*아이콘 size, color, 등 수정가능합니다.(예시 참고)

 

---

예시)

  
            AuthButton(
              text: 'Use Phone Or Email',
              icon: FaIcon(
                FontAwesomeIcons.phone,
                color: Colors.amber,
              ),
            ),
            Gaps.v10,
            AuthButton(
              text: 'Continue With Facebook',
              icon: FaIcon(
                FontAwesomeIcons.facebook,
                size: 30,
                color: Colors.blue,
              ),
            ),
            Gaps.v10,
            AuthButton(
              text: 'Continue With Apple',
              icon: FaIcon(
                FontAwesomeIcons.apple,
                size: 30,
              ),
            ),
            Gaps.v10,
            AuthButton(
              text: 'Continue With Google',
              icon: FaIcon(
                FontAwesomeIcons.google,
                size: 30,
                color: Colors.green,
              ),
            ),

위젯이 사용된 모습

---

 

아이콘 특성.