Progress not shown

[xstable]

Here is a little Gif from my app. The Progress is not shown while in action. Only if finished, it will got visible:

<AnimatedBar
                progress={this.state.progress}
                height={22}
                borderColor="#DDD"
                barColor="tomato"
                borderRadius={0}
                borderWidth={2}
                duration={500}
            >
                <View style={[styles.row, styles.center]}>
                    <Text style={[styles.barText, { fontSize: 12 }]}>
                        {Math.round(this.state.progress * 100)}%
                    </Text>
                </View>
            </AnimatedBar>

package.json

"react": "16.3.1",
"react-native": "^0.55.3",

[victor-carv]

What is the value of your progress? I had this same problem because my progress was 50% and I was using: progress={50} But using progress={.5} worked for me.

[xstable]

Year, I did it in a similar way.

const widthInterpolated = this.animation.interpolate({
      inputRange: [0, this.props.maxTickets * 0.15, this.props.maxTickets * 0.5, this.props.maxTickets],
      outputRange: ['100%', '75%', '50%', '0%'],
      extrapolate: 'clamp',
    });

    const color = this.animation.interpolate({
      inputRange: [0, this.props.maxTickets * 0.15, this.props.maxTickets],
      outputRange: [cfg.ticketBar_full, cfg.ticketBar_medium, cfg.ticketBar_low],
    });

[browniefed]

Sorry the progress value should be between 0 and 1, not 0 and 100. Should be documneted better.