[Flutter]iconが四角になってしまう問題の解決

Question

実現したいこと

Flutter webで四角いボックスになってしまうアイコンを本来のデザインに戻したい。

発生している問題・分からないこと

以下の写真のようにアイコン（本来は歯車のアイコン）が四角いボックスになってしまいます。

原因はFlutter webでNotoSansを使用するためにFontManifest.jsonを作成したことです。
https://stackoverflow.com/questions/57344511/how-to-add-custom-font-in-flutter-web/63813137#63813137

該当のソースコード

特になし

試したこと・調べたこと

• teratailやGoogle等で検索した
• ソースコードを自分なりに変更した
• 知人に聞いた
• その他

上記の詳細・結果

そのため解決策として提示されていたMaterialIcons-Extended.ttfをアプリに取り込み、Fontmanifest.jsonを編集したのですが結局直りませんでした。
https://stackoverflow.com/questions/56067767/flutter-web-not-displaying-material-design-icons

補足

特になし

Answer 1

MaterialIcons-Extended.ttfをアプリに取り込み、Fontmanifest.jsonを編集するのはほぼ正しかったようです。
しかし僕の場合はttfファイルではなくotfファイルを使用する必要がありました。
https://stackoverflow.com/a/70875268/19464995