borderRadius in ImageBackground changes randomly REACT NATIVE

Question

I'm using React native for make an app, and I'm using ImageBackground component to insert an image, like a card. The problem: when I insert images with different resolution my borderRadius changes and this differ to others, I'm looking for inserting images with different resolutions in my card and keep the border radius equal but this not work.

 <ImageBackground
        source={{ uri: item.image}}
        style={{
          height: SCREEN_HEIGHT * 0.14,
          width: SCREEN_WIDTH * 0.6,
          marginRight: 15,
          marginLeft:5,
        }}
        imageStyle={{borderRadius: 10}} // border radius for HEREE!!!!!
        resizeMode={'stretch'}
      >
        <View style={{
          height: (SCREEN_HEIGHT * 0.15)/2.5,//Here we need to specify the height of blurred part
          overflow: 'hidden',
          width: '100%',
          position: 'absolute',
          bottom: 0,
          borderRadius: 15 //borderRadius for  blur effect container
        }}>
          <ImageBackground
            source={{ uri: item.image}}
            blurRadius={10}
            style={{
              height:  SCREEN_HEIGHT * 0.15,
              width: '100%' ,// SCREEN_WIDTH * 0.6,
              position: 'absolute',
              bottom: 0,
              justifyContent: 'flex-end'
            }}
            resizeMode={'stretch'}
          >
            <View style={{marginBottom: 10}}>
              <TextContainer>{item.name}</TextContainer>
              <ButtonArrow>
                <ArrowRight name="arrow-forward-outline" size={normalize(15)}/>
              </ButtonArrow>
            </View>
          </ImageBackground>
        </View>
      </ImageBackground>

Result: my cards has different radius, any suggestion?

IMAGE: [1]: https://i.stack.imgur.com/2XNoa.png

Answer 1

The solution was change the resizeMode from Stretch to cover, however this applied variations in how I see the image