Question

我正在尝试在Flutter上使用自定义itens，但是图标的渲染方式就像一个内部带有X的正方形。

我将.ttf文件放在资产文件夹中。

custom_icons.dart

import 'package:flutter/widgets.dart';

class CustomIcons{
  CustomIcons._();

  static const _kFontFam = 'CustomIcons';

  static const IconData github_circled = const IconData(0xf09b, fontFamily: _kFontFam);
  static const IconData facebook_official = const IconData(0xf230, fontFamily: _kFontFam);
}

在pubspec.yaml中，我将其添加

fonts:
    - family : CustomIcon
      fonts:
        - asset: assets/fonts/FbIcon.ttf
        - asset: assets/fonts/GitIcon.ttf

我要这样导入

import 'package:project/styles/custom_icons.dart';

并像这样使用

IconButton(
  icon: Icon(CustomIcons.facebook_official),
  disabledColor: Colors.black54,
  color: Colors.black54,
  iconSize: 40,
  onPressed: () => _launchURL("http://facebook.com")
)

如何解决此问题

我已解决问题，但看起来并不正确，我不得不将这样的两个图标分开在不同的文件中（并在IconData中撤消const参数）

import 'package:flutter/widgets.dart';

class FacebookIcon{
  FacebookIcon._();

  static const _kFontFam = 'facebook';

  static const IconData github_circled = IconData(0xf09b, fontFamily: _kFontFam);

}

和其他图标相同，在pubspec.yalm上我做到了

fonts:
    - family : facebook
      fonts:
        - asset: assets/fonts/FbIcon.ttf
    - family : github
      fonts:
        - asset: assets/fonts/GitIcon.ttf

有人知道为什么只能以这种方式工作吗？

图标不使用自定义图标呈现

0 个答案: