@computools/react-native-circular-progress v0.1.1

@computools/react-native-circular-progress

@computools/react-native-circular-progress

Installation

npm install @computools/react-native-circular-progress

Usage

import { CircularProgress } from '@computools/react-native-circular-progress';

// ...

const percentRatio = 100;
const totalDeaths = 69;
const totalConfirmed = 100;

export const App = () => (
  <SafeAreaView style={styles.container}>
    <CircularProgress
      size={64}
      width={3}
      fill={Math.round((totalDeaths / totalConfirmed) * percentRatio)}
      tintColor={'yellow'}
      dangerTintColor={'red'}
      dangerValue={50}
      lineCap="round"
      backgroundColor={'silver'}
    >
      {(fill: number) => <Text>{fill}%</Text>}
    </CircularProgress>
  </SafeAreaView>
);

const styles = StyleSheet.create({
  container: {
    flex: 1,
    alignItems: 'center',
    justifyContent: 'center',
  },
});

Example

Contributing

See the contributing guide to learn how to contribute to the repository and the development workflow.

License

MIT