FLUI Toast é um Widget de feedback para o Flutter

FLUI Toast é um widget de feedback da suíte FLUI.

Uma classe FLToastDefaults suporta a configuração do estilo de exibição de Toast, posição, duração da exibição, modo escuro e outros comportamentos.

O que é uma Notificação Toast?

Um Toast é a melhor maneira de você notificar os usuários sobre alterações ou atualizações realizadas após alguma interação, por exemplo, salvar informações no banco de dados, uma nova mensagem ou a resposta de algum comando assíncrono longo.

Esses Feedbacks visuais são importantes para que o usuário compreenda o funcionamento do aplicativo e são menos invasivos do que as notificações tradicionais do Android e iOS.

FLUI Toast é um Widget de feedback para o Flutter

Para facilitar a vida do desenvolvedor o FLUI oferece o FLToastDefaults, onde é possível definir o padrão visual e de comportamento das mensagens exibidas pelo Widget Toast, como a duração da exibição da mensagem com a propriedade showDuration, o padrão de cores com darkColor e darkBackgroundColor, a opacidade da mensagem com backgroundOpacity e a posição com position. é um Widget muito personalizável.

A configuração padrão do FLToastDefaults é a seguinte:

%MINIFYHTML8f605c54130beae10b61a26fc89b889017%
const FLToastDefaults({ this.showDuration = const Duration(milliseconds: 1500), this.darkColor = Colors.white, this.darkBackgroundColor = Colors.black87, this.backgroundOpacity = 0.8, this.lightColor = const Color(0xFF2F2F2F), this.lightBackgroundColor = const Color(0xFFE0E0E0), this.position = FLToastPosition.center, this.style = FLToastStyle.dark, this.dismissOtherToast = true, this.hideWithTap = true, this.textDirection = TextDirection.ltr, this.topOffset = kToolbarHeight + 10, this.bottomOffset = 10, });

FLToastProvider fornece a capacidade de exibir Toast na árvore de sub-widget. Geralmente, atua como o nó pai do MaterialApp.

class _MyAppState extends State<MyApp> { FLToastDefaults _toastDefaults = FLToastDefaults(); @override Widget build(BuildContext context) { return FLToastProvider( defaults: _toastDefaults, child: MaterialApp( title: 'FLUI', theme: $YOUR_THEME routes: $ROUTES ) ); }

Para mostrar o Toast, você precisa usar os métodos estáticos do FLToast.

Exibindo Toast de Texto

Esta é uma ótima opção para alertas de comandos que rodam assíncronos ou operações longas. Basicamente exibe uma mensagem no centro da tela:

FLToast.text(text: 'Here is text'); /// or FLToast.showText(text: 'Here is text', position: FLToastPosition.xxx, duration: Duration(seconds: 5), style: FLToastStyle.xxx); /// shortcut FLToast.showText(text: 'Here is text');

Exibindo FLUI Toast com Carregamento

Esta é uma boa opção para usar com Future, pois permite ao usuário acompanhar o carregamento de informações, etc.

var dismiss = FLToast.loading(text: 'Loading...'); /// do something... Future.delayed(Duration(seconds: 2), () { /// hide toast dismiss(); });

Exibindo FLUI Toast de Alerta, Erro e Sucesso

As tês opções são: infoerror e success. Basicamente a mensagem fornecida em text é exibida com um ícone na parte superior.

/// info FLToast.info(text: 'Some info'); /// success FLToast.success(text: 'Fetch success'); /// error FLToast.error(text: 'Something was wrong');

Finalizando

O FLUI é excelente e possui widgets fantásticos como o Toast. A cada nova versão os Widgets ficam mais estáveis e completos e permitem que você use componentes visuais que se encaixam perfeitamente nos seus apps.

Recomendo 😉

Um braço!

Deixe uma resposta