Flutter Animation Progress Bar

Barra de progresso da animação de vibração

Este pacote colorido de widgets de vibração pretende mostrar uma barra de progresso da animação no estilo reativo. Ele também suporta barra vertical e horizontal.

Flutter Create Contest

Este pacote também é uma submissão ao concurso Flutter Create. A regra básica deste concurso é medir o tamanho total do arquivo de dardo menor ou igual a 5kb.

Depois de abranger o arquivo comprimido, execute o seguinte comando para atualizar as dependências:

 flutter packages get

Para avaliar o tamanho total de todos os arquivos DART:

 find . -name "*.dart" ! -name "*test*"  | xargs cat | wc -c

Para avaliar apenas o código DART do pacote:

 find . -name "*.dart" ! -name "*test*" ! -path "*example*"  | xargs cat | wc -c

Para executar o aplicativo de exemplo simples com um tamanho total do código do dardo menor ou igual a 5kb:

 cd example
flutter clean
flutter run

App de reinicialização a quente com "R" para reproduzir a animação

Para executar o aplicativo de exemplo completo:

 cd example
mv lib/main.dart tmp && mv lib/main.dart.bk lib/main.dart && mv tmp lib/main.dart.bk
flutter clean
flutter run

Usando botões de ação flutuante embutidos para alterar o valor e ver o efeito

Começando

Para usar este pacote, importe -se

 import 'package:flutter_animation_progress_bar/flutter_animation_progress_bar.dart' ;

A implementação básica pode ser feita como o código abaixo:

 import 'package:flutter/widgets.dart' ;
import 'package:flutter_animation_progress_bar/flutter_animation_progress_bar.dart' ;

void main () {
  runApp (
    Center (
        child : FAProgressBar (
      currentValue : 80 ,
      displayText : '%' ,
    )),
  );
}

Exemplo de aplicativo

Você pode encontrar mais exemplos do exemplo de aplicativo

API

Nesta tabela, você pode encontrar todos os atributos fornecidos por este pacote:

Atributo	Valor padrão	Descrição
CurrentValue	0	Defina o valor atual para a barra de progresso. Esse valor deve estar em estado de forma que, sempre que o SetState () for chamado, a barra de progresso desencadear uma animação do mais recente CurrentValue para o novo CurrentValue
maxvalue	100	Valor máximo a ser exibido como barra de progresso. O valor atual pode ser maior que o valor máximo
tamanho	30	A altura da barra se a direção no eixo.horizontal. A largura da barra se a direção no eixo.vertical
AnimatedDuration	Duração da constituição (milissegundos: 300)	Defina a duração para um ciclo de animação
direção	Axis.horizontal	A barra pode estar no eixo .
VERTICALDIRECÇÃO	VerticalDirection.Down	Com a direção vertical, a barra pode ser verticalDirection.Up ou VerticalDirection.
fronteira	8	Defina o raio da borda da barra
fronteira	null	Defina o estilo de fronteira da barra por boxborder
BackgroundColor	Const Color (0x00ffffff)	Defina a cor do fundo da barra
ProgressColor	Const Color (0XFFFA7268)	Defina a cor da barra progredindo
progresso graduado	null	Defina o gradiente de progresso da barra. Substitui o progressColor
ChangeColorValue	null	Defina um valor que a cor do progresso deve ser alterada para [0 --- Blue ---- [ 70 ] -D-100]
ChangeProgressColor	Const Color (0xff5f4b8b)	Cor que a cor do progresso será alterada para, sempre que o CurrentValue maior que o ChangeColorValue
DisplayText	null	Texto para exibir pertencente ao CurrentValue. Exemplos: % -> 20% °F -> 80°F
DisplayTextStyle	...	TextStyle do DisplayText

Objetos

 class FAProgressBar {

  final double currentValue;
  final double maxValue;
  final double size;
  final Duration animatedDuration;
  final Axis direction;
  final VerticalDirection verticalDirection;
  final double borderRadius;
  final BoxBorder border;
  final Color backgroundColor;
  final Color progressColor;
  final Gradient progressGradient;
  final int changeColorValue;
  final Color changeProgressColor;
  final String displayText;
  final TextStyle displayTextStyle;
}

Opinião

Sinta -se à vontade para deixar algum feedback para ajudar a apoiar este pacote?