White Line in Morse Varient

[mktufan21]

Hi @kolking , when we are using morse there is a white-line , please check the image, any idea how we can fix it

<PageIndicator count={images.length} current={currentPage} color={'#D3DAE1'} activeColor={'#606C70'} size={moderateScale(8,0.3)} variant='morse' dashSize={moderateScale(8,0.3)*4} borderRadius={moderateScale(8,0.3)/2} />

[kolking]

I suppose this is caused by some non-integer values produced by the moderateScale() function. Try something like this:

const size = Math.round(moderateScale(8,0.3));

<PageIndicator count={images.length} current={currentPage} color={'#D3DAE1'} activeColor={'#606C70'} size={size} variant='morse' dashSize={size*4} borderRadius={size/2} />

Btw, you don’t have to explicitly define dashSize={size*4} and borderRadius={size/2} since these are default. Thus, the below will produce the same result as above:

const size = Math.round(moderateScale(8,0.3));

<PageIndicator count={images.length} current={currentPage} color={'#D3DAE1'} activeColor={'#606C70'} size={size} variant='morse' />

[chrissikora]

Actually I am experiencing similar behaviour - very thin white line and my values are integers:

Values:

size={8}
dashSize={18}

[kolking]

@chrissikora thanks for letting me know! I will do my best to figure out and fix the issue asap.

[kolking]

@chrissikora could you please provide more information since I wasn't able to reproduce the issue with the size and dashSize values you've mentioned. Are you seeing this in iOS or Android? Simulator or real device? What are the full list of props you're using for the component?

[mktufan21]

@kolking little bit late , but this rounded does not fix the issue . for your above comment the issue I am facing in android emulator

[kolking]

@mktufan21 @chrissikora the issue should be resolved in v2.2.0. Appreciate your feedback, thanks!