ProgressBar.js 707 B

123456789101112131415161718192021222324252627282930
  1. import React from 'react' // eslint-disable-line no-unused-vars
  2. import { View, Text } from 'react-native'
  3. export default function ProgressBar (props) {
  4. const progress = props.progress
  5. const colorGreen = '#0b8600'
  6. const colorBlue = '#006bb7'
  7. return (
  8. <View style={{
  9. marginTop: 15,
  10. marginBottom: 15
  11. }}>
  12. <View
  13. style={{
  14. height: 5,
  15. overflow: 'hidden',
  16. backgroundColor: '#dee1e3'
  17. }}>
  18. <View style={{
  19. height: 5,
  20. backgroundColor: progress === 100 ? colorGreen : colorBlue,
  21. width: progress + '%'
  22. }} />
  23. </View>
  24. <Text>{progress ? progress + '%' : null}</Text>
  25. </View>
  26. )
  27. }