Flutter

Flutterのネイティブ側からマテリアル・アイコンを使う

Flutter のアプリで使う画像などのリソースファイルがあります。

マテリアル・アイコンを有効にしている場合、これはフォントとしてFlutterアプリのアセットに含まれており、Flutterから使えるのは当然ですが、プラグインなどの Android / iOS 側のコードからも使うことができます。


Flutter

Flutterでマテリアル・フォントを使う場合は pubspec.yaml で以下のように設定します。おそらくデフォルトで有効になっていると思います。

flutter:

uses-material-design: true


Android

AssetManager を経由して、Flutter側のアセットへアクセスできます。

Typeface typeface = Typeface.createFromAsset(

getAssets(), "flutter_assets/fonts/MaterialIcons-Regular.ttf");

TextView yourText = (TextView) findViewById(R.id.your_material_icon);
yourText.text = "\uE15E";
yourText.setTypeface(typeface);


iOS

iOSでは、Xcodeのプロジェクトで、以下の位置にアセットファイルが追加されています。

- Runner

- Flutter
- flutter_assets
- fonts
- MaterialIcons-Regular.ttf

続いて、プロジェクトの設定 > info > Fonts provided by application に、このフォントを設定します。

あとは、UIFontを以下のように作り、UILabelなどに設定すればOKです。

let icon: UILabel = UILabel()

icon.text = String(UnicodeScalar(0xe3c9))
icon.font = UIFont(name: "Material Icons", size: size)


まとめ

Flutterのアセットは flutter_assets の下にすべて配置されています。

もちろん、マテリアル・フォント以外の、自分たちで追加したアセットも使うことができます。