dynamic_cached_fonts herunterladen - dynamic_cached

dynamic_cached_fonts

Schriftarten herunterladen

v1.2.0

Herunterladen

Dynamische zwischengespeicherte Schriftarten

Ein einfacher, benutzerfreundlicher, aber anpassbarer Schriftader für die Verwendung von Webschriften.

Demo: https://sidrao2006.github.io/dynamic_cached_fonts

Einführung

Mit dynamischen zwischengespeicherten Schriftarten können Sie eine Schriftart dynamisch von jeder URL laden und sie zwischenspeichern. Auf diese Weise können Sie Ihre Bündelgröße reduzieren und die Schriftart laden, wenn und wenn sie erforderlich ist.

Ein weiterer Vorteil des dynamischen Ladens von Schriftarten besteht darin, dass Sie Ihren Benutzern jetzt einfach eine Option zur Auswahl einer App -Schriftart bereitstellen können. Dies ermöglicht eine größere Anpassungsniveau.

Caching ist ein zusätzliches Leistungs -Upgrade, da die Schriftart nur einmal heruntergeladen und mehrmals verwendet wird, wodurch das Netzwerk und die Akku -Nutzung reduziert werden.

? Fangen an

Um das Paket zu verwenden, fügen Sie dynamic_cached_fonts als Abhängigkeit hinzu.

⚒️ Nutzung

Schriften bei Bedarf laden

Sie können beispielsweise die Schriftart auf Bedarf laden - wenn eine Seite geladen wird

 @override
void initState () {
  final DynamicCachedFonts dynamicCachedFont = DynamicCachedFonts (
    fontFamily : fontFamilyName, // The font family name to be passed to TextStyle.fontFamily
    url : fontUrl, // A valid url pointing to a font file (.ttf or .otf files only) 
  );
  dynamicCachedFont. load (); // Downloads the font, caches and loads it.

  super . initState ();
}
...
Text (
  'Some Text' ,
  style : TextStyle (fontFamily : fontFamilyName),
)

Oder wenn eine Schaltfläche angeklickt wird

 ElevatedButton (
  onPressed : () {
    final DynamicCachedFonts dynamicCachedFont = DynamicCachedFonts (
      fontFamily : fontFamilyName,
      url : fontUrl,
    );

    dynamicCachedFont. load ();
  },
  child : const Text ( 'Load Font' ),
),

Wenn Sie ändern möchten, wie groß der Cache sein kann oder wie lange die Schriftart im Cache bleibt, geben Sie maxCacheObjects und cacheStalePeriod weiter.

 DynamicCachedFonts (
  fontFamily : fontFamilyName,
  url : fontUrl,
  maxCacheObjects : 150 ,
  cacheStalePeriod : const Duration (days : 100 ),
);

TextStyle.fontFamily s werden erst nach dem Aufrufen von load() angewendet.

Das Aufrufen von load() wirft mehr als einmal ein StateError aus

Was ist, wenn Sie mehrere Schriftarten, unterschiedliche Gewichte und Stile, als Einzelfamilie laden müssen ... dafür können Sie den DynamicCachedFonts.family Constructor verwenden.

Es akzeptiert eine Liste von URLs, die auf verschiedene Schriftarten in derselben Familie wie urls hinweisen.

 DynamicCachedFonts . family (
  urls : < String > [
    fontFamilyNameBoldUrl,
    fontFamilyNameItalicUrl,
    fontFamilyNameRegularUrl,
    fontFamilyNameThinUrl,
  ],
  fontFamily : fontFamilyName,
);

Das Paket unterstützt auch das Laden der Schriftarten als Stream ! Der loadStream gibt einen einzelnen Abonnementstrom zurück, der die Schriftartdateien abgibt.

loadStream akzeptiert einen Rückruf, downloadProgressListener , der jedes Mal aufgerufen wird, wenn ein DownloadProgress -Ereignis empfangen wird. Dies geschieht nur, wenn die Schriftart tatsächlich aus der bereitgestellten URL heruntergeladen wird. Nachfolgende Anfragen, die normalerweise aus dem Cache bedient werden, geben keine Fortschrittsereignisse ab. Wenn die Schriftart abgelaufen ist, wird die Datei erneut heruntergeladen, für die die Fortschrittsereignisse in downloadProgressListener gestreamt werden.

Wenn loadStream mit einer einzelnen Schriftart -URL aufgerufen wird, wird itemCountProgressListener nur einmal aufgerufen, wenn die Schrift in den Motor geladen wurde.

 final DynamicCachedFonts dynamicCachedFont = DynamicCachedFonts (
  fontFamily : fontFamilyName,
  url : fontUrl,
);

dynamicCachedFont. loadStream (
  itemCountProgressListener : ( double progress, int totalItems, int downloadedItems) {},
  downloadProgressListener : ( DownloadProgress progress) {},
);

Und wenn loadStream verwendet wird, um eine ganze Schriftfamilie zu laden, wird itemCountProgressListener für jede Schriftart in der Familie einmal aufgerufen. In dem unten angegebenen Beispiel wird itemCountProgressListener 4 Mal aufgerufen, sobald jede Schriftart in den Fluttermotor geladen wurde.

 final DynamicCachedFonts dynamicCachedFont = DynamicCachedFonts . family (
  urls : < String > [
    fontFamilyNameBoldUrl,
    fontFamilyNameItalicUrl,
    fontFamilyNameRegularUrl,
    fontFamilyNameThinUrl,
  ],
  fontFamily : fontFamilyName,
);

