在 Flutter 中使用自訂字型

在 Flutter 中使用自訂字型

💡 原文中文,约3800字,阅读约需9分钟。
📝

内容提要

本文介绍如何从 Google Fonts 下载字体并在 Flutter 项目中使用。首先,访问 Google Fonts 网站,选择并下载字体。然后,将字体文件放入项目的 fonts 文件夹中,并在 pubspec.yaml 中注册字体。最后,通过设置全局字体或特定 Widget 来应用字体,并确保重新启动应用以生效。

🎯

关键要点

  • 從 Google Fonts 網站下載字型,選擇喜歡的字型並下載整個字型家族的 .zip 檔案。
  • 將字型檔案放入 Flutter 專案的 fonts 資料夾中,並確保檔案結構正確。
  • 在 pubspec.yaml 中註冊字型,確保格式正確並使用空格進行縮排。
  • 可以全域設定字型或針對特定 Widget 設定字型,並在程式碼中使用 fontFamily 屬性。
  • 完成修改後,需重新啟動應用以使字型設定生效。
  • 可選擇使用 GoogleFonts 套件來簡化字型使用,但會增加應用的 bundle 大小。

延伸问答

如何從 Google Fonts 下載字型?

訪問 Google Fonts 網站,選擇喜歡的字型,然後點擊「Download family」按鈕下載整個字型家族的 .zip 檔案。

在 Flutter 專案中如何註冊字型?

在 pubspec.yaml 中的 flutter 區塊下加入 fonts 設定,確保格式正確並使用空格進行縮排。

如何在 Flutter 中使用自訂字型?

可以在 MaterialApp 的 theme 屬性中設定全域字型,或在特定 Widget 的 style 屬性中指定字型。

為什麼字型變更需要重新啟動應用?

字型變更需要 Hot Restart 或 Stop → Run 才能生效,僅使用熱重載可能無法讓字型設定生效。

使用 GoogleFonts 套件有什麼優缺點?

使用 GoogleFonts 套件可以簡化字型使用,但會增加應用的 bundle 大小。

在 pubspec.yaml 中如何正確設定字型的 weight?

weight 必須對應標準字重表,常見的值有 400 代表 Regular,700 代表 Bold,確保正確匹配。

➡️

继续阅读