BorderColor не выбирает цвет linearGradient на Android

Я пытаюсь создать круг с изображением внутри, чтобы его граница была красочной, поэтому я использовал LinearGradient.

Я использовал это руководство:

https://codeburst.io/linear-gradient-for-border-color-in-react-native-5bcab3eea1c9

проблема в том, что в iOS он работает нормально, как вы можете видеть на этом изображении:

https://imgur.com/a/Tz0uEcC

но на android, когда я использую borderWidth и выбираю borderColor прозрачного, borderColor выглядит как тень, а не выбирает цвет LinearGradient по какой-то причине ...

вот андроид: https://imgur.com/a/qG1LJBt

Что я делаю неправильно?

        <LinearGradient
          colors={['#ac8af8', '#cca5e7']}
          start={{ x: 0.0, y: 1.0 }} end={{ x: 1.0, y: 1.0 }}
          style={styles.profilePhotoContainer}
        >
          <TouchableOpacity onPress={this.handleEditProfileImage.bind(this)}>
            <Image
          style={[styles.profileImage]}
          source={this.state.profilePhoto}
        />
          </TouchableOpacity>
        </LinearGradient>

const styles = StyleSheet.create({
profilePhotoContainer: {
    zIndex: 5,
    position: 'absolute',
    top: Dimensions.get('window').height * .13,
    left: Dimensions.get('window').width / 2 - Dimensions.get('window').width * .13,
    elevation: 4,
    borderRadius: 75,
    borderWidth: 4,
    overflow: "hidden" ,
    borderColor: 'transparent',
  },
profileImage: {
    zIndex: 5,
    width: 100,
    height: 100,
    borderWidth: 1,
    borderColor: 'transparent',
    backgroundColor: '#FFF',
    flex:1,
    resizeMode:'contain',
  },

})

Спасибо вам за помощь