Circular Progress Indicator Fully Filled When Value is Close to 100 (e.g., 95 or 98) i am using progress indicator with dashedStrokeConfig
The indicator is only fully filled when the value is 100 but the issue it it showing fully filed when the value greater then 96 ( e.g 98 , 99 )
Steps to reproduce
=> render the circular progress component with the value is greater then 96 ( e.g 98 , 99 ) => use the strokeDashedConfig as shown in the code snippet
<CircularProgress value={98} radius={moderateScale(30)} inActiveStrokeOpacity={0.5} activeStrokeWidth={moderateScale(8)} inActiveStrokeWidth={moderateScale(10)} progressValueStyle={{fontFamily: Fonts.Roboto.Medium, color: 'white'}} // activeStrokeSecondaryColor="yellow" inActiveStrokeColor="black" duration={2000} valueSuffix={'%'} dashedStrokeConfig={{ count: 50, width: 1, }} strokeColorConfig={[ {color: 'red', value: 0}, {color: 'yellow', value: 50}, {color: 'green', value: 100}, ]} />
=> using the higher count in dashedStrokeConfig config like 100 the dash become to close and feel like it losing the dashed
Appearance