dynamicCachedFont. loadStream (
  itemCountProgressListener : ( double progress, int totalItems, int downloadedItems) {},
  downloadProgressListener : ( DownloadProgress progress) {},
);

Das Aufrufen von loadStream mehr als einmal wirft ein StateError aus

Wenn Sie mehr Kontrolle benötigen, verwenden Sie die statischen Methoden!

`cacheFont`

onPressed : () {
  DynamicCachedFonts . cacheFont (fontUrl);
},
child : const Text ( 'Download font' ),

Auch hier können Sie maxCacheObjects und cacheStalePeriod übergeben.

`canLoadFont` , `loadCachedFont` , `loadCachedFamily`

canLoadFont wird verwendet, um zu überprüfen, ob die Schriftart im Cache verfügbar ist. Es wird normalerweise in Kombination mit den loadCached* -Methoden verwendet.

Überprüfen Sie zunächst, ob sich die Schriftart bereits im Cache befindet. Wenn ja, laden Sie die Schriftart.

 if ( DynamicCachedFonts . canLoadFont (fontUrl)) {
  // To load a single font...
  DynamicCachedFonts . loadCachedFont (
    fontUrl,
    fontFamily : fontFamilyName,
  );

  // Or if you want to load multiple fonts as a family...
  DynamicCachedFonts . loadCachedFamily (
    < String > [
      fontFamilyNameBoldUrl,
      fontFamilyNameItalicUrl,
      fontFamilyNameRegularUrl,
      fontFamilyNameThinUrl,
    ],
    fontFamily : fontFamilyName,
  );
}

Wenn die Schriftart im Cache nicht verfügbar ist, laden Sie sie herunter!

 if ( DynamicCachedFonts . canLoadFont (fontUrl)) {
  ...
} else {
  DynamicCachedFonts . cacheFont (fontUrl);
}

`cacheFontStream`

cacheFontStream wird verwendet, um die Schriftart herunterzuladen und zu zwischenstrahlen. Diese Methode ähnelt cacheFont , gibt jedoch einen einzelnen Stream zurück, der den Fortschritt des Downloads ausgibt. Der Download wird in den progressListener -Rückruf gestreamt, der jedes Mal aufgerufen wird, wenn ein DownloadProgress -Ereignis empfangen wird. Dies geschieht nur, wenn die Schrift tatsächlich aus der bereitgestellten URL heruntergeladen wird. Nachfolgende Anfragen, die normalerweise aus dem Cache bedient werden, geben keine Fortschrittsereignisse ab. Wenn die Schriftart abgelaufen ist, wird die Datei erneut heruntergeladen, für die die Fortschrittsereignisse in downloadProgressListener gestreamt werden.

 DynamicCachedFonts . cacheFontStream (
  fontUrl,
  progressListener : ( DownloadProgress progress) {},
);

`loadCachedFamilyStream`

Verwenden Sie canLoadFont , um zu überprüfen, ob die Schriftart im Cache verfügbar ist.

loadCachedFamilyStream wird verwendet, um mehrere Schriftarten als einzelne Schriftfamilie in den Fluttermotor zu laden. Diese Methode ähnelt der loadCachedFamily , gibt jedoch einen Stream zurück.

Wenn loadCachedFamilyStream mit einer einzelnen Schriftart -URL aufgerufen wird, wird progressListener nur einmal aufgerufen, wenn die Schrift in den Motor geladen wurde.

Und wenn loadCachedFamilyStream verwendet wird, um eine ganze Schriftfamilie zu laden, wird progressListener für jede Schriftart in der Familie einmal aufgerufen. In dem unten angegebenen Beispiel wird progressListener 4 Mal aufgerufen, nachdem jede Schrift in den Fluttermotor geladen wurde.

 DynamicCachedFonts . loadCachedFamilyStream (
  < String > [
    fontFamilyNameBoldUrl,
    fontFamilyNameItalicUrl,
    fontFamilyNameRegularUrl,
    fontFamilyNameThinUrl,
  ],
  fontFamily : fontFamilyName,
  progressListener : ( double progress, int totalItems, int downloadedItems) {},
);

`removeCachedFont`

Verwenden Sie removeCachedFont , um eine Schriftart dauerhaft aus dem Cache zu entfernen.

Hinweis - Dies ändert die Schrift erst dann sofort, wenn ein vollständiger App -Neustart neu startet.

Wenn Sie ihre Implementierung anpassen möchten, erweitern Sie RawDynamicCachedFonts und überschreiben Sie die statischen Methoden.

Haben Sie eine benutzerdefinierte Schriftart aus dem Firebase Cloud -Speicher? Gehen Sie für den DynamicCachedFonts.fromFirebase Constructor! Es akzeptiert einen Google Cloud -Speicherort, bei dem es sich um eine URL handelt, die mit gs:// beginnt. Ansonsten ähnelt es dem Standardkonstruktor.

Tipp: Verwenden Sie DynamicCachedFonts.toggleVerboseLogging , um detaillierte Status und Konfigurationen für das Debuggen zu protokollieren.

? Fehlerberichte und Hilfe

Wenn Sie einen Fehler finden, öffnen Sie bitte ein Problem auf GitHub oder wenn Sie Hilfe benötigen, lassen Sie uns über Github -Diskussionen diskutieren!

? Beitragen

Um die Dinge zu erleichtern, können Sie Docker Compose verwenden, um eine Entwicklerumgebung einzurichten. Führen Sie einfach docker compose run linux aus, um eine Linux Dev -Umgebung einzurichten, oder um docker compose run windows auszuführen, um eine Linux Dev -Umgebung einzurichten.