Question

ImageBackground采用一个图像，我可以添加具有图像和一些文本的子视图。然而，我想要的是背景工作，如图像的carousal，而子视图保持原样反应。有没有办法实现这个目标？

我现在拥有的东西：

<ImageBackground style= {styles.headerBackground} source={require('./img/headerBg.jpg')}>
    <View style={styles.top}>
        <Avatar
            small
            rounded
            icon={{name: 'menu'}}
            onPress={() => console.log("Works!")}
            activeOpacity={0.7}
        />               
    </View>
    <View style = {styles.header}>
        <Avatar
            large
            source={require('./img/profBg.jpg')}
            avatarStyle={{ borderWidth: 3, borderColor: 'white',  borderStyle:'solid' }}
            onPress={() => console.log("Works!")}
            activeOpacity={0.7}
        />
        <Text style={styles.name}>Name</Text>
        <Text style={styles.message}> Personal message</Text>
    </View>
</ImageBackground>

我不想在背景中有一张图像，而是想要使用carousal / slide图像。有人可以帮忙吗？

Answer 1

<ImageBackground>只是<View>里面有<Image style={{position:'absolute'}} />。来自ImageBackground - https://github.com/facebook/react-native/blob/c6b96c0df789717d53ec520ad28ba0ae00db6ec2/Libraries/Image/ImageBackground.js#L63

的来源

所以你可以做的是同样的，只需要放置多个图像，也许像这样的父母：

<View>
    <View style={{ position:'absolute' }}>
        <Image />
        <Image />
        <Image />
        <Image />
    </View>
</View>

React native - 滑动背景图片顶部有一些静态内容

1 个答案: