dynamic_cached_fonts Download - dynamic_cached

dynamic_cached_fonts

Baixar fonte

v1.2.0

Baixar

Fontes em cache dinâmicas

Um carregador de fontes simples e fácil de usar, mas personalizável, para usar fontes da Web.

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

Introdução

As fontes em cache dinâmicas permitem carregar dinamicamente uma fonte de qualquer URL e cache. Dessa forma, você pode reduzir o tamanho do seu pacote e carregar a fonte se e quando for necessário.

Outra vantagem de carregar dinamicamente fontes é que agora você pode fornecer uma opção facilmente aos seus usuários para escolher uma fonte de aplicativo. Isso permite um maior nível de personalização.

O cache é uma atualização de desempenho adicional, pois a fonte será baixada apenas uma vez e usada várias vezes, reduzindo a rede e o uso da bateria.

? Comece

Para usar o pacote, adicione dynamic_cached_fonts como uma dependência.

⚒️ Uso

Carregando fontes sob demanda

Você pode carregar a fonte sob demanda, por exemplo - quando uma página carrega

 @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),
)

Ou quando um botão é clicado

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

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

Se você deseja alterar o tamanho do cache ou talvez quanto tempo a fonte permanece em cache, passe no maxCacheObjects e cacheStalePeriod .

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

TextStyle.fontFamily S são aplicados somente após a chamada load() .

Calling load() mais de uma vez joga um StateError

E se você precisar carregar várias fontes, de pesos e estilos variados, como uma única família ... para isso, você pode usar o construtor DynamicCachedFonts.family .

Ele aceita uma lista de URLs, apontando para diferentes fontes na mesma família, como urls .

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

O pacote também suporta carregar as fontes como um Stream ! O loadStream retorna um único fluxo de assinatura que emite os arquivos de fonte.

loadStream aceita um retorno de chamada, downloadProgressListener , que é chamado cada vez que um evento DownloadProgress é recebido. Isso acontece apenas quando a fonte está sendo baixada do URL fornecido. Solicitações subsequentes, que geralmente são servidas do cache, não emitem nenhum evento de progresso. Se o arquivo de fonte expirou, o arquivo será baixado novamente para o qual os eventos de progresso serão transmitidos para downloadProgressListener .

Quando loadStream é chamado com um único URL de fonte, o itemCountProgressListener será chamado apenas uma vez quando a fonte for carregada no motor.

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

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

E quando loadStream é usado para carregar uma família de fontes inteira, itemCountProgressListener será chamado uma vez para todas as fontes da família. No exemplo fornecido abaixo, itemCountProgressListener será chamado 4 vezes, uma vez depois que cada fonte for carregada no motor da flutter.

 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) {},
);

Chamar loadStream mais de uma vez joga um StateError

Se você precisar de mais controle, use os métodos estáticos!

`cacheFont`

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

Você também pode passar no maxCacheObjects e cacheStalePeriod .

`canLoadFont` , `loadCachedFont` , `loadCachedFamily`

canLoadFont é usado para verificar se a fonte está disponível no cache. Geralmente é usado em combinação com os métodos loadCached* .

Primeiro, verifique se a fonte já está em cache. Se for, carregue a fonte.

 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,
  );
}

Agora, se a fonte não estiver disponível em cache, faça o download!

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

`cacheFontStream`

cacheFontStream é usado para baixar e armazenar em cache a fonte. Este método é semelhante ao cacheFont , mas retorna um único Stream de assinatura que emite o progresso do download. O download é transmitido para o retorno de chamada progressListener , que é chamado cada vez que um evento DownloadProgress é recebido. Isso acontece apenas quando a fonte está sendo baixada do URL fornecido. Solicitações subsequentes, que geralmente são servidas do cache, não emitem nenhum evento de progresso. Se o arquivo de fonte expirou, o arquivo será baixado novamente para o qual os eventos de progresso serão transmitidos para downloadProgressListener .

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

`loadCachedFamilyStream`

Use canLoadFont para verificar se a fonte está disponível no cache.

loadCachedFamilyStream é usado para carregar várias fontes no motor flutuador, como uma única família de fontes. Este método é semelhante ao loadCachedFamily , mas retorna um fluxo.

Quando loadCachedFamilyStream é chamado com um único URL de fonte, progressListener será chamado apenas uma vez quando a fonte for carregada no motor.

E quando loadCachedFamilyStream for usado para carregar uma família de fontes inteira, progressListener será chamado uma vez para todas as fontes da família. No exemplo dado abaixo, progressListener será chamado 4 vezes, uma vez depois que cada fonte for carregada no mecanismo de vibração.

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

`removeCachedFont`

Para remover uma fonte do cache permanentemente , use removeCachedFont .

Nota - Isso não altera a fonte imediatamente até um aplicativo completo reiniciar.

Finalmente, se você deseja personalizar a implementação deles, estenda RawDynamicCachedFonts e substitua os métodos estáticos.

Tem uma fonte personalizada para carregar do Firebase Cloud Storage? Vá para o DynamicCachedFonts.fromFirebase Constructor! Ele aceita um local de armazenamento no Google Cloud, que é um URL começando com gs:// . Fora isso, é semelhante ao construtor padrão.

Dica: use DynamicCachedFonts.toggleVerboseLogging para registrar status e configurações detalhadas para depuração.

? Relatórios de bugs e ajuda

Se você encontrar um bug, abra um problema no Github ou, se precisar de ajuda, vamos discutir nas discussões do Github!

? Contribuindo

Para facilitar as coisas, você pode usar o Docker Compose para configurar um ambiente de desenvolvimento. Basta executar docker compose run linux para configurar um ambiente Linux dev ou executar docker compose run windows para configurar um ambiente Linux Dev.