LoginSignup
2
2

More than 3 years have passed since last update.

FlutterアプリへFontAwesomeを追加する方法

Posted at

1,やり方

1-1,
pubspec.yamlのdependenciesに
font_awesome_flutter: ^8.11.0
を追加

pubspec.yaml
dependencies:
  flutter:
    sdk: flutter
 ## 省略 ##
  font_awesome_flutter: ^8.11.0

1-2,
flutter pub getする。

2,使い方

Twitterやインスタグラムのアイコンなど、Iconsからは取れないようなものに対して使います。
下記はボトムナビゲーションバーのサンプルです。
(font_awesomeの用例がメインのため、切り替えなどのギミックは除いてあります)

hoge.dart
import 'package:font_awesome_flutter/font_awesome_flutter.dart';
return Scaffold(
        appBar: //
        body: //
        backgroundColor: //
        bottomNavigationBar: BottomNavigationBar(
          items: const [
            BottomNavigationBarItem(
              icon: Icon(Icons.home,color: Colors.grey),
              title: Text("Home"),
            ),
            BottomNavigationBarItem(
              icon: FaIcon(FontAwesomeIcons.twitter,color: Colors.grey),
              title: Text("Twitter"),
            ),
            BottomNavigationBarItem(
              icon: FaIcon(FontAwesomeIcons.instagram,color: Colors.grey,),
              title: Text("Instagram"),
            ),
          ],
       ),
      );

3,使えるアイコン一覧
使えるアイコン一覧はこちらです。
https://fontawesome.com/icons?d=gallery

2
2
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
2
2