Black background on Images when using borderRadius property in Styles

[AbdullahQureshi1080]

Hi, I have been using react-native-scalable-image for my images but there is a weird black background when I am providing both width and height to the ScaleableComponent.

Using react-native 0.64.2 "react-native-scalable-image": "^1.1.0",

 <ScalableImage
   source={{
             uri: item.ordered_items[0].image_url,
    }}
    width={widthScaleSub(64) / 2}
    height={heightScale(140)}
    style={[
      styles.listCardFirstImage,
     ]}
  resizeMode="contain"
    />

Styles

 listCardFirstImage: {
      width: widthScaleSub(64) / 2,
      height: heightScale(140),  
      backgroundColor: color.bgDark,
      borderRadius: heightScale(10),
   },

Note: When removing the borderRadius the black background is gone, what is happening in the background.

Some context or help would be awesome.