the img will hide in android

[zSergeant]

<AnimatedCircularProgress size={64} width={2} backgroundWidth={2} fill={34} tintColor="#00e0ff" backgroundColor="#3d5875" lineCap="round" rotation={0} > {fill => <Image style={{ borderRadius: 27, width: 54, height: 54 }} source={require('../images/photo.png')} /> } </AnimatedCircularProgress>

[zSergeant]

ios

[zSergeant]

I changed the style of childContainerStyle in CircularProgress; const childContainerStyle = { position: 'absolute', left: width, top: width, width: offset, height: offset, borderRadius: offset / 2, alignItems: 'center', justifyContent: 'center', overflow: 'hidden', zIndex:0 };

[navneet7723]

image works fine make sure your image is smaller than the component AnimatedCircularProgress size={200} width={15} rotation={0} fill={Store.connectProgress} tintColor={Color.rightGreen} backgroundColor={Color.superlight} lineCap="round" > {fill => ( <View style={styles.imageTextContainer}> <Image source={bikeImage} style={{width: scale(71), height: verticalScale(60),}} /> <Text style={styles.imageText}> {Store.selectedBike.device_id} {fill === 51 ? 50 : Math.round(fill)}% </Text> </View> )} </AnimatedCircularProgress