React VR Image Border disappears after more elements appear

I have a view with the following markup. What's weird is that if I include more than one of these views in my module, some of the borders will disappear. What's even stranger to me is that the borders are all on the page loading, but as soon as all the images are finished, I lose some borders. Does anyone know why I might lose my borders when more image tags are added? I have attached a photo of what I see below.

      <View style={{
        flex: 1,
        flexDirection: 'row'
      }}>
        <Image source={asset('kw1.jpg')}
               style={{
                borderWidth: 0.1,
                borderColor: 'red',
                width: 1,
                height: 1,
                transform: [{translate: [0, 0, -3]}, {rotateY: 30}]
               }}
        />

        <Image source={asset('kw2.jpg')}
               style={{
                borderWidth: 0.1,
                borderColor: 'red',
                width: 1,
                height: 1,
                transform: [{translate: [0, 0, -3]}, {rotateY: 0}]
               }}
        />

        <Image source={asset('kw3.jpg')}
               style={{
                borderWidth: 0.1,
                borderColor: 'red',
                width: 1,
                height: 1,
                transform: [{translate: [0, 0, -3]}, {rotateY: -30}]
               }}
        />

        <Image source={asset('kw4.jpg')}
               style={{
                borderWidth: 0.1,
                borderColor: 'red',
                width: 1,
                height: 1,
                transform: [{translate: [0, 0, -3]}, {rotateY: -30}]
               }}
        />
      </View>