width ='100％'原生圖像的原始寬度小於最大屏幕尺寸

Question

我在反應本機v.42使用width ='100％'爲iphone 7創建的圖像2x（750px寬度）。這適用於iphone 7，但如果我查看7plus上的圖像，它們會在頂部和底部裁剪。爲了防止這種情況，我必須將圖像保存爲7plus（818px @ 2x）。

有誰知道如何使用width ='100％'，並且圖像比例尺超出其最大原始尺寸？更改調整大小模式不起作用。如果我可以幫忙，我也不想使用任何插件。

我知道，我可以明確地定義基於窗口尺寸的高度和寬度：

import { Dimensions } from 'react-native' 

    const { height, width } = Dimensions.get('window') 

    export { 
     height as deviceHeight, 
     width as deviceWidth, 

} 

，並使用高度的比率計算，但我正在尋找一種方式來沒有申報的尺寸爲高度（基本上是一個height: auto）。

Answer 1

這些東西你可以嘗試。

試着告訴圖像覆蓋屏幕

resizeMode: 'cover' 

因爲這是所有Flexbox的佈局，您可以使用對齊自我告訴孩子伸展

alignSelf: 'stretch' 

如果沒有這些工作，爲你..我之前完成的另一個替代方法是去除靜態尺寸，使其自然生長（通過爲寬度和高度指定null）

width: null, 
height: null 

Facebook docs on support