I placed icons created with the "Flutter custom icons generator". But something is wrong.I would like to set up icons with a SVG-like design

Question

issue

I want to put icons like SVG. But I can't put it.

• The dart file generated by the Flutter custom icons generator.

class WDLogo {
  WDLogo._();

  static const _kFontFam = 'WDLogo';
  static const String? _kFontPkg = null;

  static const IconData arrow_back = IconData(0xe801, fontFamily: _kFontFam, fontPackage: _kFontPkg);
  static const IconData arrow_forward = IconData(0xe802, fontFamily: _kFontFam, fontPackage: _kFontPkg);
  static const IconData menu = IconData(0xe803, fontFamily: _kFontFam, fontPackage: _kFontPkg);
}

• pubspec.yaml

  fonts:
    - family: WDLogo
      fonts:
        - asset: assets/fonts/WDLogo.ttf

• icon widget

 "Icon(WDLogo.arrow_back))" 

https://www.fluttericon.com/

• SVG (Correct icon)

• Mac folder

• Flutter custom icons generator

• Mac font preview

Answer 1

You need to add your fonts to asset folder and defined it on pubspec.yaml file like this

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

first add plugin ,link : https://pub.dev/packages/fluttericon/install to your pubsepec.yaml file. after that import file. then Call Your icons like this

final myIcons = const <Widget>[
    const Icon(Typicons.attention),
    const Icon(Fontelico.emo_wink),
    const Icon(Linecons.globe),
];

DONT USE LIKE THIS "Icon(WDLogo.arrow_back))",

if You need to use SVG , you can use this Flutter svg plugin for that , link for plugin https://pub.dev/packages/flutter_svg

final String assetName = 'assets/image.svg';
final Widget svg = SvgPicture.asset(
  assetName,
  semanticsLabel: 'Acme Logo'
);