Could you provide a way to get random icons?

Thank you :)

Icon "fa-user" from Solid font-kit is inaccessible, instead we have the fa-user from regular font-kit.
Would be great if we could select which font style we want the icon. Something like FontAwesomeRegular.user and FontAwesomeSolid.user

Othe think, the icon "fa-mug-hot" is not in files yet.

Thank you in advance for attention!

I've got font awesome pro files. Can i add font awesome pro icons to this package too? If yes please guide me.

Can the color of this icon be changed?

Hi There,

I would love to be able to use this plugin for my flutter web projects. Is this something you guys will be looking into soon?

nvm. i forgot to update pubspec to 8.0.1 - sorry

Fontawesome icons are little bigger than Icons in material/package
Can you make them same size so its consistent across the app
There is a little padding around icons in material package

They work on mobile, but are cut on web.

Sample code:
Icon( FontAwesomeIcons.desktop, size: 30, color: Colors.black, )

Attached the example (third icon working correctly, added for reference)

Font Awesome lists their signature icon as looking like this:

But when I use it in my app, I'm getting something different:

Icon(FontAwesomeIcons.signature)

I'm using the latest version (8.4.0) and when I switch the icon out for any other, it looks normal.

Icon rendered is outside the container.

https://fontawesome.com/changelog/latest

Hi :) I'm not sure if this is the right place to report this issue (apologies if not, just close it if so) -- but I'm having an issue with a specific icon - the G+ one, which seems to be wider than what it is reporting ..

So, this Flutter code:

                              children: [
                                new Icon(FontAwesomeIcons.googlePlus),
                                new Text('Logg inn med Google')
                              ]
                          ),

.. will cause the Icon to overlap the text on the right.

See example with the G+ icon in the second FlatButton here: http://i.imgur.com/TXAhJr2.png
Other icons, ie. the Facebook f and Google Plus squared work fine: http://i.imgur.com/HgDmmIj.png

I dont see icons in the assets like in font-iconic but I see a builder. There is no example, and I cant get my head around it how to use the builder.

Could you please make some instructions in the readme how to generate icons?

Thank you

Google icons are missing. I used: Icon(FontAwesomeIcons.googlePlus)
and this is the result:

Description

When Running on Android it is showing blank boxes for the Font Awesome Icons, and Showing the correct ones for Flutter Icons. This was working when I installed it last week. I have also run flutter clean but still no luck.

Flutter Doctor

Rodys-MBP:daily_nasa rodydavis$ flutter doctor
Doctor summary (to see all details, run flutter doctor -v):
[✓] Flutter (Channel beta, v0.3.1, on Mac OS X 10.13.3 17D102, locale en-US)
[✓] Android toolchain - develop for Android devices (Android SDK 27.0.3)
[!] iOS toolchain - develop for iOS devices (Xcode 9.3)
    ✗ Verify that all connected devices have been paired with this computer in Xcode.
      If all devices have been paired, libimobiledevice and ideviceinstaller may require updating.
      To update, run:
        brew uninstall --ignore-dependencies libimobiledevice
        brew install --HEAD libimobiledevice
        brew install ideviceinstaller
[✓] Android Studio (version 3.1)
[✓] VS Code (version 1.23.0)
[✓] Connected devices (2 available)

! Doctor found issues in 1 category.

Dependency

font_awesome_flutter: 6.0.0

Use in Project

