ImageBackground 不接受 ResizeMode答案

【问题标题】：ImageBackground doesn't accept ResizeModeImageBackground 不接受 ResizeMode
【发布时间】：2018-03-10 10:55:19
【问题描述】：

这里的任何人都可以帮助我使 resizeMode 与<ImageBackground> 一起工作吗？

resizeMode 被应用到View 时出错，显然不支持它。

但我需要找到一种解决方法，因为我发现使用<Image /> 作为带有信息的块的背景非常复杂。

提前致谢！

【问题讨论】：

标签： react-native

【解决方案1】：

注意：在我写这篇文章的时候，<ImageBackground /> 是一个尚未发布的未记录功能。但它现在确实存在。

据我所知，没有<ImageBackground />，但您可以创建一个。

如果您尝试将图像设置为某些文本的背景，那么<Image /> 是最好的方法。你觉得哪里太复杂了？像这样的东西应该可以工作......

class BackgroundImage extends Component {

    render() {
        return (
            <Image 
                source={this.props.src}
                style={styles.backgroundImage}>

                    {this.props.children}

            </Image>
        )
    }
}

const styles = StyleSheet.create({
    backgroundImage: {
        flex: 1,
        width: null,
        height: null,
        resizeMode: 'cover'
    }
});

那你就这样用吧……

<BackgroundImage
    src={require('./background.jpg')}>

    <Text>Your Content Goes Here!</Text>
</BackgroundImage>

【讨论】：

您好！感谢您的回复。 <ImageBackground />actually exists。但我会尝试你的解决方案，并尽快让你知道！谢谢！
有趣，我在文档中没有找到它。它是无证的吗？你是怎么知道的？
给你facebook.github.io/react-native/docs/…

【解决方案2】：

<ImageBackground 
  style={[styles.image]} 
  source={{ uri: url }} 
  imageStyle={{resizeMode: 'contain'}}
>
  // other components here
</ImageBackground>

希望对你有帮助！

【讨论】：