O componente ProgressBar é uma barra de progresso utilizada em alguns lugares do app. Este componente possui as seguintes propriedades:
Props
showDetails: uma propriedade booleana que determina se a barra de progresso deve exibir detalhes como o nome da tarefa e o progresso atual. O valor padrão é true.
actualProgress: um número que representa o progresso atual da tarefa.
objective: um número que representa o objetivo ou total da tarefa.
color: uma string que representa a cor da barra de progresso.
label: uma string que representa o nome ou descrição da tarefa.
style: um objeto que representa as propriedades CSS a serem aplicadas no componente.
Funcionamento
A barra de progresso é calculada com base no progresso atual e no objetivo da tarefa, e é exibida na cor especificada pela propriedade color. Se a propriedade showDetails for definida como true, o componente exibe o nome da tarefa e o progresso atual em percentual.
Exemplo de uso
import React from 'react';
import {ProgressBar} from '@vizir-banking/banking-app-core/dist/fuel-design';
function App() {
return (
<View>
<Text>Minha barra de progresso</Text>
<ProgressBar
actualProgress={50}
objective={100}
color="blue"
label="Tarefa 1"
/>
</View>
);
}
export default App;
Este exemplo exibe uma barra de progresso com 50% de progresso, um objetivo de 100 e uma cor azul. O componente também exibe o nome da tarefa "Tarefa 1" e o progresso atual de 50%.
Want to print your doc? This is not the way.
Try clicking the ⋯ next to your doc name or using a keyboard shortcut (