@override
  Widget build(BuildContext context) {
    return new Scaffold(
      appBar: new AppBar(
        backgroundColor: Colors.white,
        title: new Text("Info"),
      ),
      body: new SingleChildScrollView(
        child: new ListBody(
          children: <Widget>[
            new Container(
              height: 10.0,
            ),
            new ListTile(
              leading: new Icon(FontAwesomeIcons.github),
              title: const Text('Github'),
              subtitle: new Text('@AppleEducate'),
              onTap: () {
                globals.Utility
                    .launchURL('https://www.github.com/appleeducate');
              },
            ),
            new Divider(
              height: 20.0,
            ),
            new ListTile(
              leading: new Icon(FontAwesomeIcons.twitter),
              title: const Text('Twitter'),
              subtitle: new Text('@RodyDavis'),
              onTap: () {
                globals.Utility.launchURL('https://www.twitter.com/rodydavis');
              },
            ),
            new Divider(
              height: 20.0,
            ),
            new ListTile(
              leading: new Icon(FontAwesomeIcons.facebook),
              title: const Text('Facebook'),
              subtitle: new Text('@RodyDavis'),
              onTap: () {
                globals.Utility.launchURL('https://www.facebook.com/rodydavis');
              },
            ),
            new Divider(
              height: 20.0,
            ),
            new ListTile(
              leading: new Icon(Icons.apps),
              title: const Text('Apps'),
              subtitle: new Text('by Rody Davis'),
              onTap: () {
                globals.Utility.launchURL('https://www.rodydavis.com/apps');
              },
            ),
            new Divider(
              height: 20.0,
            ),
            new ListTile(
              leading: new Icon(Icons.contact_mail),
              title: const Text('Contact'),
              subtitle: new Text('Submit Issues and Questions'),
              onTap: () {
                globals.Utility.launchURL('https://www.rodydavis.com/about');
              },
            ),
            new Divider(
              height: 20.0,
            ),
            new ListTile(
              leading: new Icon(FontAwesomeIcons.spaceShuttle),
              title: const Text('NASA'),
              subtitle: new Text('All Images provided by API'),
              onTap: () {
                globals.Utility.launchURL('https://api.nasa.gov/');
              },
            ),
            new Divider(
              height: 20.0,
            ),
            new ListTile(
              leading: new Icon(Icons.info),
              title: const Text('Version'),
              subtitle: new Text('$_projectVersion ($_projectCode)'),
              trailing: new Text('$_platformVersion'),
            ),
          ],
        ),
      ),
    );
  }

What do I have to do to get FontAwesomeIcons showed on Gutter bar in Android Studio?

I have restarted IDE, recompiled app, but nothing happens. Icons display correctly in my app, but I really love viewing gutter icons in editor window.

I want to use this plugin for HTML to render image icons. So, is there any way to get base64 string of icon?

Any plans to update this to Font Awesome 5.8? It includes a bunch of new icons:

https://fontawesome.com/changelog/latest

Let say we need a addressBook Icon. In flutter we can render via Icon( icon.iconData, size: 100.0, ),

But when we want to use the same icon to render html page we have to use address-book. So, it would be better if you put key as real icons key like address-book by mapping the real name into that object property.

Hey Brian,

I'm loving these icons, but some of them graphically seem shifted relative to their widget constraints - see how the 'users' icon is shifted to the right on this TabBar:

Not an issue that rears its head often, but some widget orientations (like the above icon cross-axis centered in a column) look pretty off without adjustment. Is there an easy fix?

After flutter upgrade I got error with following message as response to flutter packages get:

The current Dart SDK version is 2.1.0-dev.0.0.flutter-be6309690f.
Because app depends on font_awesome_flutter >=4.7.1 which requires SDK version <2.0.0, 
version solving failed.

Building failed.

hey there..
I'm having problem with installing this package, currently I'm using Dart 2.4.0 and when I tried installing font-awesome the version greater than 8.0.0.. didn't work, it shows me a black box only on all icons.

then I tried install other version and I get error when I run flutter packages get
Because MyApp depends on font_awesome_flutter >=4.7.1 <8.0.0 which requires SDK version <2.0.0, version solving failed.

any solutions?

Hey,

I'm using font_awesome_flutter in a project but I'm having an issue I don't know how to work around. In the attached picture you can see that the icon draws outside of the "bounds" that I'm trying to layout. This is making it super difficult to center an icon in a circle, like I'm trying to in my app :)

Is this something happening in the package or is there a way to lay it out better in flutter?

Thanks for any help :)

Hello,

Is there any way to have the same icon but with a different style ?
For example, font awesome icon heart is both present in Regular and Solid style. By default it is set to :

static const IconData heart = const IconDataRegular(0xf004);

But how can we handle :

static const IconData heart = const IconDataSolid(0xf004);

Have we to create a new const and add a new name like heart_solid ?

font_awesome_flutter can be added to FlutterArsenal to help with reach, accessibility and ease-of-use. Flutter Arsenal is a directory that is being curated for Flutter libraries and tool. The best way to do is by creating an issue on github.

Interest
Dancing
Conference
Publication
Reference
Tutorial
Yoga

wikipediaW icon is not aligned in the center.

Work around to make it center:

Align(
            alignment: Alignment.centerLeft,
            child: Icon(FontAwesomeIcons.wikipediaW),
  )

Hello!
Sorry if this sounds "dumd" but the documentation says that the library contains Regular, Solid and Brand formats, but I can't figure out a way of how to use them.

Is this implemented? If yes, maybe a improved documentation could be very handy!

Thanks!

Hello i'm trying to create a version of your library working with map (i find the solution of the branch `icon-map" not well for me).

