在RN版本0.46版本的时候添加了ImageBackground控件。ImageBackground可以设置背景图片，使用方法和image一样，里面嵌套了其他的组件
import React from "react";
import { ImageBackground, StyleSheet, Text, View } from "react-native";
const image = { uri: "https://zh-hans.reactjs.org/logo-og.png" };
const App = () => (
<View style={styles.container}>
<ImageBackground source={image} style={styles.image}>
<Text style={styles.text}>Inside</Text>
</ImageBackground>
</View>
);
const styles = StyleSheet.create({
container: {
flex: 1,
flexDirection: "column"
},
image: {
flex: 1,
resizeMode: "cover",
justifyContent: "center"
},
text: {
color: "white",
fontSize: 42,
fontWeight: "bold",
textAlign: "center",
background: "#000000a0"
}
});
export default App;
参考链接：
https://www.reactnative.cn/docs/imagebackground文章来源：https://www.toymoban.com/news/detail-614591.html
https://chat.xutongbao.top/ 文章来源地址https://www.toymoban.com/news/detail-614591.html
到了这里，关于RN 设置背景图片（使用ImageBackground组件）的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！
