React Native Image resizeMode ='contain'使Android设备和模拟器上的某些图像失真

React Native resizeMode='contain'组件中的Image使Android设备和模拟器上的某些图像失真。对于大多数图像,它会在PNG图像背景中创建扭曲的线。我尝试了许多不同的图像,也尝试过调整它们的大小,但是没有什么能解决扭曲的彩色线条的问题。 注意:所有这些图像在iOS上看起来都很好。

Andoid Nexus 10 API 28 emulator

Amazon Fire Tablet 8th Gen.

iPad Pro (11-inch) simulator

这是我的Image组件的代码。我正在尝试为Pizza应用程序创建图像的网格视图。

<View style={{
            flex: 1,flexDirection: 'column',justifyContent: 'center',alignItems: 'stretch',}}>
            {/* ==================================First Row ===================================*/}
            <View style={{ height: 600,flexDirection: 'row',backgroundColor: 'transparent',marginVertical: 10 }}>
              <View style={{
                flex: 1,marginHorizontal: 20,borderWidth: 2,borderColor: 'lightgray',borderRadius: 10
              }}>
                <Image
                  style={{
                    flex: 1,height: undefined,width: undefined,borderColor: 'black',borderWidth: 1,}}
                  source={require('./Images/pizza5.png')}
                  resizeMode='contain'>
                </Image>
                <Text style={{ fontSize: 20,marginVertical: 5,marginHorizontal: 10 }}>Pizza 1</Text>
                <Text style={{ fontSize: 17,marginTop: 15,marginBottom: 10,marginHorizontal: 10 }}>$10.99</Text>
              </View>
              <View style={{
                flex: 1,borderRadius: 10,marginRight: 20,}}>
                <Image
                  style={{
                    flex: 1,borderWidth: 1
                  }}
                  source={require('./Images/pizza1copy.png')}
                  resizeMode='contain'>
                </Image>
                <Text style={{ fontSize: 20,marginHorizontal: 10 }}>Pizza 2</Text>
                <Text style={{ fontSize: 17,marginHorizontal: 10 }}>$10.99</Text>
              </View>
            </View>
          </View>
gajba 回答:React Native Image resizeMode ='contain'使Android设备和模拟器上的某些图像失真

尝试删除borderColor: 'black',borderWidth: 1并将其设置为其他父项View

本文链接:https://www.f2er.com/3091743.html

大家都在问