【 font_awesome_flutter 】おしゃれなアイコンを実装しよう

本記事はそんな疑問、要望にお答えします。

Material Icon にないアイコンを使用可能にするパッケージ、
font_awesome_flutter パッケージを紹介します。

簡単に、様々なアイコンを実装可能です。
例えば以下のようにTwitterのアイコンも実装できます。

ぜひ本記事を読んで使い方を学んでみてください！

基本的な使い方

準備

まず準備として、パッケージのインストールと、
Dartファイルへのインポート文の追加を行います。

パッケージのインストール

CLI(macならターミナル)で、自分のプロジェクトのルートにて
以下のコマンドをで実行しパッケージをインストールします。

flutter pub add font_awesome_flutter

パッケージのインポート

ログ出力したいDartファイルの上部に以下のインポート文を追加し、
パッケージをインポートします。

import 'package:font_awesome_flutter/font_awesome_flutter.dart';

実装

実装方法について解説します。

アイコンを使用したい場所にFaIcon ウィジェットを配置し、
ウィジェットの第一引数として、
FontAwesomeIcons.~を設定します。

FaIcon(FontAwesomeIcons.solidAddressBook),

色と大きさの設定

FaIcon ウィジェットのプロパティで、size,colorをそれぞれ設定することで、
大きさと色を設定することが可能です。

        FaIcon(
          FontAwesomeIcons.twitter,
          size: 50,
          color: Color(0xFF1DA1F2),
        ),

まとめ

本記事では、Material Icon にないアイコンを使用可能にするパッケージ、
font_awesome_flutter パッケージを紹介しました。

いかがだったでしょうか？

font_awesome_flutterパッケージにて利用できるアイコンは、
フリーの、商用利用可能なアイコンとなります。

是非利用して、あなたのアプリをおしゃれにしてみてください！

本記事があなたのアプリ開発の一助となれば幸いです。

編集後記（2022/8/25）