I create a generate class using json of icon but the file's url is not available now :
https://raw.githubusercontent.com/FortAwesome/Font-Awesome/master/advanced-options/metadata/icons.json

So can you give the url used to generate 8.2 (or publish json on your github)

Someone asked a question about it on stackoverflow and I've done some tests with Show Debug Paint.

This could be related to these icons.

Centering child widget icon

https://github.com/brianegan/font_awesome_flutter/blob/8c5c152cea569c7deffb8acbf136bf8f2ac23cfb/tool/generate_font.dart#L37 should be changed to "style," because it's only pulling the first style (probably solid), which breaks the generator when trying to generate fonts with more than 2 styles

import 'package:font_awesome_flutter/font_awesome_flutter.dart';

Target URI doesn't exit.

I added dependencies like this:

dependencies:
  flutter:
    sdk: flutter
    font_awesome_flutter: 8.4.0

User-times icon is missing

https://fontawesome.com/icons/user-times?style=solid

Another in medical category is missing too.

It is really handy to have pictures next to icons like flutter Icons. Any chance this might be implemented here, or idea how to do it so I can do it?

For some reason it seems some of the free FA icons are not included in the package.
How can I add missing icons by hand?

I have used spinner icon as below but some how it is not spinning. It is just stuck with load icon.

       Align(
               alignment: Alignment.centerRight,
               child: IconButton(
                 icon: Icon(
                   FontAwesomeIcons.spinner,
                   color: Colors.white,
                   size: [18.0,]
                 ),
                 onPressed: () {}
               ),
             ),

Because myapp depends on font_awesome_flutter >=4.7.1 <8.0.0 which requires SDK version <2.0.0, version solving failed.

Here is a snapshot from your example app:

When using the applePay icon, it seems there's a missing character (the "y" at the end). See attached.

This is how your example page on font_awesome_flutter looks like. Please remove the template stuff.

Thanks.

New icons found here: https://fontawesome.com/

this is what happens, the visible part of the icon gets bigger, but the box that is registered by the layout etc. doesn't resize so the whole layout doesn't work out. I ran flutter clean, restarted all the devices, deleted the app from simulator, tried on android, tried other icons (some don't misalign to the side, but same problem with the icon box).

Column(
                      children: <Widget>[
                        IconButton(
                          icon: Icon(
                            FontAwesomeIcons.mars,
                            size: 80,
                            color: Colors.white,
                          ),
                        ),
                        SizedBox(height: 15),
                        Text(
                          'MALE',
                          style: TextStyle(
                            fontSize: 18.0,
                            color: Color(0xFF8D8E98),
                          ),
                        )
                      ],
                    ),

Flutter Doc:
`Doctor summary (to see all details, run flutter doctor -v):
[✓] Flutter (Channel stable, v1.12.13+hotfix.7, on Mac OS X 10.15.2 19C57, locale en-GB)

[✓] Android toolchain - develop for Android devices (Android SDK version 29.0.2)
[✓] Xcode - develop for iOS and macOS (Xcode 11.3.1)
[✓] Android Studio (version 3.5)
[✓] Connected device (1 available)

• No issues found!

There was a new Flutter version available earlier when I ran flutter doctor, but the same result before and after.

I found a solution here, but it gets pretty hardcoded this way and wrapping the container in an expanded widget did nothing for me.

I apologise if this issue is messy or unnecessary, just let me know and I'l close it. I'm pretty new to this whole thing.

Nice work :)
Would be nice if there were a function to get Icons by there original name like:
FontAwesomeIcons.getByOriginalName('paint-brush');

if name dose not exists return the "?" :)

Add fromString method that will allow creating icons from strings. Eg:

FontAwesome.fromString("addressCard") should return const IconDataRegular(0xf2bb)

You can do this by generating another file with Map<String, IconData>

How can I add font-awesome pro features with this plugin?
Is there any way to integrate font awesome pro licence key with font-awesome-flutter so that all pro fonts are also available for use?

Code sample:

new CircleAvatar(child: new Icon(FontAwesomeIcons.users,size: 70.0, color: Colors.white,),
        backgroundColor: Colors.orange, radius: 70.0,);

Next example (this time from your documentation). IconButton repeated three times in Row. As you can see one icon overlaps another.

var button = new IconButton(
    iconSize: 100.0,
    icon: new Center(child:new Icon(FontAwesomeIcons.gamepad,)),
    alignment: Alignment.bottomRight,
    onPressed: () { print("Pressed"); }
);
Row(mainAxisAlignment: MainAxisAlignment.center,children: <Widget>[button, button, button],)